كيف أربط صفحة Html بقاعدة بيانات sql server؟

Saleh Kamal · 26 ديسمبر 2023

El Sayed El Tohamy · 12 يناير

للربط بين صفحة HTML وقاعدة بيانات MS SQL Server تحتاج لوجود لغة برمجية خادمية أو خلفية Back end.

لفهم الموضوع بشكل أكبر يجب ان نعرف أن موقع الويب يتكون من مكونين

الأول: الواجهة الأمامية Front-End: وهي صفحة HTML وما تحتويه من تنسيقات وصور وكذلك JavaScript، هذه الواجهة، هي وسيلة التواصل بين المستخدم والخادم.

الثاني: الواجهة الخلفية Back-End: وهي الشيفرات المكتوبة بلغة برمجة عالية المستوى مثل PHP, ASP.NET, Node.JS ويتم تخزينها على الخادم وتنفيذها لما يتم طلبها.

مثال شهير: محرك البحث جوجل يتكون من واجهتين الأولى هى الواجهة الأمامية التي نراها (صفحة الجوجل)، والثانية هي شيفرات برمجية مكتوبة على الخادم ويتم تنفيذها عندما تكتب شيئًا في مربع البحث والضغط على زر "بحث"

الخلاصة: يلزمك تعلم لغة برمجة خادمية أو الاستعانة بمبرمج خادمي.

ويتم الاتصال بقواعد بيانات MS SQL Server عن طريق معرفة بيانات الاتصال التي تتكون من اسم الخادم - اسم المستخدم - كلمة المرور، ثم يتم إرسال الأمر المطلوب تنفيذه إلى قاعدة البيانات وهي ترد علينا بالنتائج Result set فنقوم بعرضها على صفحة HTML.

كمال صالح2 · 12 يناير

بتاريخ منذ ساعة مضت قال El Sayed El Tohamy:

للربط بين صفحة HTML وقاعدة بيانات MS SQL Server تحتاج لوجود لغة برمجية خادمية أو خلفية Back end.

لفهم الموضوع بشكل أكبر يجب ان نعرف أن موقع الويب يتكون من مكونين

الأول: الواجهة الأمامية Front-End: وهي صفحة HTML وما تحتويه من تنسيقات وصور وكذلك JavaScript، هذه الواجهة، هي وسيلة التواصل بين المستخدم والخادم.

الثاني: الواجهة الخلفية Back-End: وهي الشيفرات المكتوبة بلغة برمجة عالية المستوى مثل PHP, ASP.NET, Node.JS ويتم تخزينها على الخادم وتنفيذها لما يتم طلبها.

مثال شهير: محرك البحث جوجل يتكون من واجهتين الأولى هى الواجهة الأمامية التي نراها (صفحة الجوجل)، والثانية هي شيفرات برمجية مكتوبة على الخادم ويتم تنفيذها عندما تكتب شيئًا في مربع البحث والضغط على زر "بحث"

الخلاصة: يلزمك تعلم لغة برمجة خادمية أو الاستعانة بمبرمج خادمي.

ويتم الاتصال بقواعد بيانات MS SQL Server عن طريق معرفة بيانات الاتصال التي تتكون من اسم الخادم - اسم المستخدم - كلمة المرور، ثم يتم إرسال الأمر المطلوب تنفيذه إلى قاعدة البيانات وهي ترد علينا بالنتائج Result set فنقوم بعرضها على صفحة HTML.

ممكن التعديل على الكود التالي:

 <?php
    $server = 'DESKTOP-PJDLJNR';
    $database = 'Legacy';
    $username = '';
    $password = '';

    $connection = new PDO("sqlsrv:Server=$server;Database=$database", $username, $password);
    if (!$connection) {
    die(print_r(sqlsrv_errors(), true));
    }

    $sql_query = 'SELECT * FROM Problemss';
    $result = $connection->query($sql_query);
    ?>

    <table border="1" width="100%">
        <tr>
            <th>تم</th>
            <th>الحلول</th>
            <th>المشكلة</th>
            <th>م</th>
            <th>الرقم</th>
        </tr>


        <?php while ($row = mysql_fetch_assoc($result)) { ?>
        <tr>
            <td><?php echo $row['تم']?></td>
            <td><?php echo $row['الحلول']?></td>
            <td><?php echo $row['المشكلة']?></td>
            <td><?php echo $row['م']?></td>
            <td><?php echo $row['الرقم']?></td>
        </tr>
        <?php
        }
        $connection = null; // close the connection
        ?>
    </table>

El Sayed El Tohamy · 12 يناير

جرب هذه الأكواد

<?php
    $server = 'DESKTOP-PJDLJNR';
    $database = 'Legacy';
    $username = '';
    $password = '';

    try {
        $connection = new PDO("sqlsrv:Server=$server;Database=$database", $username, $password);
        $connection->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);
    } catch (PDOException $e) {
        die("Connection failed: " . $e->getMessage());
    }

    $sql_query = 'SELECT * FROM Problemss';
    try {
        $result = $connection->query($sql_query);
    } catch (PDOException $e) {
        die("Query failed: " . $e->getMessage());
    }
?>

<table border="1" width="100%">
    <tr>
        <th>تم</th>
        <th>الحلول</th>
        <th>المشكلة</th>
        <th>م</th>
        <th>الرقم</th>
    </tr>

    <?php while ($row = $result->fetch(PDO::FETCH_ASSOC)) { ?>
    <tr>
        <td><?php echo htmlspecialchars($row['تم'])?></td>
        <td><?php echo htmlspecialchars($row['الحلول'])?></td>
        <td><?php echo htmlspecialchars($row['المشكلة'])?></td>
        <td><?php echo htmlspecialchars($row['م'])?></td>
        <td><?php echo htmlspecialchars($row['الرقم'])?></td>
    </tr>
    <?php
    }
    $connection = null; // close the connection
    ?>
</table>

لاحظ التالي:

1- تم استبدال mysql_fetch_assoc بالوظيفة fetch لأنها الأحدث

2- لاحظ استخدام try - catch لاصطياد أي أخطاء تنتج بسبب فشل الاتصال او فشل استخراج البيانات.

3- استخدام htmlspecialchars لمنع الهجوم على الموقع باستخدام سكريبت التنقل بين المواقع XSS

كمال صالح2 · 12 يناير

بتاريخ 10 دقائق مضت قال El Sayed El Tohamy:

جرب هذه الأكواد

<?php
    $server = 'DESKTOP-PJDLJNR';
    $database = 'Legacy';
    $username = '';
    $password = '';

    try {
        $connection = new PDO("sqlsrv:Server=$server;Database=$database", $username, $password);
        $connection->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);
    } catch (PDOException $e) {
        die("Connection failed: " . $e->getMessage());
    }

    $sql_query = 'SELECT * FROM Problemss';
    try {
        $result = $connection->query($sql_query);
    } catch (PDOException $e) {
        die("Query failed: " . $e->getMessage());
    }
?>

<table border="1" width="100%">
    <tr>
        <th>تم</th>
        <th>الحلول</th>
        <th>المشكلة</th>
        <th>م</th>
        <th>الرقم</th>
    </tr>

    <?php while ($row = $result->fetch(PDO::FETCH_ASSOC)) { ?>
    <tr>
        <td><?php echo htmlspecialchars($row['تم'])?></td>
        <td><?php echo htmlspecialchars($row['الحلول'])?></td>
        <td><?php echo htmlspecialchars($row['المشكلة'])?></td>
        <td><?php echo htmlspecialchars($row['م'])?></td>
        <td><?php echo htmlspecialchars($row['الرقم'])?></td>
    </tr>
    <?php
    }
    $connection = null; // close the connection
    ?>
</table>

لاحظ التالي:

1- تم استبدال mysql_fetch_assoc بالوظيفة fetch لأنها الأحدث

2- لاحظ استخدام try - catch لاصطياد أي أخطاء تنتج بسبب فشل الاتصال او فشل استخراج البيانات.

3- استخدام htmlspecialchars لمنع الهجوم على الموقع باستخدام سكريبت التنقل بين المواقع XSS

مازال يظهر خطاء استاذي

El Sayed El Tohamy · 12 يناير

أرجو عرض رسالة الخطأ وفي أي سطر تظهر.

كمال صالح2 · 12 يناير

بتاريخ 2 دقائق مضت قال El Sayed El Tohamy:

أرجو عرض رسالة الخطأ وفي أي سطر تظهر.

بتاريخ الآن قال كمال صالح محمد:

home.html

El Sayed El Tohamy · 12 يناير

هل كتبت هذا السطر بشكل صحيح؟

 <?php while ($row = $result->fetch(PDO::FETCH_ASSOC)) { ?>

كمال صالح2 · 12 يناير

بتاريخ 5 دقائق مضت قال El Sayed El Tohamy:
هل كتبت هذا السطر بشكل صحيح؟
 <?php while ($row = $result->fetch(PDO::FETCH_ASSOC)) { ?>

اكيد استاذ

El Sayed El Tohamy · 12 يناير

من خلال مراجعة الملف الذي أرفقته يلاحظ أن بعض الأسطر تم تهميشها

هذا الكود مهمش
<!--?php
    $server = 'DESKTOP-PJDLJNR';
    $database = 'Legacy';
    $username = '';
    $password = '';

    try {
    $connection = new PDO("sqlsrv:Server=$server;Database=$database", $username, $password);
    $connection--->

هذا الكود غير مهمش
<?php
    $server = 'DESKTOP-PJDLJNR';
    $database = 'Legacy';
    $username = '';
    $password = '';

    try {
    $connection = new PDO("sqlsrv:Server=$server;Database=$database", $username, $password);
    $connection?>

لاحظ الفرق بين المكتوب بالأعلى وبين الجزء بالأسفل بعد إزالة التهميش منه.

كمال صالح2 · 12 يناير

بتاريخ 4 دقائق مضت قال El Sayed El Tohamy:

من خلال مراجعة الملف الذي أرفقته يلاحظ أن بعض الأسطر تم تهميشها

هذا الكود مهمش
<!--?php
    $server = 'DESKTOP-PJDLJNR';
    $database = 'Legacy';
    $username = '';
    $password = '';

    try {
    $connection = new PDO("sqlsrv:Server=$server;Database=$database", $username, $password);
    $connection--->

هذا الكود غير مهمش
<?php
    $server = 'DESKTOP-PJDLJNR';
    $database = 'Legacy';
    $username = '';
    $password = '';

    try {
    $connection = new PDO("sqlsrv:Server=$server;Database=$database", $username, $password);
    $connection?>