11. تطبيق الويب MVC [personne] – الإصدار 6

11.1. مقدمة

في هذا الإصدار، قمنا بإجراء التعديل التالي:

لم تستخدم الإصدارة السابقة الجلسة (session) لتخزين العناصر بين تبادلين بين العميل والخادم. بل استخدمت تقنية ملفات تعريف الارتباط (cookies)، والتي تعمل على إرسال العناصر المراد تخزينها من الخادم إلى العميل حتى يعيدها إليه عند التبادل التالي. في هذه الإصدارة الجديدة، نستخدم تقنية مشابهة، وهي تقنية الحقول المخفية في النماذج. هناك اختلافات بين هاتين التقنيتين:

ملفات تعريف الارتباط	الحقول المخفية
- يضع الخادم العناصر المراد حفظها في التدفق HTTP الذي يسبق المستند HTML.	- يضع الخادم العناصر المراد حفظها في المستند HTML.
- تتطلب هذه التقنية أن يقبل المتصفح ملفات تعريف الارتباط حتى يعيد إرسالها إلى الخادم عند إرسال طلبات GET أو POST.	- تتطلب هذه التقنية أن تكون جميع طلبات العميل إلى الخادم من نوع POST حتى يتم إرسال الحقول المخفية إلى الخادم.
- يمكن للمستخدم الوصول إلى العناصر المخزنة من خلال عرض ملفات تعريف الارتباط التي يتلقاها متصفحه. توفر معظم المتصفحات هذه الخيار.	- يمكن للمستخدم الوصول إلى العناصر المخزنة من خلال عرض الكود المصدري للوثيقة HTML المستلمة.

يمكن استخدام تقنية الحقول المخفية هنا لأن جميع استدعاءات العميل هي من النوع POST.

11.2. مشروع Eclipse

لإنشاء مشروع Eclipse [mvc-personne-06] لتطبيق الويب [/personne6]، سنقوم بنسخ مشروع [mvc-personne-05] باتباع الإجراء الموضح في الفقرة 6.2.

11.3. تكوين تطبيق الويب [personne6]

الملف web.xml لتطبيق /personne6 هو التالي:


<?xml version="1.0" encoding="UTF-8"?>
<web-app id="WebApp_ID" version="2.4"
    xmlns="http://java.sun.com/xml/ns/j2ee"
    xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
    xsi:schemaLocation="http://java.sun.com/xml/ns/j2ee http://java.sun.com/xml/ns/j2ee/web-app_2_4.xsd">
    <display-name>mvc-personne-06</display-name>
...

هذا الملف مطابق لملف الإصدار السابق باستثناء بعض التفاصيل:

السطر 6: تغير اسم عرض تطبيق الويب إلى [mvc-personne-06]

الصفحة الرئيسية [index.jsp] مطابقة لتلك الخاصة بالتطبيق [/personne5]:


<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%>
<%@ taglib uri="/WEB-INF/c.tld" prefix="c" %>

<c:redirect url="/do/formulaire"/>

11.4. رمز طرق العرض

تتغير فقط طرق العرض [réponse, erreurs]. تحتوي الآن على حقول مخفية في نماذجها الخاصة، بينما في الإصدار السابق، لم تكن هذه النماذج ترسل أي معلمات.

[réponse.jsp]:


...
<html>
...
  <body>
...
    <form name="frmPersonne" action="retourFormulaire" method="post">
      <input type="hidden" name="nom" value="${nom}">
      <input type="hidden" name="age" value="${age}">      
    </form>
    <a href="javascript:document.frmPersonne.submit();">
      ${lienRetourFormulaire}
    </a>
  </body>
</html>

الأسطر 6-9: النموذج الذي سيتم إرساله إلى الخادم عند النقر على الرابط في الأسطر 10-12
السطر 6: سيكون هدف POST هو [/do/retourFormulaire]
السطور 7-8: سيتم إرسال الحقول المخفية [nom] و [age]. سيتم تحديد قيمهما ${nom} و ${age} بواسطة وحدة التحكم التي ستعرض [réponse.jsp]. وستكون هذه هي القيم التي تم إدخالها في النموذج.

[erreurs.jsp]:


...
<html>
...
  <body>
...
    <form name="frmPersonne" action="retourFormulaire" method="post">
      <input type="hidden" name="nom" value="${nom}">
      <input type="hidden" name="age" value="${age}">      
    </form>
    <a href="javascript:document.frmPersonne.submit();">
      ${lienRetourFormulaire}
    </a>
  </body>
</html>

التعديلات والتفسيرات هي نفسها كما في العرض [réponse.jsp]. تجدر الإشارة إلى أن نموذج العرض [erreurs] قد تم إثرائه بعنصرين جديدين [nom, age] اللذين تمت إضافتهما إلى العنصرين الآخرين الموجودين بالفعل: [erreurs, lienRetourFormulaire].

يُطلب من القارئ اختبار هذه العروض الجديدة وفقًا للمبدأ الذي تم تناوله في الإصدارات السابقة.

11.5. وحدة التحكم [ServletPersonne]

وحدة التحكم [ServletPersonne] لتطبيق الويب [/personne6] تشبه إلى حد كبير تلك الموجودة في الإصدار السابق. وتأتي التغييرات نتيجة لتغيير نموذج العرض [erreurs]. يجب إضافة عنصرين إضافيين: [nom, age]. لا يتعلق الأمر إلا بالطرق التي تعرض هذه العرض. وهي الطرق [doGet] و [doValidationFormulaire].

11.5.1. الطريقة [doGet]

رمز [doGet] هو التالي:

    // GET
    @SuppressWarnings("unchecked")
    public void doGet(HttpServletRequest request, HttpServletResponse response)
            throws IOException, ServletException {

        // التحقق من سير عملية تهيئة السيرفلت
        if (erreursInitialisation.size() != 0) {
            // ننتقل إلى صفحة الأخطاء
            request.setAttribute("erreurs", erreursInitialisation);
            getServletContext().getRequestDispatcher(urlErreurs).forward(
                    request, response);
            // النهاية
            return;
        }
...
    }

في الواقع، يبقى هذا الرمز كما هو. في الإصدار السابق، لم يتم وضع عناصر [nom, age] في قالب العرض [erreurs]. إذا استمرينا في عدم إدراجها، فسيتم استبدال المتغيرات ${nom} و ${age} في [erreurs.jsp] بسلسلة فارغة. وهذا يناسبنا، لأن الرابط [Retour au formulaire] لا يظهر للمستخدم في هذه الحالة بالذات. في الواقع، نحن لا نضع العنصر [lienRetourFormulaire] في النموذج أيضًا. سيتم استبدال المتغير ${lienRetourFormulaire} الخاص بـ [erreurs.jsp] بسلسلة فارغة. وبالتالي لن يكون هناك رابط، وبالتالي لن تكون هناك إمكانية لإرسال الحقول المخفية [nom, age] من نموذج [erreurs.jsp]. وبالتالي يمكن أن تكون قيمة هذه الحقول سلسلة فارغة.

11.5.2. الطريقة [doValidationFormulaire]

رمزها هو التالي:

    // التحقق من صحة النموذج
    void doValidationFormulaire(HttpServletRequest request,
            HttpServletResponse response) throws ServletException, IOException{
        // استرداد المعلمات
        String nom = request.getParameter("txtNom");
        String age = request.getParameter("txtAge");
        // إعداد نموذج العروض [réponse, erreurs]
        request.setAttribute("nom",nom);
        request.setAttribute("age",age);        
        request.setAttribute("lienRetourFormulaire", (String)params.get("lienRetourFormulaire"));
        // التحقق من المعلمات
...

في الأسطر 8-10، نضع العناصر [nom, age, lienRetourFormulaire] في النموذج. نعلم أن الطريقة تعرض إحدى طرق العرض [réponse] أو [erreurs]. وبالتالي، ستحتوي الأخيرة على عناصر [nom,age] في نموذجها.

11.6. الاختبارات

قم بتشغيل أو إعادة تشغيل Tomcat بعد دمج مشروع Eclipse [personne-mvc-06] فيه، ثم اطلب عنوان URL [http://localhost:8080/personne6].