Html css ro'yxatga olish shakli. HTML shakllarini yaratish. Ma'lumotlar bazasiga ulanish

Hammaga salom. Shunday qilib, biz shakllarni yaratish uchun bir nechta elementlarni o'rgandik. Kattaroq muammoni hal qilish uchun bilimlarimizni birlashtirish vaqti keldi. Saytda avtorizatsiya qilish uchun eng oddiy shaklni yarataylik. Buning uchun bizga ikkita maydon kerak, biz ularga imzolar yaratamiz va biriktiramiz.

Birinchi maydon login uchun, ikkinchisi parol uchun. Va ikkinchisi bilan bu juda oddiy emas. Chunki hozirda bu faqat matn kiritish maydoni.

Brauzerda natija:

Ushbu turdagi maydon uchun odatiy bo'lganidek, unga kiritilgan matn yulduzcha bilan almashtirilishi uchun siz bitta oddiy amalni bajarishingiz kerak. Ya'ni, atribut qiymatini almashtirish uchun turi yoqilgan parol:

Natija:

Shaklni yuborish tugmasi

Mana. Bizning formamiz deyarli tayyor. Endi uni yaratishni yakunlash uchun siz formani yuborish uchun ishlatiladigan tugmani yaratishingiz kerak. Muammo teg yordamida hal qilinadi turi bilan topshirish.

Agar tugma qandaydir yozuvga ega bo'lsa, u atribut yordamida amalga oshirilishi mumkin qiymat. Tugmani nomlash yoki bermaslik sizga bog'liq, lekin agar shunday qilsangiz, server bu nomni, shuningdek tugma qiymatini oladi.

Qoidaga ko'ra, formani yuborish tugmasi nomi formada bir nechta tugmalar mavjud bo'lganda kerak bo'ladi, ularning har biri ma'lum bir amalni bajaradi. Buning yordamida brauzerdan tugma nomi va qiymatini olgan server foydalanuvchi qaysi tugmani bosganini va shunga mos ravishda nima qilish kerakligini tushunadi.

Natijada, bizning formamiz uchun kod quyidagicha bo'ladi:

Brauzerda natija:

Birinchi maydon login uchun, ikkinchisi parol uchun. Va ikkinchisi bilan bu juda oddiy emas. Chunki hozirda bu faqat matn kiritish maydoni.

Brauzerda natija:

Natija:

Shaklni yuborish tugmasi

Natijada, bizning formamiz uchun kod quyidagicha bo'ladi:

Brauzerda natija:

Bu erda HTML yordamida Ro'yxatdan o'tish shaklining namunasi. Bu yerda dasturchi xohlagancha "Matn maydoni"ni ko'rsatishi mumkin. Matn maydoni oldidagi nom "Yorliq" deb ataladi. Ro'yxatdan o'tish shaklining oxirida "Qo'shish" tugmasi mavjud bo'lib, undan istalgan havoladan foydalanish mumkin. Bir marta bosgandan so'ng, u aniq manzilga yo'naltiriladi.

Ro'yxatdan o'tish uchun HTML kodi

Ushbu misolda biz 9 ta "Matn maydoni" ni ko'rsatdik. Matn qutisining o'lchami ham talabga muvofiq o'zgartirilishi mumkin.

Register.html

ro'yxatga olish shakli

Ro'yxatdan o'tish shakli

Ushbu maqolada siz o'rganasiz ro'yxatga olish va avtorizatsiya shaklini qanday yaratish kerak HTML, JavaScript, PHP va MySql-dan foydalanish. Bunday shakllar turidan qat'i nazar, deyarli har bir veb-saytda qo'llaniladi. Ular forum, onlayn-do'kon, ijtimoiy tarmoqlar (masalan, Facebook, Twitter, Odnoklassniki) va boshqa ko'plab turdagi saytlar uchun yaratilgan.

Agar sizning mahalliy kompyuteringizda veb-saytingiz bo'lsa, u holda sizda allaqachon mavjud deb umid qilaman. Busiz hech narsa ishlamaydi.

Ma'lumotlar bazasida jadval yaratish

Foydalanuvchilarni ro'yxatga olishni amalga oshirish uchun, birinchi navbatda, ma'lumotlar bazasi kerak. Agar sizda allaqachon mavjud bo'lsa, unda ajoyib, aks holda siz uni yaratishingiz kerak. Maqolada men buni qanday qilishni batafsil tushuntiraman.

Shunday qilib, bizda ma'lumotlar bazasi (MB deb qisqartiriladi), endi biz jadval yaratishimiz kerak foydalanuvchilar unda biz ro'yxatdan o'tgan foydalanuvchilarimizni qo'shamiz.

Maqolada ma'lumotlar bazasida jadvalni qanday yaratishni ham tushuntirdim. Jadvalni yaratishdan oldin uning qanday maydonlarni o'z ichiga olishini aniqlashimiz kerak. Ushbu maydonlar ro'yxatdan o'tish shaklidagi maydonlarga mos keladi.

Shunday qilib, formamiz qanday maydonlarga ega bo'lishini o'yladik, tasavvur qildik va jadval yaratdik foydalanuvchilar ushbu maydonlar bilan:

id- Identifikator. Maydon id Ma'lumotlar bazasidagi har bir jadvalda u bo'lishi kerak.
ism- Ismni saqlash uchun.
familiya- Familiyani saqlab qolish uchun.
elektron pochta- Pochta manzilini saqlash uchun. Login sifatida biz elektron pochtadan foydalanamiz, shuning uchun bu maydon noyob bo'lishi kerak, ya'ni UNIQUE indeksiga ega bo'lishi kerak.
email_status- Pochtaning tasdiqlangan yoki tasdiqlanmaganligini ko'rsatadigan maydon. Agar pochta tasdiqlansa, u 1 qiymatiga ega bo'ladi, aks holda qiymat 0. Odatiy bo'lib, bu maydon 0 qiymatiga ega bo'ladi.
parol- Parolni saqlash uchun.

“VARCHAR” turidagi barcha maydonlar standart qiymati NULL bo‘lishi kerak.

Agar roʻyxatdan oʻtish formangizda boshqa maydonlar boʻlishini istasangiz, ularni shu yerga ham qoʻshishingiz mumkin.

Mana, bizning stolimiz foydalanuvchilar tayyor. Keling, keyingi bosqichga o'tamiz.

Ma'lumotlar bazasiga ulanish

Biz ma'lumotlar bazasini yaratdik, endi unga ulanishimiz kerak. PHP kengaytmasi MySQLi yordamida ulanamiz.

Saytimiz papkasida nomli fayl yarating dbconnect.php, va unga quyidagi skriptni yozing:

JB ulanish xatosi. Xato tavsifi: ".mysqli_connect_error()."

"; exit(); ) // Ulanish kodlashini o'rnating $mysqli->set_charset("utf8"); // Qulaylik uchun bu erga bizning saytimiz nomini o'z ichiga olgan o'zgaruvchini qo'shing $address_site = "http://testsite .local" ; ?>

Bu fayl dbconnect.php shakl ishlov beruvchilariga ulanishi kerak bo'ladi.

O'zgaruvchiga e'tibor bering $address_site, bu erda men ishlayotgan test saytim nomini ko'rsatdim. Iltimos, saytingiz nomini mos ravishda ko'rsating.

Sayt tuzilishi

Endi saytimizning HTML tuzilishini ko'rib chiqamiz.

Biz saytning sarlavhasi va altbilgisini alohida fayllarga o'tkazamiz, header.php Va footer.php. Biz ularni barcha sahifalarga joylashtiramiz. Ya'ni asosiy sahifada (fayl index.php), ro'yxatdan o'tish shakli (fayl form_register.php) va avtorizatsiya shakli (fayl form_auth.php).

Bizning havolalarimiz bilan bloklash, ro'yxatdan o'tish Va ruxsat, barcha sahifalarda ko'rsatilishi uchun ularni sayt sarlavhasiga qo'shing. Bitta havola kiritiladi ro'yxatga olish shakli sahifasi(fayl form_register.php) va ikkinchisi bilan sahifaga avtorizatsiya shakli(fayl form_auth.php).

header.php faylining tarkibi:

Saytimiz nomi

Natijada bizning asosiy sahifamiz quyidagicha ko'rinadi:

Albatta, sizning saytingiz butunlay boshqacha tuzilishga ega bo'lishi mumkin, ammo bu biz uchun hozir muhim emas. Asosiysi, ro'yxatdan o'tish va avtorizatsiya qilish uchun havolalar (tugmalar) mavjud.

Endi ro'yxatdan o'tish shakliga o'tamiz. Siz allaqachon tushunganingizdek, bizda fayl mavjud form_register.php.

Ma'lumotlar bazasiga o'ting (phpMyAdmin-da), jadval tuzilishini oching foydalanuvchilar va bizga qaysi sohalar kerakligini ko'rib chiqing. Bu bizga ism va familiyani kiritish uchun maydonlar, pochta manzilini (elektron pochta) kiritish uchun maydon va parolni kiritish uchun maydon kerakligini anglatadi. Va xavfsizlik maqsadida biz captcha kiritish uchun maydon qo'shamiz.

Serverda ro'yxatdan o'tish shaklini qayta ishlash natijasida turli xil xatolar yuzaga kelishi mumkin, buning natijasida foydalanuvchi ro'yxatdan o'ta olmaydi. Shuning uchun, foydalanuvchi nima uchun ro'yxatdan o'tish muvaffaqiyatsiz tugashini tushunish uchun ushbu xatolar haqida xabarlarni ko'rsatish kerak.

Shaklni ko'rsatishdan oldin, sessiyadagi xato xabarlarini ko'rsatish uchun blok qo'shing.

Va yana bir narsa, agar foydalanuvchi allaqachon avtorizatsiya qilingan bo'lsa va u qiziquvchanligi sababli brauzerning manzil satriga yozish orqali to'g'ridan-to'g'ri ro'yxatdan o'tish sahifasiga o'tadi. site_address/form_register.php, keyin bu holda, ro'yxatdan o'tish shakli o'rniga, biz allaqachon ro'yxatdan o'tganligini ko'rsatadigan sarlavhani ko'rsatamiz.

Umuman olganda, fayl kodi form_register.php biz buni oldik:

Siz allaqachon ro'yxatdan o'tgansiz

Brauzerda ro'yxatdan o'tish shakli bo'lgan sahifa quyidagicha ko'rinadi:

Yordamida zarur atribut, biz barcha maydonlarni majburiy qilib qo'ydik.

Qayerda ro'yxatdan o'tish shakli kodiga e'tibor bering captcha ko'rsatiladi:

Biz rasm uchun src atributining qiymatida faylga yo'lni ko'rsatdik captcha.php, bu captcha ni yaratadi.

Keling, fayl kodini ko'rib chiqaylik captcha.php:

Kod yaxshi sharhlangan, shuning uchun men faqat bir nuqtaga e'tibor qarataman.

Funktsiya ichida imageTtfText(), shriftga yo'l belgilanadi verdana.ttf. Shunday qilib, captcha to'g'ri ishlashi uchun biz papka yaratishimiz kerak shriftlar, va u yerga shrift faylini joylashtiring verdana.ttf. Siz uni Internetdan topishingiz va yuklab olishingiz yoki ushbu maqolaning materiallari bilan arxivdan olishingiz mumkin.

Biz HTML tuzilmasi bilan tugatdik, davom etish vaqti keldi.

JQuery yordamida elektron pochtaning haqiqiyligini tekshirish

Har qanday shakl mijoz tomonidan (JavaScript, jQuery yordamida) va server tomonida kiritilgan ma'lumotlarning haqiqiyligini tekshirishi kerak.

Elektron pochta maydoniga alohida e'tibor qaratishimiz kerak. Kiritilgan pochta manzili haqiqiy bo'lishi juda muhimdir.

Ushbu kiritish maydoni uchun biz elektron pochta turini o'rnatdik (type="email"), bu bizni noto'g'ri formatlardan biroz ogohlantiradi. Ammo bu etarli emas, chunki brauzer bizga taqdim etadigan kod inspektori orqali biz atribut qiymatini osongina o'zgartirishimiz mumkin turi Bilan elektron pochta yoqilgan matn, va bu, bizning chekimiz endi haqiqiy emas.

Va bu holda, biz yanada ishonchli tekshirishni amalga oshirishimiz kerak. Buning uchun JavaScript-dan jQuery kutubxonasidan foydalanamiz.

jQuery kutubxonasini ulash uchun faylda header.php teglar orasida , yopilish tegidan oldin , ushbu qatorni qo'shing:

Ushbu qatordan so'ng darhol elektron pochtani tekshirish kodini qo'shamiz. Bu erda biz kiritilgan parol uzunligini tekshirish uchun kod qo'shamiz. Uning uzunligi kamida 6 ta belgidan iborat bo'lishi kerak.

Ushbu skriptdan foydalanib, biz kiritilgan elektron pochta manzilining haqiqiyligini tekshiramiz. Agar foydalanuvchi noto'g'ri elektron pochta manzilini kiritgan bo'lsa, biz bu haqda xato xabarini ko'rsatamiz va ariza yuborish tugmasini o'chirib qo'yamiz. Agar hamma narsa yaxshi bo'lsa, biz xatoni olib tashlaymiz va ariza yuborish tugmasini faollashtiramiz.

Shunday qilib, biz mijoz tomonidan shaklni tekshirishni tugatdik. Endi biz uni serverga yuborishimiz mumkin, u erda biz bir nechta tekshiruvlarni qilamiz va ma'lumotlar bazasiga ma'lumotlarni qo'shamiz.

Foydalanuvchini ro'yxatdan o'tkazish

Shaklni qayta ishlash uchun faylga yuboramiz register.php, POST usuli orqali. Ushbu ishlov beruvchi faylining nomi atribut qiymatida ko'rsatilgan harakat. Va jo'natish usuli atribut qiymatida ko'rsatilgan usuli.

Ushbu faylni oching register.php va biz qilishimiz kerak bo'lgan birinchi narsa - seansni ishga tushirish funksiyasini yozish va avval yaratilgan faylni ulash dbconnect.php(Ushbu faylda biz ma'lumotlar bazasiga ulanishni amalga oshirdik). Va shuningdek, darhol hujayralarni e'lon qilaylik xato_xabarlar Va muvaffaqiyat_xabarlari global sessiya massivida. IN xato_xabarlar biz shaklni qayta ishlash jarayonida yuzaga keladigan barcha xato xabarlarni yozib olamiz va ichida muvaffaqiyatli_xabarlar, biz quvonchli xabarlarni yozib olamiz.

Davom etishdan oldin biz tekshirishimiz kerak forma umuman topshirilganmi?. Tajovuzkor atribut qiymatiga qarashi mumkin harakat shakldan o'ting va ushbu forma qaysi faylga ishlov berayotganini bilib oling. Va u brauzerning manzil satriga quyidagi manzilni kiritish orqali to'g'ridan-to'g'ri ushbu faylga o'tish fikriga ega bo'lishi mumkin: http://site_address/register.php

Shunday qilib, global POST massivida formadagi "Ro'yxatdan o'tish" tugmachamiz nomiga mos keladigan katakchani tekshirishimiz kerak. Shunday qilib, biz "Ro'yxatdan o'tish" tugmasi bosilganmi yoki yo'qligini tekshiramiz.

Agar tajovuzkor to'g'ridan-to'g'ri ushbu faylga o'tishga harakat qilsa, ular xato xabarini oladi. Eslatib oʻtamiz, $address_site oʻzgaruvchisi sayt nomini oʻz ichiga oladi va u faylda eʼlon qilingan. dbconnect.php.

Xato! bosh sahifa.

"); } ?>

Seansdagi captcha qiymati faylda yaratilganda qo'shilgan captcha.php. Eslatib o'tamiz, men sizga fayldagi ushbu kod qismini yana ko'rsataman captcha.php, bu erda captcha qiymati sessiyaga qo'shiladi:

Endi tekshirishning o'ziga o'taylik. Fayl ichida register.php, if blokining ichida, biz "Ro'yxatdan o'tish" tugmasi bosilganligini yoki to'g'rirog'i " izoh " ko'rsatilganligini tekshiramiz. // (1) Keyingi kod qismi uchun bo'sh joy"Biz yozamiz:

//Qabul qilingan captcha-ni tekshiring //Qatorning boshidan va oxiridan bo'shliqlarni kesib oling $captcha = trim($_POST["captcha"]); if(isset($_POST["captcha"]) && !empty($captcha))( //Qabul qilingan qiymatni sessiya qiymati bilan solishtiring. if(($_SESSION["rand"] != $captcha) && ($_SESSION ["rand"] != ""))( // Agar captcha noto'g'ri bo'lsa, biz foydalanuvchini ro'yxatdan o'tish sahifasiga qaytaramiz va u erda u noto'g'ri captcha kiritganligi haqida xato xabarini ko'rsatamiz. $error_message = "

Xato! Siz noto'g'ri captcha kiritdingiz

"; // Seansga xato xabarini saqlang. $_SESSION["error_messages"] = $error_message; // Foydalanuvchini ro'yxatdan o'tish sahifasi sarlavhasiga qaytaring("HTTP/1.1 301 Doimiy ko'chirildi"); header("Joylashuv: " .$address_site ."/form_register.php"); //Skriptdan chiqishni to'xtating(); ) // (2) Keyingi kod qismi uchun joylashtiring )else( //Agar captcha o'tkazilmasa yoki u bo'sh bo'lsa, chiqish ("

Xato! Tasdiqlash kodi, ya'ni captcha kodi yo'q. Siz asosiy sahifaga o'tishingiz mumkin.

"); }

Keyinchalik, POST massividan olingan ma'lumotlarni qayta ishlashimiz kerak. Avvalo, biz global POST massivining mazmunini tekshirishimiz kerak, ya'ni u erda nomlari bizning formamizdagi kiritish maydonlarining nomlariga mos keladigan hujayralar mavjudligini tekshirishimiz kerak.

Agar hujayra mavjud bo'lsa, biz ushbu katakdagi satrning boshidan va oxiridan bo'sh joylarni kesib tashlaymiz, aks holda biz foydalanuvchini ro'yxatdan o'tish shakli bilan sahifaga qayta yo'naltiramiz.

Keyinchalik, bo'shliqlarni qisqartirganimizdan so'ng, biz o'zgaruvchiga qatorni qo'shamiz va bu o'zgaruvchining bo'shligini tekshiramiz; agar u bo'sh bo'lmasa, biz davom etamiz, aks holda biz foydalanuvchini ro'yxatdan o'tish shakli bilan sahifaga qayta yo'naltiramiz.

Ushbu kodni belgilangan joyga qo'ying" // (2) Keyingi kod qismi uchun bo'sh joy".

/* $_POST global massivida formadan yuborilgan ma’lumotlar mavjudligini tekshiring va yuborilgan ma’lumotlarni oddiy o‘zgaruvchilarga o‘rang.*/ if(isset($_POST["first_name"]))( //Bo‘shliqlarni boshidan qisqartiring. va satr oxiri $first_name = trim($_POST["first_name"]); //O'zgaruvchining bo'shligini tekshiring if(!empty($first_name))( // Xavfsizlik uchun maxsus belgilarni HTML ob'ektlariga aylantiring $first_name = htmlspecialchars($first_name, ENT_QUOTES) ; )else( // Xato xabarini seansga saqlang. $_SESSION["error_messages"] .= "

Ismingizni kiriting

Nom maydoni yetishmayapti

"; //Foydalanuvchini roʻyxatga olish sahifasi sarlavhasiga qaytaring("HTTP/1.1 301 Doimiy koʻchirildi"); header("Joylashuv: ".$adres_sayt."/form_register.php"); //Skriptdan chiqishni toʻxtating(); ) if( isset($_POST["familiya_ism"]))( //Satr boshidan va oxiridan bo'shliqlarni kesib oling $last_name = trim($_POST["familiya_ism"]); if(!empty($last_name)) ( // Xavfsizlik uchun maxsus belgilarni HTML ob'ektlariga aylantiring $last_name = htmlspecialchars($last_name, ENT_QUOTES); )else( // Xato xabarini sessiyaga saqlang. $_SESSION["error_messages"] .= "

Iltimos, familiyangizni kiriting

Familiya maydoni yo‘q

"; //Foydalanuvchini roʻyxatga olish sahifasi sarlavhasiga qaytaring("HTTP/1.1 301 Doimiy koʻchirildi"); header("Joylashuv: ".$adres_sayt."/form_register.php"); //Skriptdan chiqishni toʻxtating(); ) if( isset($_POST["email"]))( //Satr boshidan va oxiridan bo'sh joylarni kesish $email = trim($_POST["email"]); if(!empty($email)) ( $email = htmlspecialchars ($email, ENT_QUOTES); // (3) Elektron pochta manzili formatini va uning oʻziga xosligini tekshirish uchun kod joylashuvi )alse( // Xato xabarini sessiyaga saqlang. $_SESSION["error_messages"] .= "

Elektron pochtangizni kiriting

"; //Foydalanuvchini roʻyxatga olish sahifasi sarlavhasiga qaytaring("HTTP/1.1 301 Doimiy koʻchirildi"); header("Joylashuv: ".$adres_sayt."/form_register.php"); //Skriptdan chiqishni toʻxtating(); ) if( isset($_POST["password"]))( //String boshidan va oxiridan bo'shliqlarni kesib tashlang $password = trim($_POST["password"]); if(!empty($password)) ( $password = htmlspecialchars ($password, ENT_QUOTES); //Parolni shifrlang $password = md5($password."top_secret"); )else( // Xato xabarini sessiyaga saqlang. $_SESSION["error_messages"] .= "

Parolingizni kiriting

Bu soha alohida ahamiyatga ega elektron pochta. Qabul qilingan pochta manzilining formatini va uning ma'lumotlar bazasida o'ziga xosligini tekshirishimiz kerak. Ya'ni, allaqachon ro'yxatdan o'tgan bir xil elektron pochta manziliga ega foydalanuvchi bormi?

Belgilangan joyda" // (3) Pochta manzili formatini va uning o'ziga xosligini tekshirish uchun kod joylashuvi"quyidagi kodni qo'shing:

//Qabul qilingan elektron pochta manzilining formatini oddiy ifoda yordamida tekshiring $reg_email = "/^**@(+(*+)*\.)++/i"; //Agar qabul qilingan elektron pochta manzilining formati oddiy ifodaga mos kelmasa if(!preg_match($reg_email, $email))( // Xato xabarini sessiyaga saqlang. $_SESSION["error_messages"] .= "

Siz noto'g'ri elektron pochta manzilini kiritdingiz

"; //Foydalanuvchini roʻyxatga olish sahifasi sarlavhasiga qaytaring("HTTP/1.1 301 Doimiy koʻchirildi"); header("Joylashuv: ".$adres_sayt."/form_register.php"); //Skriptdan chiqishni toʻxtating(); ) // Biz ma'lumotlar bazasida bunday manzil mavjudligini tekshiramiz. $result_query = $mysqli->query("SELECT `email` FROM `users` WHERE `email`="".$email.""); / /Agar qabul qilinganlar soni aynan bitta qator boʻlsa, demak, ushbu elektron pochta manziliga ega foydalanuvchi allaqachon roʻyxatdan oʻtgan if($result_query->num_rows == 1)( //Agar olingan natija notoʻgʻri boʻlsa if(($row =) $result_query->fetch_assoc()) != false) ( // Xato xabarini seansga saqlang. $_SESSION["error_messages"] .= "

Ushbu elektron pochta manziliga ega foydalanuvchi allaqachon ro'yxatdan o'tgan

"; //Foydalanuvchini roʻyxatdan oʻtish sahifasi sarlavhasiga qaytaring("HTTP/1.1 301 Doimiy koʻchirildi"); header("Joylashuv: ".$adres_sayt."/form_register.php"); )else( // Xato xabarini saqlang sessiyaga. $_SESSION["error_messages"] .= "

Ma'lumotlar bazasi so'rovida xato

"; //Foydalanuvchini ro'yxatdan o'tish sahifasi sarlavhasiga qaytaring("HTTP/1.1 301 Doimiy ko'chirildi"); header("Joylashuv: ".$adres_sayt."/form_register.php"); ) /* tanlovni yopish */ $ result_query-> close(); //Skriptdan chiqishni toʻxtating(); ) /* tanlovni yopish */ $result_query->close();

Shunday qilib, biz barcha tekshiruvlarni tugatdik, foydalanuvchini ma'lumotlar bazasiga qo'shish vaqti keldi. Belgilangan joyda" // (4) Ma'lumotlar bazasiga foydalanuvchi qo'shish uchun kodni joylashtiring"quyidagi kodni qo'shing:

//Foydalanuvchini ma'lumotlar bazasiga qo'shish uchun so'rov $result_query_insert = $mysqli->query("INSERT INTO `foydalanuvchilar' (familiya, familiya, email, parol) VALUES ("".$first_name."", "".$last_name ." ", "".$elektron pochta.", "".$parol."")"); if(!$result_query_insert)( // Xato xabarini seansga saqlang. $_SESSION["error_messages"] .= "

Maʼlumotlar bazasiga foydalanuvchi qoʻshish soʻrovida xato

Ro'yxatdan o'tish muvaffaqiyatli yakunlandi!!!
Endi siz foydalanuvchi nomi va parolingizdan foydalanib tizimga kirishingiz mumkin.

"; //Foydalanuvchini avtorizatsiya sahifasi sarlavhasiga yuboring("HTTP/1.1 301 Doimiy ko'chirildi"); header("Joylashuv: ".$adres_sayt."/form_auth.php"); ) /* So'rovni bajarish */ $ result_query_insert-> close(); //ma'lumotlar bazasiga ulanishni yopish $mysqli->close();

Agar foydalanuvchini ma'lumotlar bazasiga qo'shish so'rovida xatolik yuz bergan bo'lsa, biz ushbu xato haqida sessiyaga xabar qo'shamiz va foydalanuvchini ro'yxatdan o'tish sahifasiga qaytaramiz.

Aks holda, agar hamma narsa yaxshi bo'lsa, biz ham sessiyaga xabar qo'shamiz, lekin bu safar bu yanada yoqimli, ya'ni foydalanuvchiga ro'yxatdan o'tish muvaffaqiyatli bo'lganligini aytamiz. Va biz uni avtorizatsiya shakli bilan sahifaga yo'naltiramiz.

Elektron pochta manzili formati va parol uzunligini tekshirish uchun skript faylda mavjud header.php, shuning uchun u ushbu shakldagi maydonlarga ham tegishli bo'ladi.

Seans ham faylda boshlanadi header.php, shuning uchun faylda form_auth.php Seansni boshlashning hojati yo'q, chunki biz xatoga yo'l qo'yamiz.

Aytganimdek, elektron pochta manzili formati va parol uzunligini tekshirish uchun skript ham bu erda ishlaydi. Shuning uchun, agar foydalanuvchi noto'g'ri elektron pochta manzilini yoki qisqa parolni kiritsa, u darhol xato xabarini oladi. Bir tugma kirish harakatsiz holga keladi.

Xatolarni tuzatgandan so'ng, tugma kirish faollashadi va foydalanuvchi shaklni serverga yuborishi mumkin bo'ladi va u erda qayta ishlanadi.

Foydalanuvchi avtorizatsiyasi

Atribut qiymati uchun harakat avtorizatsiya nogironligida ko'rsatilgan fayl mavjud auth.php, bu shakl ushbu faylda qayta ishlanishini bildiradi.

Shunday qilib, faylni oching auth.php va avtorizatsiya formasini qayta ishlash uchun kod yozing. Siz qilishingiz kerak bo'lgan birinchi narsa - seansni boshlash va faylni ulash dbconnect.php ma'lumotlar bazasiga ulanish uchun.

//Formaga ishlov berishda yuzaga kelishi mumkin bo'lgan xatolarni qo'shish uchun katakchani e'lon qiling. $_SESSION["error_messages"] = ""; //Muvaffaqiyatli xabarlarni qo'shish uchun katakchani e'lon qilish $_SESSION["success_messages"] = "";

/* Shakl topshirilganligini, ya'ni Login tugmasi bosilganligini tekshiring. Ha bo'lsa, biz davom etamiz, bo'lmasa, foydalanuvchiga ushbu sahifaga to'g'ridan-to'g'ri kirganligini ko'rsatadigan xato xabarini ko'rsatamiz. */ if(isset($_POST["btn_submit_auth"]) && !empty($_POST["btn_submit_auth"]))( //(1) Keyingi kod qismi uchun bo'sh joy )else( exit("

Xato! Siz bu sahifaga toʻgʻridan-toʻgʻri kirgansiz, shuning uchun qayta ishlanadigan maʼlumotlar yoʻq. Siz asosiy sahifaga o'tishingiz mumkin.

"); }

//Qabul qilingan captcha-ni tekshiring if(isset($_POST["captcha"]))( //Satr boshidan va oxiridan bo'sh joylarni kesib oling $captcha = trim($_POST["captcha"]); if(! empty($captcha ))( //Qabul qilingan qiymatni sessiyadagi qiymat bilan solishtiring. if(($_SESSION["rand"] != $captcha) && ($_SESSION["rand"] != "")) ( // Agar captcha noto'g'ri bo'lsa, biz foydalanuvchini avtorizatsiya sahifasiga qaytaramiz va u erda u noto'g'ri captcha kiritganligi haqida xato xabarini ko'rsatamiz. $error_message = "

Xato! Siz noto'g'ri captcha kiritdingiz

Xato! Captcha kiritish maydoni bo'sh bo'lmasligi kerak.

"; // Seansga xato xabarini saqlang. $_SESSION["error_messages"] = $error_message; // Foydalanuvchini avtorizatsiya sahifasi sarlavhasiga qaytaring("HTTP/1.1 301 Doimiy ko'chirildi"); header("Joylashuv: " .$address_site ."/form_auth.php"); //Skriptdan chiqishni to'xtating(); ) //(2) Elektron pochta manzilini qayta ishlash joyi //(3) Parolni qayta ishlash uchun joy //(4) ma'lumotlar bazasiga so'rov tuzish )else ( //Agar captcha o'tkazilmasa exit("

Xato! Tasdiqlash kodi, ya'ni captcha kodi yo'q. Siz asosiy sahifaga o'tishingiz mumkin.

"); }

Agar foydalanuvchi tasdiqlash kodini to'g'ri kiritgan bo'lsa, biz davom etamiz, aks holda uni avtorizatsiya sahifasiga qaytaramiz.

Pochta manzilini tekshirish

//Satr boshidan va oxiridan bo'sh joylarni kesish $email = trim($_POST["email"]); if(isset($_POST["email"]))( if(!empty($email))( $email = htmlspecialchars($email, ENT_QUOTES); //Qabul qilingan elektron pochta manzilining formatini $ oddiy ifoda yordamida tekshiring reg_email = " /^**@(+(*+)*\.)++/i"; //Agar qabul qilingan elektron pochta manzilining formati oddiy ifodaga mos kelmasa if(!preg_match($reg_email, $email) ))( // Seans xato xabariga saqlang. $_SESSION["error_messages"] .= "

Siz noto'g'ri elektron pochta manzilini kiritdingiz

"; //Foydalanuvchini avtorizatsiya sahifasi sarlavhasiga qaytaring("HTTP/1.1 301 Doimiy ko'chirildi"); header("Joylashuv: ".$adres_sayt."/form_auth.php"); //Skriptdan chiqishni to'xtating(); ) )else ( // Xato xabarini seansga saqlang. $_SESSION["error_messages"] .= "

Pochta manzilini (elektron pochta) kiritish uchun maydon bo'sh bo'lmasligi kerak.

Elektron pochta kiritish maydoni mavjud emas

Agar foydalanuvchi elektron pochta manzilini noto'g'ri formatda kiritgan bo'lsa yoki elektron pochta manzili maydoni bo'sh bo'lsa, biz uni avtorizatsiya sahifasiga qaytaramiz, u erda bu haqda xabar ko'rsatiladi.

Parolni tekshirish

Keyingi ishlov beriladigan maydon parol maydonidir. Belgilangan joyga" //(3) Parolni qayta ishlash uchun joy", biz yozamiz:

If(isset($_POST["password"]))( //String boshidan va oxiridan bo'shliqlarni kesib tashlang $password = trim($_POST["password"]); if(!empty($password))( $password = htmlspecialchars($password, ENT_QUOTES); //Parolni shifrlang $password = md5($password."top_secret"); )else( //Xatolik xabarini sessiyaga saqlang. $_SESSION["error_messages"] . = "

Parolingizni kiriting

Parol maydoni mavjud emas

"; //Foydalanuvchini ro'yxatdan o'tish sahifasi sarlavhasiga qaytaring("HTTP/1.1 301 Doimiy ko'chirildi"); header("Joylashuv: ".$adres_sayt."/form_auth.php"); //Skriptdan chiqishni to'xtating(); )

Bu erda biz qabul qilingan parolni shifrlash uchun md5() funksiyasidan foydalanamiz, chunki bizning parollarimiz ma'lumotlar bazasida shifrlangan shaklda. Shifrlashda qo'shimcha maxfiy so'z, bizning holatlarimizda " yuqori_sir" foydalanuvchini ro'yxatdan o'tkazishda foydalanilgan bo'lishi kerak.

Endi siz elektron pochta manzili qabul qilingan elektron pochta manziliga va paroli qabul qilingan parolga teng bo'lgan foydalanuvchini tanlash uchun ma'lumotlar bazasiga so'rov yuborishingiz kerak.

//Foydalanuvchining tanlovi asosida ma'lumotlar bazasida so'rov. $result_query_select = $mysqli->query("SELECT * FROM `users` WHERE email = "".$email."" AND password = "".$parol."""); if(!$result_query_select)( // Xato xabarini seansga saqlang. $_SESSION["error_messages"] .= "

Ma'lumotlar bazasidan foydalanuvchi tanlashda so'rov xatosi

"; //Foydalanuvchini ro'yxatdan o'tish sahifasi sarlavhasiga qaytaring("HTTP/1.1 301 Doimiy ko'chirildi"); header("Joylashuv: ".$adres_sayt."/form_auth.php"); //Skriptdan chiqishni to'xtating(); )else( //Ma'lumotlar bazasida bunday ma'lumotlarga ega foydalanuvchi yo'qligini tekshirib ko'ring, keyin xato xabarini ko'rsating if($result_query_select->num_rows == 1)( // Agar kiritilgan ma'lumotlar ma'lumotlar bazasi ma'lumotlariga mos kelsa, keyin saqlang seanslar massiviga login va parol. $_SESSION["email"] = $email; $_SESSION["password"] = $password; //Foydalanuvchini asosiy sahifa sarlavhasiga qaytaring("HTTP/1.1 301 Doimiy ko'chirildi" ); header("Joylashuv: ".$adres_sayt ."/index.php"); )else( // Xato xabarini sessiyaga saqlang. $_SESSION["error_messages"] .= "

Noto'g'ri login va/yoki parol

"; //Foydalanuvchini avtorizatsiya sahifasi sarlavhasiga qaytaring("HTTP/1.1 301 Doimiy ko'chirildi"); header("Joylashuv: ".$adres_sayt."/form_auth.php"); //Skriptdan chiqishni to'xtating(); ))

Saytdan chiqish

Va biz amalga oshiradigan oxirgi narsa saytni tark etish tartibi. Ayni paytda sarlavhada biz avtorizatsiya sahifasiga va ro'yxatdan o'tish sahifasiga havolalarni ko'rsatamiz.

Sayt sarlavhasida (fayl header.php), sessiya yordamida biz foydalanuvchi allaqachon avtorizatsiya qilinganligini tekshiramiz. Agar yo'q bo'lsa, biz ro'yxatdan o'tish va avtorizatsiya havolalarini ko'rsatamiz, aks holda (agar u vakolatli bo'lsa), ro'yxatdan o'tish va avtorizatsiya havolalari o'rniga biz havolani ko'rsatamiz. Chiqish.

Fayldan o'zgartirilgan kod qismi header.php:

Roʻyxatdan oʻtish

Chiqish

Saytdan chiqish havolasini bosganingizda, biz faylga o'tamiz logout.php, bu erda biz oddiygina seansdan elektron pochta manzili va parol bilan hujayralarni yo'q qilamiz. Shundan so'ng, biz foydalanuvchini havola bosilgan sahifaga qaytaramiz Chiqish.

Fayl kodi logout.php:

Ana xolos. Endi qanday qilib ro'yxatga olish va ruxsat berish shakllarini amalga oshirish va qayta ishlash veb-saytingizdagi foydalanuvchi. Ushbu shakllar deyarli har bir veb-saytda mavjud, shuning uchun har bir dasturchi ularni qanday yaratishni bilishi kerak.

Shuningdek, biz kiritilgan ma'lumotlarni mijoz tomonida (brauzerda, JavaScript, jQuery yordamida) va server tomonida (PHP yordamida) qanday tekshirishni o'rgandik. Biz ham o'rgandik saytni tark etish tartibini amalga oshirish.

Barcha skriptlar sinovdan o'tgan va ishlamoqda. Ushbu kichik saytning fayllari bilan arxivni ushbu havoladan yuklab olishingiz mumkin.

Kelajakda men tasvirlaydigan maqola yozaman. Va men ham tushuntirib beradigan maqola yozishni rejalashtirmoqdaman (sahifani qayta yuklamasdan). Shunday qilib, yangi maqolalar chiqishi haqida xabardor bo'lish uchun siz mening veb-saytimga obuna bo'lishingiz mumkin.

Agar sizda biron bir savol bo'lsa, iltimos, men bilan bog'laning va agar siz maqolada biron bir xatolikni sezsangiz, menga xabar bering.

Dars rejasi (5-qism):

Avtorizatsiya shakli uchun HTML strukturasini yaratish
Qabul qilingan ma'lumotlarni qayta ishlaymiz
Biz sayt sarlavhasida foydalanuvchi salomini ko'rsatamiz

Sizga maqola yoqdimi?

Biz WordPress saytingizda, blogingizda, forumingizda va hokazolarda foydalanishingiz mumkin bo'lgan 60 ta bepul kirish shakllari ro'yxatini tuzdik. Har bir shakl uning ishlashi va manba kodi mavjudligiga ishonch hosil qilish uchun sinchkovlik bilan tekshiriladi.

WordPress tizimga kirish moslamasi

Ushbu ro'yxatdagi shakllar HTML/CSS yordamida yaratilgan. Ammo bu holda, biz WordPress UI-ni sozlash uchun eng yaxshi plagin haqida gapiramiz. Bu sizning veb-saytingiz dizayniga mos ravishda sozlanishi mumkin bo'lgan bir nechta andozalar bilan birga keladi. Ushbu plagin yordamida siz zerikarli WordPress kirish sahifasidan xalos bo'lishingiz mumkin.

Yuklab olish

Ko‘rib chiqish

19-sonli ruxsatnoma shakli

Jonli, g'ayratli va hayajonli - bu kirish shaklining mazmuni. U to'liq javob beradi, mobil optimallashtirilgan va barcha asosiy veb-brauzerlar bilan mos keladi.

Yuklab olish

Ko‘rib chiqish

20-sonli ruxsatnoma shakli

Gradient fon, hover effektli qora tugma, login va parolni kiritish uchun maydonlar, shuningdek, "Parolni unutdingizmi?" bo'limi. Bularning barchasi 20-sonli ruxsatnoma shaklida.

Yuklab olish

Ko‘rib chiqish

HTML5 va CSS3 yordamida oddiy login formasini yaratish misoli. U bir nechta sahifalar effektini yaratish uchun psevdo elementlardan (:after va :before) foydalanadi. Ushbu shakl ma'lumotlarni tekshirish va taqdim etishni soddalashtirish uchun HTML5 dan foydalanadi.

Yuklab olish

Shake effekti bilan tizimga kiring

Agar siz noto'g'ri parolni kiritgan bo'lsangiz, sizga chiroyli silkitish effekti bilan xabar beriladi. Oddiy va samarali yechim.

Yuklab olish

Identifikator:
Nomi:
Kurs:
Filial:
Rollno:
E-pochta manzili:
User_Name:
Biz haqimizda:
Parol:

Shaklni yuborish tugmasi

Shaklni yuborish tugmasi

Ro'yxatdan o'tish uchun HTML kodi

Ro'yxatdan o'tish shakli

Ma'lumotlar bazasida jadval yaratish

Ma'lumotlar bazasiga ulanish

Sayt tuzilishi

Siz allaqachon ro'yxatdan o'tgansiz

JQuery yordamida elektron pochtaning haqiqiyligini tekshirish

Foydalanuvchini ro'yxatdan o'tkazish

Foydalanuvchi avtorizatsiyasi

Pochta manzilini tekshirish

Parolni tekshirish

Saytdan chiqish

Sizga maqola yoqdimi?

WordPress tizimga kirish moslamasi

Ijodiy kirish shakli

1-sonli avtorizatsiya shakli

2-sonli avtorizatsiya shakli

3-sonli avtorizatsiya shakli

4-sonli avtorizatsiya shakli

5-sonli avtorizatsiya shakli

6-sonli avtorizatsiya shakli

7-sonli ruxsatnoma shakli

8-sonli ruxsatnoma shakli

9-sonli ruxsatnoma shakli

10-sonli avtorizatsiya shakli

11-sonli ruxsatnoma shakli

12-sonli ruxsatnoma shakli

13-sonli ruxsatnoma shakli

14-sonli ruxsatnoma shakli

15-sonli ruxsatnoma shakli

16-sonli ruxsatnoma shakli

17-sonli ruxsatnoma shakli

18-sonli ruxsatnoma shakli

19-sonli ruxsatnoma shakli

20-sonli ruxsatnoma shakli

Ochiladigan kirish shakli

Suzuvchi ro'yxatdan o'tish shakli

Oddiy avtorizatsiya shakli

Yassi login - Ro'yxatdan o'tish shakli

O'z-o'zidan SCSS formasi bilan tizimga kiring

Animatsiyalangan kirish shakli

CSS3 va HTML5 yordamida tizimga kirish formasi

Shake effekti bilan tizimga kiring

Boxy kirish formasi