Krijimi i një forme në HTML. Format HTML Formulari i hyrjes çnjerëzore html

Vetë formulari zakonisht synon të marrë informacion nga përdoruesi për dërgimin e mëtejshëm të tij në server, ku të dhënat e formularit merren nga programi mbajtës. Një program i tillë mund të shkruhet në çdo gjuhë programimi nga ana e serverit si PHP, Perl, etj. Adresa e programit tregohet në atributin e veprimit të etiketës, siç tregohet në shembullin 1.

Shembulli 1: Dorëzimi i të dhënave të formularit

HTML5 IE Cr Op Sa Fx

Të dhënat e formularit

Në këtë shembull, të dhënat e formularit të treguara nga atributi i emrit (hyrja dhe fjalëkalimi) do t'i kalohen skedarit në /example/handler.php. Nëse atributi i veprimit nuk është specifikuar, atëherë transferimi ndodh në adresën e faqes aktuale.

Transferimi në server ndodh në dy metoda të ndryshme: GET dhe POST Për të vendosur metodën në etiketë, përdoret atributi i metodës dhe vlerat e tij janë fjalët kyçe get dhe post. Nëse atributi i metodës nuk është specifikuar, atëherë si parazgjedhje të dhënat dërgohen në server duke përdorur metodën GET. Në tabelë Figura 1 tregon ndryshimet midis këtyre metodave.

Cila metodë përdoret mund të përcaktohet lehtësisht nga shiriti i adresave të shfletuesit. Nëse në të shfaqet një pikëpyetje dhe adresa duket kështu, atëherë kjo është padyshim një GET.

http://www.google.ru/search?q=%D1%81%D0%B8%D1%81%D1%8C%D0%BA%D0%B8&ie=utf-8

Një kombinim unik i parametrave në shiritin e adresave identifikon në mënyrë unike një faqe, kështu që faqet me adresat ?q=node/add dhe ?q=node konsiderohen të ndryshme. Kjo veçori përdoret nga sistemet e menaxhimit të përmbajtjes (CMS, sistemi i menaxhimit të përmbajtjes) për të krijuar shumë faqe në internet. Në realitet, përdoret një skedar i vetëm që merr një kërkesë GET dhe, sipas tij, gjeneron përmbajtjen e dokumentit.

Më poshtë renditen aplikimet tipike të këtyre metodave në sajte.

Transferimi i të dhënave të vogla të tekstit në server; Kërkimi i faqes.

Motorët e kërkimit dhe formularët e kërkimit të faqeve dërgohen gjithmonë duke përdorur metodën GET, kjo ju lejon të ndani rezultatet e kërkimit me miqtë, të dërgoni një lidhje me postë ose ta postoni atë në një forum.

Transferimi i skedarëve (foto, arkiva, programe, etj.); dërgimi i komenteve; shtimi dhe redaktimi i mesazheve në forum, blog.

Si parazgjedhje, formulari përpunohet në skedën aktuale të shfletuesit, megjithatë, kur dorëzoni formularin, mund ta ndryshoni këtë parametër dhe të hapni mbajtësin e formularit në një skedë ose kornizë të re; Kjo sjellje specifikohet përmes "emrit të kontekstit", që është vlera e atributit të synuar të etiketës. Vlerat e njohura janë _blank për të hapur formularin në një dritare ose skedë të re, dhe emri i kornizës, i cili specifikohet nga atributi i emrit të etiketës (shembulli 2).

Shembulli 2: Hapja e një formulari në një kornizë

HTML5 IE Cr Op Sa Fx

Duke përdorur një kornizë

Në këtë shembull, kur klikoni butonin "Dërgo", rezultati i paraqitjes së formularit hapet në një kornizë të quajtur zona .

Elementet e formës tradicionalisht ndodhen brenda etiketës, duke përcaktuar kështu të dhënat që do të transmetohen në server. Në të njëjtën kohë, HTML5 ka aftësinë për të ndarë një formë nga elementët e saj. Kjo është bërë për lehtësi dhe shkathtësi, kështu që një paraqitje komplekse mund të përmbajë disa forma që nuk duhet të kryqëzohen me njëra-tjetrën, ose, për shembull, disa elementë shfaqen duke përdorur skriptet në një vend të faqes, dhe vetë forma ndodhet në një tjetër. . Lidhja ndërmjet formës dhe elementeve të saj ndodh në këtë rast përmes identifikuesit të formës dhe elementeve duhet t'i shtohet atributi i formës me vlerë të barabartë me këtë identifikues (shembulli 3).

Shembulli 3: Lidhja e një formulari me fushat

HTML5 IE Cr Op Sa Fx

Forma

Në këtë shembull, etiketa identifikohet në mënyrë unike përmes identifikuesit auth, dhe forma = "auth" u shtohet fushave që duhet të dorëzohen përmes formularit. Në këtë rast, sjellja e elementeve nuk ndryshon kur klikohet butoni, hyrja dhe fjalëkalimi dërgohen te mbajtësi i handler.php.

Megjithëse parametrat e paraqitjes së formularit janë specifikuar tradicionalisht në etiketë, ato gjithashtu mund të transferohen në butonat e paraqitjes së formularit ( dhe ). Për këtë, përdoret një grup atributesh formimi , formametoda , formenctype dhe formatarget, të cilat janë analoge të atributeve përkatëse pa prefiksin e formës. Shembulli 4 tregon përdorimin e këtyre atributeve.

Shembulli 4: Dorëzimi i një formulari

HTML5 IE Cr Op Sa Fx

Dorëzimi i një formulari

Të gjitha atributet e reja të formës nuk mbështeten nga disa shfletues, veçanërisht Internet Explorer dhe Safari.

Pershendetje te gjitheve. Pra, ne kemi mësuar disa elementë për të krijuar forma. Është koha për të kombinuar njohuritë tona për të zgjidhur një problem më të madh. Le të krijojmë formën më të thjeshtë për autorizim në sit. Për ta bërë këtë, na duhen dy fusha, ne krijojmë dhe bashkojmë nënshkrimet në to.

Fusha e parë është për hyrjen, e dyta është për fjalëkalimin. Dhe me të dytin nuk është aq e thjeshtë. Sepse për momentin është vetëm një fushë e futjes së tekstit.

Rezultati në shfletues:

Në mënyrë që teksti i futur në të të zëvendësohet me yll, siç është zakon për një fushë të këtij lloji, duhet të bëni një veprim të thjeshtë. Gjegjësisht, zëvendësoni vlerën e atributit type me fjalëkalimin:

Rezultati:

Ja ku shkoni. Formulari ynë është pothuajse gati. Tani, për të përfunduar krijimin e tij, duhet të krijoni një buton që do të përdoret për të dorëzuar formularin. Problemi zgjidhet duke përdorur një etiketë me tipin Submit .

Nëse butoni duhet të ketë një lloj mbishkrimi, atëherë mund të bëhet duke përdorur atributin e vlerës. Nëse do ta emërtoni ose jo butonin varet nga ju, por nëse e bëni këtë, serveri do ta marrë atë emër si dhe vlerën e butonit.

Si rregull, ekziston nevoja për një emër butoni për paraqitjen e formularit kur formulari ka disa butona, secili prej të cilëve kryen një veprim specifik. Falë kësaj, serveri, duke marrë emrin dhe vlerën e butonit nga shfletuesi, kupton se cilin buton klikoi përdoruesi dhe çfarë, në përputhje me rrethanat, duhet të bëhet.

Si rezultat, kodi për formularin tonë do të jetë si më poshtë:

Rezultati në shfletues:

Këtu është një shembull i kodit të faqes së hyrjes html. Në këtë shembull, ne kemi shfaqur një fushë teksti, Fjalëkalimin, butonin Reset dhe butonin Hyrja. Ne kemi përdorur butonin Reset që rivendos të gjitha fushat në bosh. Ne kemi përdorur vlefshmërinë JavaScript në faqen e hyrjes. Ne kemi vendosur vlerën e emrit të përdoruesit dhe fjalëkalimit.

Këtu është një shembull i kodit të faqes së hyrjes html. Në këtë shembull, ne kemi shfaqur një fushë teksti, Fjalëkalimin, butonin Reset dhe butonin Hyrja. Ne kemi përdorur butonin Reset që rivendos të gjitha fushat në bosh. Ne kemi përdorur vërtetimin JavaScript në faqen e hyrjes. Ne kemi vendosur vlerën e emrit të përdoruesit dhe fjalëkalimit. Nëse një person fut një emër përdoruesi ose fjalëkalim të gabuar ose të dyja, do të shfaqet një mesazh gabimi me "Gabim: Emri i përdoruesit ose fjalëkalimi i gabuar". Derisa personi të futë emrin e saktë të përdoruesit dhe fjalëkalimin, ai nuk do të identifikohet.

Pasi të vendosni emrin e përdoruesit dhe fjalëkalimin e saktë, do të ridrejtoheni në një faqe tjetër.

Faqja e identifikimit përdoret në shumicën e faqeve dinamike të internetit për të vërtetuar përdoruesit bazuar në kredencialet e tyre. Për krijimin e faqes së hyrjes për faqet e internetit përdoren forma HTML dhe elementet HTML. Fusha e tekstit përdoret për të pranuar emrin e përdoruesit dhe fusha e tekstit të fjalëkalimit përdoret për të pranuar fjalëkalimin nga përdoruesi.

Butoni "dorëzo" përdoret për dërgimin e të dhënave në server për vërtetim. Është mirë të vërtetoni hyrjen e përdoruesit në shfletues duke përdorur JavaScript. Në këtë tutorial ne po krijojmë një kod të faqes së hyrjes në HTML dhe po vërtetojmë hyrjen e përdoruesit me JavaScript. Në aplikacionet moderne të internetit, vërtetimi nga ana e serverit është gjithashtu shumë i rëndësishëm, ai bëhet në anën e serverit me programin që funksionon në server.

Këtu është video tutorial:

Por në këtë tutorial do të mësoni të krijoni një faqe identifikimi në HTML dhe të vërtetoni hyrjen e përdoruesit me JavaScript. Shiko demonstrimin e faqes së hyrjes në HTML.

Këtu është pamja e ekranit të faqes së hyrjes që po bëjmë:

Kjo faqe identifikimi shfaq fushat e tekstit të emrit të përdoruesit, fjalëkalimit dhe më pas butonat për rivendosje dhe hyrje. Pasi përdoruesi fut të dhënat dhe klikon në butonin Login, JavaScript përdoret për të vërtetuar formularin dhe mesazhi i gabimit shfaqet nëse vërtetimi dështon.

Faqja e hyrjes në HTML me Validim JavaScript

Faqja e hyrjes

Etiketa e HTML është zemra e krijimit të formularit të hyrjes së përdoruesit në aplikacionin ueb i cili merr të dhënat e hyrjes së përdoruesit dhe në fund i dërgon ato në programin e serverit për përpunim të mëtejshëm. Të dhënat e të gjithë fushës hyrëse ose të fshehur merren dhe dorëzohen në server përmes etiketës së formularit. Butoni "dorëzo" përdoret për të inicuar dërgimin e të dhënave të formularit në server. Ju gjithashtu mund të përdorni kodin JavaScript për dërgimin e formularit. Për shembull, nëse emri i formularit tuaj është "loginForm", atëherë kodi i mëposhtëm JavaScript mund të thirret për dërgimin e formularit në mënyrë programore.

Në këtë artikull, do të mësoni se si të krijoni një formular regjistrimi dhe identifikimi duke përdorur HTML, JavaScript, PHP dhe MySql. Forma të tilla përdoren pothuajse në çdo faqe interneti, pavarësisht nga lloji i saj. Ato janë krijuar për një forum, një dyqan online, rrjete sociale (si Facebook, Twitter, Odnoklassniki) dhe shumë lloje të tjera faqesh.

Nëse keni një faqe interneti në kompjuterin tuaj lokal, atëherë shpresoj që tashmë e keni . Pa të, asgjë nuk do të funksionojë.

Për të zbatuar regjistrimin e përdoruesve, para së gjithash na duhet një bazë e të dhënave. Nëse e keni tashmë, atëherë shkëlqyeshëm, përndryshe, ju duhet ta krijoni atë. Në artikull, unë shpjegoj në detaje se si ta bëj këtë.

Dhe kështu, ne kemi një bazë të dhënash (shkurtuar si DB), tani duhet të krijojmë një tabelë përdoruesit në të cilin do të shtojmë përdoruesit tanë të regjistruar.

Unë gjithashtu shpjegova se si të krijoni një tabelë në një bazë të dhënash në artikull. Para se të krijojmë një tabelë, duhet të përcaktojmë se cilat fusha do të përmbajë. Këto fusha do të korrespondojnë me fushat nga formulari i regjistrimit.

Kështu, menduam, imagjinuam se çfarë fusha do të kishte forma jonë dhe krijuam një tabelë përdoruesit me këto fusha:

• id- Identifikues. Fusha idÇdo tabelë në bazën e të dhënave duhet ta ketë atë.
• Emri- Për të ruajtur emrin.
• mbiemri- Për të ruajtur mbiemrin.
• email- Për të ruajtur adresën postare. Ne do të përdorim e-mail si hyrje, kështu që kjo fushë duhet të jetë unike, domethënë të ketë indeksin UNIQUE.
• statusi_email- Fusha për të treguar nëse posta është konfirmuar apo jo. Nëse posta konfirmohet, atëherë ajo do të ketë një vlerë prej 1, përndryshe vlera është 0.
• fjalëkalimin- Për të ruajtur fjalëkalimin.

Nëse dëshironi që formulari juaj i regjistrimit të ketë disa fusha të tjera, mund t'i shtoni edhe këtu.

Kjo është ajo, tavolina jonë përdoruesit gati. Le të kalojmë në fazën tjetër.

Ne kemi krijuar bazën e të dhënave, tani duhet të lidhemi me të. Ne do të lidhemi duke përdorur shtesën PHP MySQLi.

Në dosjen e faqes sonë, krijoni një skedar me emrin dbconnect.php, dhe shkruani skriptin e mëposhtëm në të:

Ky skedar dbconnect.php do të duhet të lidhen për mbajtësit e formave.

Vini re variablin $adresa_site, këtu kam treguar emrin e faqes sime të testimit në të cilën do të punoj. Ju lutemi tregoni emrin e faqes tuaj në përputhje me rrethanat.

Tani le të shohim strukturën HTML të faqes sonë.

Ne do të zhvendosim kokën dhe fundin e faqes në skedarë të veçantë, header.php Dhe footer.php. Ne do t'i përfshijmë ato në të gjitha faqet. Gjegjësisht në faqen kryesore (skedar indeks.php), në faqen me formularin e regjistrimit (skedar form_regjistrim.php) dhe në faqen me formularin e autorizimit (skedar form_auth.php).

Blloko me lidhjet tona, regjistrimin Dhe autorizimi, shtoni ato në kokën e faqes në mënyrë që të shfaqen në të gjitha faqet. Një lidhje do të hyjë në faqen me formularin e regjistrimit (skedar form_regjistrim.php) dhe tjetra në faqen me formularin e autorizimit (skedar form_auth.php).

Përmbajtja e skedarit header.php:

Emri i faqes sonë

Si rezultat, faqja jonë kryesore duket si kjo:

Sigurisht, faqja juaj mund të ketë një strukturë krejtësisht të ndryshme, por kjo nuk është e rëndësishme për ne tani. Gjëja kryesore është se ka lidhje (butona) për regjistrim dhe autorizim.

Tani le të kalojmë te formulari i regjistrimit. Siç e kuptoni tashmë, ne e kemi në dosje form_regjistrim.php.

Shkoni te baza e të dhënave (në phpMyAdmin), hapni strukturën e tabelës përdoruesit dhe shikoni se cilat fusha na duhen. Kjo do të thotë se na duhen fusha për futjen e emrit dhe mbiemrit, një fushë për futjen e adresës postare (Email) dhe një fushë për futjen e fjalëkalimit. Dhe për qëllime sigurie, ne do të shtojmë një fushë për të futur një captcha.

Në server, si rezultat i përpunimit të formularit të regjistrimit, mund të ndodhin gabime të ndryshme për shkak të të cilave përdoruesi nuk do të jetë në gjendje të regjistrohet. Prandaj, në mënyrë që përdoruesi të kuptojë pse regjistrimi dështon, është e nevojshme të shfaqen mesazhe në lidhje me këto gabime.

Përpara se të shfaqni formularin, shtoni një bllok për të shfaqur mesazhet e gabimit nga sesioni.

Dhe një gjë tjetër, nëse përdoruesi është tashmë i autorizuar, dhe për kuriozitet ai shkon direkt në faqen e regjistrimit duke shkruar në shiritin e adresave të shfletuesit adresa_site/form_register.php, atëherë në këtë rast, në vend të formularit të regjistrimit, ne do të shfaqim një kokë që thotë se ai tashmë është i regjistruar.

Në përgjithësi, kodi i skedarit form_regjistrim.php kemi marrë këtë:

Në shfletues, faqja me formularin e regjistrimit duket si kjo:

Duke përdorur atributin e kërkuar, ne i bëmë të detyrueshme të gjitha fushat.

Kushtojini vëmendje kodit të formularit të regjistrimit ku shfaqet captcha:

Ne specifikuam shtegun për në skedar në vlerën e atributit src për imazhin captcha.php, e cila gjeneron këtë captcha.

Le të shohim kodin e skedarit captcha.php:

Kodi është komentuar mirë, ndaj do të fokusohem vetëm në një pikë.

Brenda një funksioni imageTtfText(), shtegu i fontit është specifikuar verdana.ttf. Pra, që captcha të funksionojë siç duhet, duhet të krijojmë një dosje fontet, dhe vendosni skedarin e shkronjave atje verdana.ttf. Mund ta gjeni dhe ta shkarkoni nga Interneti, ose ta merrni nga arkivi me materialet e këtij artikulli.

Ne kemi mbaruar me strukturën HTML, është koha për të vazhduar.

Çdo formë duhet të kontrollojë vlefshmërinë e të dhënave të futura, si në anën e klientit (duke përdorur JavaScript, jQuery) dhe në anën e serverit.

Ne duhet t'i kushtojmë vëmendje të veçantë fushës Email. Është shumë e rëndësishme që adresa postare e futur të jetë e vlefshme.

Për këtë fushë hyrëse, ne vendosëm llojin e emailit (type="email"), kjo na paralajmëron pak nga formatet e pasakta. Por kjo nuk mjafton, sepse përmes inspektorit të kodit që na ofron shfletuesi, mund të ndryshojmë lehtësisht vlerën e atributit lloji Me email në teksti, dhe kaq, çeku ynë nuk do të jetë më i vlefshëm.

Dhe në këtë rast, ne duhet të bëjmë një kontroll më të besueshëm. Për ta bërë këtë, ne do të përdorim bibliotekën jQuery nga JavaScript.

Për të lidhur bibliotekën jQuery, në skedar header.php midis etiketave , përpara etiketës mbyllëse , shtoni këtë rresht:

Menjëherë pas kësaj rreshti, ne do të shtojmë kodin e vërtetimit të emailit. Këtu do të shtojmë një kod për të kontrolluar gjatësinë e fjalëkalimit të futur. Gjatësia e saj duhet të jetë së paku 6 karaktere.

Duke përdorur këtë skript, ne kontrollojmë adresën e postës elektronike të futur për vlefshmëri. Nëse përdoruesi ka futur një email të pasaktë, ne shfaqim një mesazh gabimi në lidhje me këtë dhe çaktivizojmë butonin e paraqitjes së formularit. Nëse gjithçka është në rregull, atëherë ne heqim gabimin dhe aktivizojmë butonin e paraqitjes së formularit.

Dhe kështu, ne kemi përfunduar me vërtetimin e formularit në anën e klientit. Tani mund ta dërgojmë në server, ku do të bëjmë edhe disa kontrolle dhe do të shtojmë të dhëna në bazën e të dhënave.

Ne e dërgojmë formularin në dosje për përpunim regjistrohen.php, me metodën POST. Emri i këtij skedari mbajtës është specifikuar në vlerën e atributit veprim. Dhe metoda e dërgimit specifikohet në vlerën e atributit metodë.

Hapeni këtë skedar regjistrohen.php dhe gjëja e parë që duhet të bëjmë është të shkruajmë një funksion të nisjes së sesionit dhe të lidhim skedarin që kemi krijuar më parë dbconnect.php(Në këtë skedar kemi bërë një lidhje me bazën e të dhënave). Dhe gjithashtu, le të deklarojmë menjëherë qelizat mesazhet_error Dhe mesazhet_sukses në grupin global të sesioneve. NË mesazhet_error ne do të regjistrojmë të gjitha mesazhet e gabimit që ndodhin gjatë përpunimit të formularit dhe në mesazhet_sukses, do të regjistrojmë mesazhe të gëzueshme.

Përpara se të vazhdojmë, duhet të kontrollojmë nëse formulari është dorëzuar fare. Një sulmues mund të shikojë vlerën e atributit veprim nga formulari dhe zbuloni se cili skedar po përpunon këtë formular. Dhe ai mund të ketë idenë të shkojë drejtpërdrejt te ky skedar duke shtypur adresën e mëposhtme në shiritin e adresave të shfletuesit: http://site_adresa/register.php

Pra, ne duhet të kontrollojmë për një qelizë në grupin global POST, emri i së cilës përputhet me emrin e butonit tonë "Regjistrohu" nga formulari. Në këtë mënyrë kontrollojmë nëse butoni "Regjistrohu" është klikuar apo jo.

Nëse një sulmues përpiqet të shkojë direkt në këtë skedar, ai do të marrë një mesazh gabimi. Më lejoni t'ju kujtoj se ndryshorja $address_site përmban emrin e sajtit dhe është deklaruar në skedar dbconnect.php.

Vlera captcha në seancë u shtua kur u krijua, në skedar captcha.php. Si kujtesë, unë do t'ju tregoj përsëri këtë pjesë të kodit nga skedari captcha.php, ku vlera captcha i shtohet seancës:

Tani le të vazhdojmë me vetë verifikimin. Në dosje regjistrohen.php, brenda bllokut if, ku kontrollojmë nëse është klikuar butoni "Regjistrohu", ose më mirë ku tregohet komenti "" // (1) Hapësirë ​​për pjesën tjetër të kodit"ne shkruajmë:

//Kontrollo kaptchën e marrë //Të shkurtosh hapësirat nga fillimi dhe fundi i rreshtit $captcha = trim($_POST["captcha"]); if(isset($_POST["captcha"]) && !empty($captcha))( //Krahaso vlerën e marrë me vlerën nga sesioni. if(($_SESSION["rand"] != $captcha) && ($_SESSION ["rand"] != ""))( // Nëse captcha nuk është e saktë, atëherë ne e kthejmë përdoruesin në faqen e regjistrimit dhe atje do t'i shfaqim atij një mesazh gabimi se ai ka futur captcha të gabuar $error_message = ".

Gabim! Ke futur captcha të gabuar

Gabim! Nuk ka asnjë kod verifikimi, domethënë një kod captcha. Mund të shkoni në faqen kryesore.

Më pas, duhet të përpunojmë të dhënat e marra nga grupi POST. Para së gjithash, duhet të kontrollojmë përmbajtjen e grupit global POST, domethënë nëse ka qeliza atje, emrat e të cilëve korrespondojnë me emrat e fushave hyrëse nga forma jonë.

Nëse qeliza ekziston, atëherë shkurtojmë hapësirat nga fillimi dhe fundi i rreshtit nga kjo qelizë, përndryshe, e ridrejtojmë përdoruesin përsëri në faqen me formularin e regjistrimit.

Më pas, pasi të kemi shkurtuar hapësirat, shtojmë rreshtin në variabël dhe kontrollojmë këtë variabël për zbrazëti, atëherë vazhdojmë, përndryshe e ridrejtojmë përdoruesin përsëri në faqen me formularin e regjistrimit.

Ngjite këtë kod në vendndodhjen e specifikuar" // (2) Hapësirë ​​për pjesën tjetër të kodit".

/* Kontrolloni nëse ka të dhëna të dërguara nga formulari në grupin global $_POST dhe mbështillni të dhënat e dorëzuara në variabla të rregullt.*/ if(isset($_POST["first_name"]))( //Shkurtoni hapësirat nga fillimi dhe fundi i vargut $first_name = trim($_POST["first_name"] //Kontrollo variablin për zbrazëti if(!empty($first_name))( // Për siguri, konverto karaktere speciale në entitete HTML $first_name =); htmlspecialchars($first_name, ENT_QUOTES) )else( // Ruani mesazhin e gabimit në seancë. $_SESSION["error_messages"] .= "

Shkruaj emrin tend

Mungon fusha e emrit

Ju lutemi shkruani mbiemrin tuaj

Mungon fusha e mbiemrit

Shkruani emailin tuaj

Futni fjalëkalimin tuaj

Me rëndësi të veçantë është fusha email. Ne duhet të kontrollojmë formatin e adresës postare të marrë dhe veçantinë e saj në bazën e të dhënave. Kjo do të thotë, a është regjistruar tashmë një përdorues me të njëjtën adresë emaili?

në vendin e caktuar" // (3) Vendndodhja e kodit për të kontrolluar formatin e adresës postare dhe veçantinë e saj" shtoni kodin e mëposhtëm:

//Kontrollo formatin e adresës së emailit të marrë duke përdorur një shprehje të rregullt $reg_email = "/^**@(+(*+)*\.)++/i"; //Nëse formati i adresës së emailit të marrë nuk përputhet me shprehjen e rregullt if(!preg_match($reg_email, $email))( // Ruani mesazhin e gabimit në seancë. $_SESSION["error_messages"] .= "

Ke futur një email të pasaktë

Një përdorues me këtë adresë emaili është regjistruar tashmë

Gabim në pyetjen e bazës së të dhënave

Dhe kështu, ne kemi mbaruar me të gjitha kontrollet, është koha për të shtuar përdoruesin në bazën e të dhënave. në vendin e caktuar" // (4) Vendi për kodin për shtimin e një përdoruesi në bazën e të dhënave" shtoni kodin e mëposhtëm:

//Pyetje për të shtuar një përdorues në bazën e të dhënave $result_query_insert = $mysqli->query("INSERT INTO `users` (first_name, mbiemri, email, password) VALUES ("".$first_name."", "".$last_name ." ", "".$email.", "".$password."")"); if(!$result_query_insert)( // Ruani mesazhin e gabimit në seancë. $_SESSION["error_messages"] .= "

Gabim në kërkesën për të shtuar përdorues në bazën e të dhënave

Regjistrimi përfundoi me sukses!!!
Tani mund të identifikoheni duke përdorur emrin e përdoruesit dhe fjalëkalimin tuaj.

Nëse ka ndodhur një gabim në kërkesën për të shtuar një përdorues në bazën e të dhënave, ne shtojmë një mesazh në lidhje me këtë gabim në seancë dhe e kthejmë përdoruesin në faqen e regjistrimit.

Përndryshe, nëse gjithçka shkoi mirë, ne i shtojmë edhe një mesazh seancës, por këtë herë është më e këndshme, domethënë i themi përdoruesit që regjistrimi ishte i suksesshëm. Dhe ne e ridrejtojmë atë në faqen me formularin e autorizimit.

Skripti për kontrollimin e formatit të adresës së emailit dhe gjatësisë së fjalëkalimit është në skedar header.php, kështu që do të zbatohet edhe për fushat nga ky formular.

Fillohet edhe seanca në dosje header.php, pra në dosje form_auth.php Nuk ka nevojë të fillojmë një seancë, sepse do të kemi një gabim.

Siç thashë tashmë, skripti për kontrollimin e formatit të adresës së postës elektronike dhe gjatësisë së fjalëkalimit gjithashtu funksionon këtu. Prandaj, nëse përdoruesi fut një adresë emaili të pasaktë ose fjalëkalim të shkurtër, ai menjëherë do të marrë një mesazh gabimi. Një buton për të hyrë do të bëhet joaktive.

Pas rregullimit të gabimeve, butoni për të hyrë bëhet aktiv dhe përdoruesi do të mund ta dërgojë formularin në server, ku do të përpunohet.

Për të atribuar vlerën veprim handikapi i autorizimit ka një dosje të specifikuar auth.php, kjo do të thotë se formulari do të përpunohet në këtë skedar.

Dhe kështu, hapni skedarin auth.php dhe shkruani kodin për të përpunuar formularin e autorizimit. Gjëja e parë që duhet të bëni është të filloni një seancë dhe të lidhni skedarin dbconnect.php për t'u lidhur me bazën e të dhënave.

Kur klikoni në lidhjen e daljes nga faqja, ne çojmë te një skedar dalje.php, ku thjesht shkatërrojmë qelizat me adresën e emailit dhe fjalëkalimin nga sesioni. Pas kësaj, ne e kthejmë përdoruesin përsëri në faqen në të cilën është klikuar lidhja dalje.

Kodi i skedarit logout.php:

Kjo eshte e gjitha. Tani ju e dini se si të zbatoni dhe përpunoni formularët e regjistrimit dhe autorizimit të përdoruesve në faqen tuaj të internetit. Këto forma gjenden pothuajse në çdo faqe interneti, kështu që çdo programues duhet të dijë se si t'i krijojë ato.

Mësuam gjithashtu se si të vërtetojmë të dhënat hyrëse, si në anën e klientit (në shfletues, duke përdorur JavaScript, jQuery) dhe në anën e serverit (duke përdorur PHP). Mësuam gjithashtu se si të zbatojmë një procedurë për largimin nga siti.

Të gjitha skriptet janë testuar dhe janë duke punuar. Nga kjo lidhje mund ta shkarkoni arkivin me skedarët e kësaj faqeje të vogël.

Në të ardhmen do të shkruaj një artikull ku do të përshkruaj. Dhe gjithashtu planifikoj të shkruaj një artikull ku do të shpjegoj (pa ringarkuar faqen). Pra, në mënyrë që të qëndroni të informuar për publikimin e artikujve të rinj, mund të abonoheni në faqen time të internetit.

Nëse keni ndonjë pyetje, ju lutem më kontaktoni dhe nëse vëreni ndonjë gabim në artikull, ju lutem më njoftoni.

Plani i mësimit (Pjesa 5):

Fusha e futjes së fjalëkalimit është një fushë e rregullt teksti, teksti i futur në të cilin, në varësi të shfletuesit, shfaqet si yje ose pika. Kjo veçori është krijuar për të parandaluar këdo që të zbulojë fjalëkalimin e futur. Megjithëse teksti i futur nuk shfaqet në ekran, informacioni i futur i transmetohet serverit në tekst të pastër pa enkriptim. Prandaj, përdorimi i kësaj fushe nuk siguron sigurinë e të dhënave dhe mund të përgjohet.

Sintaksa e krijimit është si më poshtë.

Atributet janë të njëjta me atributet e fushës së tekstit dhe janë të listuara në tabelë. 1.

Fusha e fjalëkalimit përdoret gjerësisht në faqet e internetit për të autorizuar përdoruesit dhe për të kufizuar aksesin në seksionet e faqes së internetit ku duhet të konfirmoni autoritetin tuaj. Shembulli 1 tregon se si të krijohen fusha të tilla.

Shembull 1. Fusha e fjalëkalimit

Fusha e fjalëkalimit

Identifikohu:

Fjalëkalimi:

Si rezultat, marrim sa vijon (Fig. 1).

Oriz. 1. Lloji i fushës së fjalëkalimit

Vetitë e stilit që specifikojnë parametrat e ngjyrës, sfondit, kornizës, etj., aplikohen në fushën e fjalëkalimit Shembulli 2 tregon shtimin e imazheve të sfondit për të formuar fushat. Le të marrim si bazë stilin si për fushat e tekstit.

Shembulli 2: Shtimi i një imazhi në një kuti teksti

Fusha e fjalëkalimit .textField, .passField ( gjerësia: 100%; /* Gjerësia e fushës */ mbushja: 10 px; /* Margjinat */ madhësia e kutisë: kutia kufitare; /* Algoritmi i llogaritjes së gjerësisë */ hije-kutia: futur 0 1px 5px rgba(0,0,0,0.2 /* Shadow brenda */ border: 1px solid #ccc /* Border options */ color: #ff6d37; /user.png) pa përsëritje 5px 50% /* Fotografia e përdoruesit */ padding-left: 30px /* Largësia nga buza e majtë */ .passField ( sfond: url(/shembull/image/lock.png) jo-; përsëritni 5px 50% /* Imazhi për fushën e fjalëkalimit */ )

Rezultati i këtij shembulli është paraqitur në Fig. 2. Fotografitë shtohen si sfond, kështu që teksti duhet të zhvendoset djathtas me anë të mbushjes-majtas, përndryshe do të shfaqet në krye të figurës.