أنشاء نظام كامل لتسجيل الدخول بـ PHP

المدير العام · ‏12/7/2022

أنشاء نظام كامل لتسجيل الدخول بـ PHP

المدير العام · ‏12/7/2022

تجهيز بيئة العمل
تحميل و تجهيز برنامج Xampp
العمل على الbackend في المواقع نحتاج دائما لما يعرف ب "خادم http " و ذلك لاستقبال الطلبات و معالجتها .
يمكن تشغيل خادم http على جهازك و ذلك باستخدام برامج مثل XAMPP. الذي يوفر بالاضافة الى خادم http مجموعة خدمات مثل قاعدة بيانات MySql.

يمكن تحميل البرنامج من الرابط التالي :
https://www.apachefriends.org/download.html

بعد التحميل و التثبيت .. ستظهر لكم واجهة مشابهة لهذه بعد التحميل:

قم بتشغيل خادم الhttp و قاعدة البيانات بالنقر على زر "start".
للتأكد من كل شيء يعمل , اذهب الى المتصفح و انتقل الى الرابط التالي localhost . المفروض ان تظهر صفحة مشابهة لهذه:

انشاء ملفات المشروع
لتجهيز المشروع للتجاوب مع الخادم . ملفات المشروع يجب ان تكون على المسار التالي : C:\xampp\htdocs . ستجد هناك مجموعة من الملفات عليك أن تمحوها (او تنقل الملفات الى مكان آخر.) . سنقوم بانشاء ملفات جديدة مناسبة للمشروع الخاص بنا :
- ملف index.php : و هو الملف الذي سنطلق منه الموقع عند الانتقال الى localhost في المتصفح .
- ملف style.css : هذا الملف هو الملف الذي سيحمل كود الcss الخاص بنا . يمكنك كتابة كود الCSS في ملف index.php ايضا لكن الأفضل دائما هو التفريق بين الأكواد المختلفة لتحسين المقروئية.
- مجلد images: للصور.
- مجلد Auth: في هذا المجلد سننشئ الملفات الخاصة بصفحة تسجيل الدخول و تسجيل الحساب في الخطوات اللاحقة.

المجموع سيكون :

التأكد أن كل شيئ جاهز
للتأكد من أن كل شيئ جاهز و فعال: فلنقم بالتعديل على ملف index.php :
قم بكتابة كود صفحة الhtml بالشكل التالي:
كود HTML:
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>My website name</title>
    <link rel="stylesheet" href="style.css">
</head>

<body>
            <h1 class="title" >My website </h1>
            <div class="btn-panel">
                <a href="/Auth/login.php"> تسجيل الدخول</a>
                <a href="/Auth/register.php"> حساب جديد</a>
            </div>
</body>

</html>
المفروض انك على علم مسبق بلغة الhtml . هذه الصفحة بسيطة كمقدمة للموقع. يمكنكم التعديل على الصفحة لتناسب ذوقكم من خلال التعديل على CSS.
لاحظ في هذين السطرين:
كود HTML:
<a href="/Auth/login.php"> تسجيل الدخول</a>
<a href="/Auth/register.php"> حساب جديد</a>
يحمل "href" المسار الخاص بالصفحات التي سننشئها في المجلد Auth , و التي تمثل صفحة تسجيل الدخول و تسجيل الحسابات.

انتقل للمتصفح الى localhost . المفترض أن تجد التصميم الذي صنعته:

في حال لم يظهر التصميم الخاص بك:
_تفقد أن برنامج الXampp شغال و خادم apache فعال.
_تفقد انك وضعت الملفات في المسار الصحيح
_تفقد أنك حفظت الكود في ملف index.php بعد التعديل عليه .

المدير العام · ‏12/7/2022

تجهيز قاعدة البيانات
تجهيز الجداول
بما ان المعلومات الخاصة بالمستخدم يجب أن تحفظ ، فذلك يجعلنا بحاجة لقاعدة بيانات .
سنستخدم في هذا المشروع قاعدة بيانات MySql .يوفر Xampp واجهة للتحكم بقاعدة البيانات و هو ما يعرف ب PhpMyAdmin.
للانتقال لPhpMyadmin عليك تشغيل خادم apache و خادم mysql من على Xampp ثم الانتقال الى الرابط التالي على المتصفح :
localhost/phpmyadmin

ستنتقل الى الصفحة التالية :

تذكر : اسم المستخدم الخاص بقاعدة البياتات هو root و كلمة السر فارغة

سنقوم بانشاء قاعدة بيانات جديدة لمشروعنا و ذلك بـ :
1-الضغط على New في أعلى القائمة الجانبية .
2-في الحقل 'Database name' سندخل اسم قاعدة البيانات ، فليكن : Mywebsite.
3-ثم اضغط على Create .

ستنقل الى صفحة انشاء الجداول :
في حقل Name : قم بادخال اسم الجدول : فليكن users .
في Number of columns قم بادخال 5 و ذلك يعني خمسة أعمدة نحن بحاجة لعمود لرقم المستخدم ،عمود لإسم ، عمود للبريد الالكتروني ، عمود لكلمة السر و عمود لتاريخ انشاء الحساب .

ستظهر صفحة بها حقول إملأها بالشكل التالي :

حيث عمود:
-رقم المستخدم : "id" قيمته قيمة عددية INT، و بما ان رقم المستخدم يجب ان لا يتكرر فهو unique.
-الإسم :"username" قيمته نصية و طول القيمة لا يتجاوز 55 حرف .
-البريد الالكتروني:"email" و هو قيمة نصية طبعا لا تتجاوز 55 حرف.
-كلمة السر : "password" قيمة نصية أيضا .
-وقت انشاء الحساب : "create_date" قيمته Timestamp مما يعني"تاريخ" و قيمته القياسية التي يبدأ (default value) بها هي تاريخ اليوم Current_TimeStamp.

بعدها اضغط على save .

انشاء كود الاتصال ب PHP
بعد انشاء قاعدة البيانات ، يجب ربط موقعك بها و ذلك باستخدام كود PHP . توفر PHP طريقتين للاتصال بقاعدة البيانات Mysql , اما عن طريق MySqli او او عن طريق PDO. كلتا الطريقتين فعالتين و لكننا سنستخدم PDO كونها الطريقة الأنسب لمعاينة و معالجة الأخطاء .
قم بانشاء ملف جديد اسمه Connect.php ثم قم بكتابة الكود الآتي :

كود PHP:

<?php $servername = "localhost"; $username = "root"; $password = ""; $conn = null; try { $conn = new PDO("mysql:host=$servername;dbname=mywebsite", $username, $password); $conn->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION); echo "تم الاتصال بقاعدة البيانات"; } catch (PDOException $e) { echo "فشل الاتصال : <br> " . $e->getMessage(); }

في الأسطر الأولى قمنا بتعيين المتغيرات التي نحتاجها لانشاء الاتصال بالقاعدة و هي :

servername: و يعني عنوان الخادم الذي يحمل قاعدة البيانات .

username: اسم المستخدم الخاص بقاعدة البيانات

password: كلمة السر الخاصة بقاعدة البيانات .

conn: يمثل هذا المتغير الاتصال بقاعدة البيانات . سنحتاجه لاحقا لاجراء عمليات على القاعدة أيضا .

في هذا السطر :
كود:
$conn = new PDO("mysql:host=$servername;dbname=mywebsite", $username, $password);
انشأنا اتصال باستعمال PDO .
"لاحظ وضعنا قيمة dbname هي اسم قاعدة البيانات الذي أنشأناها سابقا ."

هذا السطر :
كود:
$conn->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);
هو المسؤول عن ارسالارسال الارسال الأخطاء حيث تأخذ الدالة setAttribute براميترين هما :

PDO::ATTR_ERRMODE : ضروري لاظهار الأخطاء.

PDO::ERRMODE_EXCEPTION: و ذلك لارسال الأخطاء على شكل Exceptions يمكننا معالجتها ب : try/catch.

سيقوم الكود بطباعة "تم الاتصال بقاعدة البيانات" في حال عمل كل شيئ بسلاسة .
و طباعة : "فشل الاتصال" في حال حصول خطأ.

لتشغيل الكود أنتقل الى الرابط التالي في المتصفح
كود:
 localhost/Connect.php
لاحظ :السبب وراء كتابة كود الاتصال بقاعدة البيانات منفصل هو لتجنب كتابة نفس الكود كل مرة .
ستتعرف على الفائدة في الخطوات القادمة

المدير العام · ‏12/7/2022

انشاء صفحة تسجيل الحسابات
انشاء حقول المدخلات
اولا سنقوم بانشاء صفحة لتسجيل الحسابات الجديدة.فلتقم بانشاء داخل مجلد Auth الذي أنشأناه سابقا ملف اسمه register.php و الذي يمثل صفحة تسجيل الحسابات .
الخطوة الأولى في انشاء اي صفحة ويب هي ضبط html الخاص بها.
مانحتاجه في هذه الصفحة هو مجموعة من الحقول ليسجل فيها المستخدم معلوماته
و هي :

حقل للاسم

حقل للبريد الالكتروني

حقل لتأكيد البريد الالكتروني

حقل لكلمة السر

حقل لتأكيد كلمة السر

بالاضافة لزر لتأكيد التسجيل .
كود HTML:
<!DOCTYPE html>
<html dir="rtl">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="../style.css">
    <title>Register</title>
</head>

<body>
    <form class="registerform" action="/Auth/register.php" method="post">
        <h1>انشاء حساب جديد</h1>
        <table>
            <tr>
                <td>الاسم</td>
                <td><input type="text" name="username" id="" required></td>
            </tr>
            <tr>
                <td>البريد الالكتروني</td>
                <td><input type="email" name="email" id="" required></td>
            </tr>
            <tr>
                <td>تأكيد البريد الالكتروني</td>
                <td><input type="email" name="confirm_email" id="" required></td>
            </tr>
            <tr>
                <td>كلمة السر</td>
                <td><input type="text" name="password" id="" required></td>
            </tr>
            <tr>
                <td>تأكيد كلمة السر</td>
                <td><input type="text" name="confirm_password" id="" required></td>
            </tr>
            <tr>
                <td></td>
                <td><input type="submit" value="تسجيل"></td>
            </tr>
        </table>
    </form>
</body>

</html>
للتنسيق استعملنا وسم <table> و ذلك لكي تظهر الحقول متراصة .
لاحظ اننا كتبنا الكود الخاص بالحقول داخل وسم <form> . يستعمل هذا الوسم لارسال بيانات الحقول التي بداخله الى كود الـ php ( اي ارسال البيانات الى الخادم لمعالجتها.
لاحظ وجود داخل وسم input الخاص بالحقول الخاصية name . هي جد مهمة لتعريف البيانات و سنتطرق لها لاحقا في كود الphp.
لاحظ ايضا ان بعض الوسوم أعطينا لها قيم للclass وذلك لتنسيقها بالـ CSS فيما بعد.

ستكون النتيجة من الشكل :

التنسيق باستعمال CSS
قبل البدأ بضبط الـ backend في الصفحة . فلنقم ببعض التعديلات :
-يجب ربط ملف ال style.css بالصفحة وذلك من خلال السطر التالي في الكود
كود HTML:
<link rel="stylesheet" href="../style.css">
سنظيف بعض التعديلات على ملف style.css و ذلك لتنسيق الحقول :
كود:
.registerform {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    padding: 70px 25px;
    max-width: fit-content;
    margin: 0 auto 0 auto;
    color: white;
    background: #ff000060;
    box-shadow: rgba(0, 0, 0, 0.274) 0px 0px 80px;
    border-radius: 25px;
    font-weight: bolder;
}

.registerform h1 {
    text-shadow: black 20px 0px 40px;
}

.registerform input {
    color: white;
    background: rgba(255, 252, 95, 0.2);
    border: none;
    padding: 5px 25px 5px 25px;
}
لن نتكلم مطولا عن كود الـ css كوننا مهتمين بالـ backend اكثر . اذا كنت مهتما بتعلم الـ css تفقد منتديات أكتب كود لتجد مايهمك

النتيجة:

المدير العام · ‏12/7/2022

حفظ الحساب في قاعدة البيانات و تسجيل الدخول
قبل حفظ البيانات , علينا فلترة البيانات التي تمر الى القاعدة و تصفية الطلبات الصحيحة من الضارة.

لقيام بارسال البيانات المكتوبة في حقول الHTML , علينا وضعها داخل وسم form . حيث علينا :
تحديد طريقة الطلب : وذلك من خلال كتابة الطريقة التي نريدها داخل method . سنستعمل طريقة post ( التي تعني بشكل مختصر لا تظهر البيانات في الرابط على عكس get التي تقوم باظهار البيانات المرسلة في الطلب داخل الرابط ).
تحديد الصفحة التي ستعالج البيانات : و ذلك بكتابة رابط الصفحة داخل action . نحن سنكتب الكود الذي يعالج البيانات المستقبلة بنفس الصفحة لذلك سنضع رابط الصفحة :
كود:
action="/Auth/register.php"
او يمكن كتابة نقطة
كود:
action="."
سيكون وسم الform بهذا الشكل :
كود:
<form class="registerform" action="/Auth/register.php" method="post">
لا تنسى اغلاق الform طبعا . يجب أن يحتوي على جميع الحقول المطلوبة بالاضافة الى زر submit.

سنبدأ الآن بكتابة كود الphp . يستحسن كتابته قبل كود الhtml اي قبل وسم <html> .
اولا سنقوم بالاتصال بقاعدة البيانات . و ذلك بتضمين صفحة Connect.php التي تحتوي على كود الاتصال . ثم نقوم بانشاء متغير و نسميه errors . وذلك لارسال الأخطاء الموجودة بالطلب عم طريقه ....

قبل حفظ البيانات, يجب التأكد من وجود كافة البيانات في الطلب (request) . بما أننا استخدمنا طريقة post فاننا سنجد البيانات المخزنة في متغير $_POST ( تعرف هذه المتغيرات في لغة php ب super global variables اذا كنت مهتم بالبحث عنها ) .
للتأكد من أن البيانات كاملة ببساطة نستعمل isset :

كود PHP:

$is_request_full = isset($_POST["username"]) && isset($_POST["email"]) && isset($_POST["confirm_email"]) && isset($_POST["password"])

اذا فقد أحد البيانات يعني الطلب ناقص , في تلك الحالة سنضع الخطأ في $errors لطباعته لاحقا .

كود PHP:

if ($is_request_full) { // هنا سنكتب الكود الخاص باذا كان الطلب كاملا } else {     $errors = "تأكد من الحقول قبل التسجيل"; }

اذا كانت كل البيانات محددة يعني الطلب صحيح , اذا ننتقل للخطوة التالية :
علينا التأكد أيضا ان حقل كلمة المرور و حقل تأكيد كلمة المرور متطابقان كذلك بالنسبة لحقول البريد و تأكيد البريد . و تجهيز رسالة الخطأ لطباعتها لاحقا اذا لم تكن الحقول متطابقة
لاحظ :
[email , confirm_email , password,confirm_password] هي الأسماء التي ربطنها بالحقول (input) من خلال name

كود PHP:

if ($_POST["email"] == $_POST["confirm_email"] && $_POST["password"] == $_POST["confirm_password"]) { // هنا سنكتب الكود اذا كانت الحقول متطابقة كما نريد } else if ($_POST["email"] != $_POST["confirm_email"]) { // اذا كان البريد لا يتطابق في الحقلين         $errors .= "<div>البريد الالكتروني لا يتطابق في الحقلين</div>"; } else if ($_POST["password"] != $_POST["confirm_password"]) { // اذا كانت كلمة المرور لا تتطابق في الحقلين         $errors .= "<div>كلمة المرور لا تتطابق في الحقلين</div>"; }

عد التأكد ان الحقول متطابقة ، سنبدأ بتأمين البيانات لتخزينها في قاعدة البيانات . اولا سنستعمل دالة htmlspecialchars للحماية من هجمات الXSS. تقوم هذه الدالة بتأمين البيانات من أكواد HTML الخبيثة.
لاتقلق ، لاتزال html غير كافية لقرصنة NASA . ابحث عن ثغرة الXSS لتفهم أكثر .
نحتاج أيضا الى رقم تعريفي للمستخدم . لإنشائه سنقوم باستعمال دالتين في php و هما :

uniqid: و المستعملة لانشاء سلسلة من الرموز العشوائية.

hexdec : و التي سنستعملها لتحويل الحروف في السلسلة الى ارقام و بالتالي يصبح الرقم التعرفي مكون من أرقام فقط.

كود PHP:

$id = hexdec(uniqid());// الرقم التعريفي $username = htmlspecialchars($_POST["username"]); $email = htmlspecialchars($_POST["email"]); $pass =  htmlspecialchars($_POST["password"]);

بعد تأمين البيانات , سنتأكد ان البريد الالكتروني غير مستعمل وذلك بالتحقق أنه غير موجود في قاعدة البيانات .
من خلال الكود التالي:

كود PHP:

$is_already_registered = $conn->query("select * from users where email='$email'")->fetch();

تذكر لقد قمنا بانشاء المتغير $conn في Connect.php . و هو عبارة عن PDO Object.
يجب أن نجهز الخطأ في حالة وجود البريد الالكتروني :

كود PHP:

if (!$is_already_registered) { // اذا لم يكن البريد الالكتروني متواجدا في قاعدة البيانات //سنكتب كود تسجيل الحساب هنا } else {      $errors = "البريد الالكتروني مستعمل"; }

بعد التأكد أن البريد غير مستعمل , سنقوم بتجهيز طلب الsql لتخزين بيانات الحساب :

كود PHP:

$query =  $conn->prepare("INSERT INTO `users`(`id`,`username`, `email`, `password`) VALUES (?,?,?,?)");

حيث : علامة الاستفهام تمثل البيانات التي نريد تمريرها وهذه الخاصية توفرها طريقة الpdo و تسمح لنا بتمرير البيانات بشكل أوضح من اثناء التنفيذ. وذلك من خلال الكود التالي:

كود PHP:

$query->execute(array($id, $username, $email, sha1($pass)));

حيث عناصر المصفوفة تمثل علامات الاستفهام في الكود أعلاه.
لاحظ اننا استخدمنا sha1 . و هي دالة لتشفير كلمة المرور قبل حفظها و ذلك لحمايتها حتى بعد الحفظ .

بعد حفظ البيانات سنقوم بفتح جلسة و تسجيل الرقم التعريفي للمستخدم فيها :

كود PHP:

session_start(); $_SESSION['user_id'] = $id;

وجود الرقم التعريفي في بيانات الجلسة يعني ان المستخدم قد سجل الدخول مسبقا

ثم نعود للصفحة الرئيسية باستعمال الكود الأتي:

كود PHP:

header('Location: /');

سيصبح الكود الكامل من هذا الشكل:

كود PHP:

<?php include("../Connect.php"); $errors = ''; $is_request_full = isset($_POST["username"]) && isset($_POST["email"]) && isset($_POST["confirm_email"]) && isset($_POST["password"]) && isset($_POST["confirm_password"]); if ($is_request_full) {     if ($_POST["email"] == $_POST["confirm_email"] && $_POST["password"] == $_POST["confirm_password"]) {         $id = hexdec(uniqid());         $username = htmlspecialchars($_POST["username"]);         $email = htmlspecialchars($_POST["email"]);         $pass =  htmlspecialchars($_POST["password"]);         try {             $is_already_registered = $conn->query("select * from users where email='$email'")->fetch();             if (!$is_already_registered) {                 $query =  $conn->prepare("INSERT INTO `users`(`id`,`username`, `email`, `password`) VALUES (?,?,?,?)");                 $query->execute(array($id, $username, $email, sha1($pass)));                 session_start();                 $_SESSION['user_id'] = $id;                 header('Location: /');             } else {                 $errors = "البريد الالكتروني مستعمل";             }         } catch (Exception $e) {             $errors = "حدث خطأ اثناء الاتصال" . $e;         }     } else if ($_POST["email"] != $_POST["confirm_email"]) {         $errors .= "<div>البريد الالكتروني لا يتطابق في الحقلين</div>";     } else if ($_POST["password"] != $_POST["confirm_password"]) {         $errors .= "<div>كلمة المرور لا تتطابق في الحقلين</div>";     } } else {     $errors = "تأكد من الحقول قبل التسجيل"; } ?>

الآن علينا طباعة الأخطاء للمستخدم في حال وجودها .
بما أننا أنشأنا متغير $errors سابقا فكل ما علينا هو طباعته في صفحة الhtml حينما لا يكون فارغا . وذلك من خلال الكود الآتي:
كود HTML:
<div><?php echo $errors ?></div>
فلتكتبه مثلا بعد وسم ال h1 . و بذلك يصبح كود الصفحة:

كود PHP:

<?php include("../Connect.php"); $errors = ''; $is_request_full = isset($_POST["username"]) && isset($_POST["email"]) && isset($_POST["confirm_email"]) && isset($_POST["password"]) && isset($_POST["confirm_password"]); if ($is_request_full) { if ($_POST["email"] == $_POST["confirm_email"] && $_POST["password"] == $_POST["confirm_password"]) { $id = hexdec(uniqid()); $username = htmlspecialchars($_POST["username"]); $email = htmlspecialchars($_POST["email"]); $pass = htmlspecialchars($_POST["password"]); try { $is_already_registered = $conn->query("select * from users where email='$email'")->fetch(); if (!$is_already_registered) { $query = $conn->prepare("INSERT INTO `users`(`id`,`username`, `email`, `password`) VALUES (?,?,?,?)"); $query->execute(array($id, $username, $email, sha1($pass))); session_start(); $_SESSION['user_id'] = $id; header('Location: /'); } else { $errors = "البريد الالكتروني مستعمل"; } } catch (Exception $e) { $errors = "حدث خطأ اثناء الاتصال" . $e; } } else if ($_POST["email"] != $_POST["confirm_email"]) { $errors .= "<div>البريد الالكتروني لا يتطابق في الحقلين</div>"; } else if ($_POST["password"] != $_POST["confirm_password"]) { $errors .= "<div>كلمة المرور لا تتطابق في الحقلين</div>"; } } else { $errors = "تأكد من الحقول قبل التسجيل"; } ?> <!DOCTYPE html> <html dir="rtl"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <link rel="stylesheet" href="../style.css"> <title>Register</title> </head> <body> <form class="registerform" action="/Auth/register.php" method="post"> <h1>انشاء حساب جديد</h1> <div><?php echo $errors ?></div> <table> <tr> <td>الاسم</td> <td><input type="text" name="username" id="" required></td> </tr> <tr> <td>البريد الالكتروني</td> <td><input type="email" name="email" id="" required></td> </tr> <tr> <td>تأكيد البريد الالكتروني</td> <td><input type="email" name="confirm_email" id="" required></td> </tr> <tr> <td>كلمة السر</td> <td><input type="text" name="password" id="" required></td> </tr> <tr> <td>تأكيد كلمة السر</td> <td><input type="text" name="confirm_password" id="" required></td> </tr> <tr> <td></td> <td><input type="submit" value="تسجيل"></td> </tr> </table> </form> </body> </html>

المدير العام · ‏12/7/2022

انشاء صفحة تسجيل الدخول
انشاء الحقول اللازمة باستعمال html
بنفس الطريقة السابقة سنقوم بانشاء صفحة جديدة داخل مجلد Auth و ليكن اسمها login.php.
هذه الصفحة ستحتوي على حقلين :

حقل للبريد الالكتروني

حقل لكلمة المرور

و زر لتسجيل الدخول.
كود HTML:
<!DOCTYPE html>
<html dir="rtl">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="../style.css">
    <title>Login</title>
</head>

<body>
    <form class="registerform" action="/Auth/login.php" method="post">
        <h1>تسجيل الدخول</h1>
        <table>

            <tr>
                <td>البريد الالكتروني</td>
                <td><input type="email" name="email" id="" required></td>
            </tr>

            <tr>
                <td>كلمة السر</td>
                <td><input type="password" name="password" id="" required></td>
            </tr>

            <tr>
                <td></td>
                <td><input type="submit" value="تسجيل"></td>
            </tr>
        </table>
    </form>
</body>

</html>
لاحظ أننا غيرنا الـaction في وسم form الى /Auth/login.php

المدير العام · ‏12/7/2022

التأكد من تسجيل الدخول باستعمال PHP
بعد تحضير صفحة الhtml التي ستظهر للمستخدم , سنقوم لتجهيز الbackend.
أولا يجب أن ننشئ اتصالا بقاعدة البيانات و ذلك (كما في المرة السابقة) لتضمين الكود الموجود في Connect.php عن طريق include .
ثم سنقوم بتشغيل جلسة . طبعا الجلسة ستكون فارغة لا تحتوي معلومات عن الحساب.
(جلسة فارغة = لم يتم تسجيل الدخول . جلسة تحتوي على رقم الحساب التعريفي = تم تسجيل الدخول)
سننشئ متغير لحفظ الأخطاء كما في السابق : $errors

ثم سنتأكد أن الطلب كامل كما في الصفحة السابقة:

كود PHP:

$is_request_full = isset($_POST["email"]) && isset($_POST["password"]);

اذا شعرت بصعوبة في الفهم فأنصح بالعودة للخطوة السابقة (انشاء صفحة تسجيل الحسابات) و محاولة فهم التفاصيل.

اذا كان الطلب صحيحا و كاملا أذا سنقوم بتجهيز المعلومات و تأمينها :

كود PHP:

$email = htmlspecialchars($_POST["email"]); $password = htmlspecialchars($_POST["password"]);

بعد تجهيز المعلومات سنقوم بالبحث في قاعدة البيانات عن السطر الذي يحتولي على البريد الالكتروني و كلمة المرور. ولذلك سننشئ طلب sql و نستخدم فيه where لتحديد شرطنا.

كود PHP:

$query = $conn->prepare("SELECT * FROM users WHERE email=? and password=?");

بعد تجهيز الطلب سنمرر المعلومات (التي ستوضع مكان علامات الاستفهام في الطلب) و هي البريد الالكتروني ($email) و كلمة المرور مشفرة (لأن كلمة المرور المخزنة في قاعدة البيانات مشفرة ) حيث سنستخدم دالة sha1 لتتشفير . و ذلك كالآتي:

كود PHP:

$query->execute(array($email, sha1($password)));

بعد تنفيذ الطلب . يجب أن نتحقق من وجود سطر (يعني حساب مخزن في قاعدة البيانات) بنفس البريد و كلمة المرور. حيث اذا كان طلبنا فيه أسطر فهذا يعني أن البريد و كلمة المرور متطابقان و يوجد حساب يستعملهما . و اذا كان الطلب فارغا فهذا يعني أن المعلومات خاطئة .
لتأكد من المعلومات. سنستعمل fetch() حيث تتحقق هذه الدالة من أول سطر موجود في الطلب . اذا لم تكن توجد هناك أسطر فسترجع لنا false او 0 .

كود PHP:

if ($res = $query->fetch()) { $_SESSION["user_id"] = $res["id"]; header('Location: /'); } else { $errors = "المعلومات التي ادخلتها خاطئة"; }

اذا وجدت سطر فسنقوم بتخزينه في res.
ستكون res مصفوفة تحتوي على جميع الأعمدة الخاصة بالجدول users . للحصول على الرقم التعريفي يمكن تحصيله ب res["id"]$
طبعا علينا تخزين الرقم التعريفي في الجلسة لتأكيد تسجيل الدخول ثم العودة للصفحة الرئيسية .

كود PHP:

<?php include("../Connect.php"); session_start(); $errors = ''; $is_request_full = isset($_POST["email"]) && isset($_POST["password"]); if ($is_request_full) { $email = htmlspecialchars($_POST["email"]); $password = htmlspecialchars($_POST["password"]); $query = $conn->prepare("SELECT * FROM users WHERE email=? and password=?"); $query->execute(array($email, sha1($password))); if ($res = $query->fetch()) { $_SESSION["user_id"] = $res["id"]; header('Location: /'); } else { $errors = "المعلومات التي ادخلتها خاطئة"; } } ?>

تسجيل الدخول

أنشاء نظام كامل لتسجيل الدخول بـ PHP

المدير العام أدارة موقع أكتب كود

المدير العام أدارة موقع أكتب كود

المدير العام أدارة موقع أكتب كود

المدير العام أدارة موقع أكتب كود

المدير العام أدارة موقع أكتب كود

المدير العام أدارة موقع أكتب كود

المدير العام أدارة موقع أكتب كود

أنشاء نص متدرج جميل بأستخدام 3 أسطر فقط بأستخدام CSS

أنشاء تخزين سحابي بسيط | تحميل و رفع الملفات بأستعمال PHP

كود لأنشاء حساب على الفيسبوك

إرشادات لأنشاء كلمة مرور قوية

دورة تعليمية لتعلم ( Jasper Reports ) لأنشاء التقارير بالصوت والصورة

تسجيل الدخول

أنشاء نظام كامل لتسجيل الدخول بـ PHP

المدير العام أدارة موقع أكتب كود

المدير العام أدارة موقع أكتب كود

المدير العام أدارة موقع أكتب كود

المدير العام أدارة موقع أكتب كود

المدير العام أدارة موقع أكتب كود

المدير العام أدارة موقع أكتب كود

المدير العام أدارة موقع أكتب كود

أنشاء نص متدرج جميل بأستخدام 3 أسطر فقط بأستخدام CSS

أنشاء تخزين سحابي بسيط | تحميل و رفع الملفات بأستعمال PHP

كود لأنشاء حساب على الفيسبوك

إرشادات لأنشاء كلمة مرور قوية

دورة تعليمية لتعلم ( Jasper Reports ) لأنشاء التقارير بالصوت والصورة

عمليات بحث مفيدة