قم بتحديث محتوى الصفحة ديناميكيًا باستخدام تقنية الدفع

1. ما هو المحتوى الديناميكي؟
تجني معظم مواقع الويب الشهيرة الأموال من الإعلانات عبر الإنترنت. المساحة الإعلانية على صفحات الويب محدودة. من أجل جعل الاستثمار الإعلاني جديرًا بالاهتمام، يجب على المعلنين ليس فقط تعبئة كمية كبيرة من المعلومات في مساحة إعلانية صغيرة، ولكن أيضًا التأكد من أن الإعلان يمكن أن يجذب انتباه المستخدمين. في معظم مواقع الويب الحالية، يتم إنشاء الشعارات الإعلانية الموضوعة على صفحات الويب بشكل عام بواسطة الخادم أثناء إنشاء الصفحة، ولا يمكننا إدراج إعلانات جديدة ديناميكيًا في الصفحات التي تم إرسالها. إذا كنت ترغب في عرض إعلانات جديدة، فالطريقة الوحيدة هي تحديث الصفحة. يمكننا تحديث الصفحة برمجيًا، على سبيل المثال:

استخدم وظيفة setTimeOut لكائن نافذة المتصفح لتحديث الصفحة بانتظام. ومع ذلك، عند تحديث الإعلانات بهذه الطريقة، سيشعر المستخدمون بوضوح بعملية تحديث الصفحة، ومن الصعب أيضًا تحديد تردد التحديث المناسب.
اضبط وقت انتهاء صلاحية الصفحة على بضع ثوانٍ حتى يقوم المتصفح بإعادة تنزيل الصفحة عندما ينتقل تركيز الإدخال إلى الصفحة (أي يتم تنشيط المتصفح).
وقد تبنت بعض مواقع الويب الكبيرة، مثل yahoo.com وmsn.com، هذه التقنيات بالفعل. كلتا الطريقتين لها مزاياها وعيوبها. عند استخدام Java فقط، يمكننا تنفيذ نظام تحديث إعلانات البانر بالكامل من خلال برمجة الشبكة وبعض أعمال برمجة الواجهة، ولكن يجب حل مشكلات وقت التنزيل الطويل وتأخير التحديث.

2. استخدم Java لتنفيذ دفع المحتوى
من خلال الجمع بين اتصال JavaScript بين الإطارات وبرنامج Java الصغير الذي يدير اتصالات الشبكة، يمكننا حل هذه المشكلة باستخدام تقنية الدفع. في مثل هذا النظام، تتمثل مهمة Java Applet في الاتصال بالخادم والاستماع إلى تحديثات المحتوى. بمجرد تلقي المحتوى الجديد، يقوم التطبيق الصغير بإنشاء كود HTML الذي يعرض المحتوى الجديد، ويستدعي وظيفة JavaScript ويمرر HTML الذي يحتوي على المحتوى الجديد إلى وظيفة JavaScript. تستخدم وظيفة JavaScript تقنية DHTML وDOM لاستبدال محتوى علامة <div> في الصفحة بالمحتوى الجديد الذي تم تمريره في المعلمة. نظرًا للقيود الأمنية للمتصفح، لا يمكن توصيل منفذ المقبس الذي يفتحه التطبيق الصغير إلا بالخادم الذي قام بتنزيل التطبيق الصغير.

يستمع خادم الويب فقط لطلبات الاتصال على المنفذ 80. لذلك، بالإضافة إلى خادم الويب، نحتاج أيضًا إلى خدمة تطبيقات الشبكة التي تقبل طلب اتصال مأخذ توصيل التطبيق الصغير. تستعلم خدمة تطبيقات الشبكة هذه بشكل دوري عن قاعدة البيانات وتنشر (تدفع) البيانات التي تم تغييرها إلى كافة التطبيقات الصغيرة المتصلة. بفضل استخدام الإطارات المخفية وإمكانيات الاتصال بين الإطارات في JavaScript، أصبحنا قادرين على إخفاء معظم منطق JavaScript عن المستخدم.

أصعب مهمة في هذه العملية برمتها هي الاتصال بين تطبيق Java الصغير وكود JavaScript. يوفر Netscape فئة تسمى netscape.javascript.JSObject. لاستخدام هذا الكائن، قم بإضافة علامة برنامج صغير يحتوي على سمة "MAYSCRIPT" الخاصة:

<APPLET code="MyApplet.class" height=1 width=1 MAYSCRIPT>

تسمح أساليب JSObject للتطبيقات الصغيرة بالتفاعل مع كائن المستند واستدعاء أوامر JavaScript. على سبيل المثال، من خلال وضع التعليمات البرمجية التالية في التطبيق الصغير، يمكننا الوصول إلى كائن النافذة:

import netscape.javascript.*; public class MyApplet Extends java.applet.Applet{ Private JSObject mainwin; public void init(){ mainwin = JSObject.getWindow ( this); } }

بعد الحصول على مرجع JSObject، يمكننا الوصول إلى كائن نافذة المستند واستدعاء وظيفة JavaScript من خلال طريقة eval() الخاصة بـ JSObject.

3. قم بتحديث الصفحة باستخدام DHTML
عند كتابة محتوى جديد من التطبيق الصغير في المستند، حتى لا يؤثر على المحتوى الموجود، يمكننا استخدام علامة HTML <div></div>. هذه العلامة مختلفة في IE وNetscape.

بالنسبة لـ IE وNetscape 6، علامة HTML هذه هي:

// يجب تحديد كل المحتوى المراد تحديثه بواسطة المعرف <div id="iexplorer" width=700px </div>

بالنسبة لإصدارات Netscape 4.x، فإن علامة HTML هذه هي:

<DATA><layer id="netscapev" </layer></DATA>

على الرغم من أنه يمكننا تحديث محتوى HTML مباشرة من التطبيق الصغير عن طريق الإشارة إلى المعرف المناسب، من أجل الوضوح من أجل التبسيط، سنضع منطق البرنامج الخاص بتحديث كود HTML في وظيفة JavaScript. يحفظ كود JavaScript التالي نوع المتصفح في المتغير ie:

applnname=navigator.appName; if(applnname=="Microsoft Internet Explorer") { ie=true } else { ie=false }

يقوم التطبيق الصغير بإنشاء HTML من الجديد رمز البيانات، واحفظه في محتوى متغير JavaScript، ثم قم باستدعاء طريقة signData(). يمكن أن تكون بيانات المحتوى أي شيء بدءًا من HTML العادي إلى XML وحتى البيانات الثنائية.

// استدعاء الطريقة المناسبة function signData() { if(ie) {explore();} else {navig() } } وفقًا لنوع المتصفح

إذا كان المتصفح IE أو Netscape 6، فإن التطبيق الصغير يستدعي طريقة الاستكشاف ():

// المحتوى هو متغير جافا سكريبت الذي يصف البيانات الجديدة التي يجب عرضها // بتنسيق HTML function explore() { iexplorer.innerHTML=content }

إذا كان المتصفح Netscape 4.0 أو أعلى، وقام التطبيق باستدعاء طريقة navig():

function navig() { document.netscapev.document.write("<DATA>" + content + "</DATA>"); document.netscapev.document.Close(); }

4. عملية الاتصال
على جانب الخادم، يستجيب مثيل فئة ImageApliation.java لطلبات اتصال المقبس ويقوم بإنشاء مؤشر ترابط جديد لكل طلب اتصال جديد. لتبسيط التعليمات البرمجية، يتحقق كل مؤشر ترابط فقط مما إذا كان ملف البيانات قد تغير. إذا تغير ملف البيانات، يقرأ الخيط محتويات الملف ويرسل البيانات الجديدة إلى التطبيق الصغير المتصل (يرسل التطبيق النموذجي الملف بأكمله إلى التطبيق الصغير).

على جانب العميل، يحتوي الإطار المخفي على Applet ImageApplet.java، لذا لا يمكن رؤية علامة Applet باستخدام وظيفة عرض كود مصدر HTML للمتصفح. ينفذ التطبيق الصغير وظيفة الاتصال بالخادم (الخادم المصدر لتنزيل التطبيق الصغير) ويطبق بروتوكول اتصال بسيط. بعد إنشاء اتصال بالخادم، يتلقى التطبيق الصغير البيانات من الخادم، وينشئ كود HTML، ويستدعي وظيفة JavaScript لتمرير البيانات إلى المستند:

public void upDateHTML(String str){ // البيانات هي اسم النموذج، //quote هو متغير JavaScript //str هو كود HTML الذي تم إنشاؤه حديثًا mainwin.eval("document.data.quote.value="" + str + """); ()"); return; }

يكمل netscape.javascript.JSObject الاتصال من التطبيق الصغير إلى JavaScript. تتطلب الإصدارات المختلفة من متصفحات العملاء إصدارات مختلفة. يمكنك تنزيل ملف الفئة المضغوط java40.jar المتوفر لـ Netscape. يأتي IE بالفعل مع فئة JSObject، ولكن من الصعب العثور عليه. يمكنك البحث في الدليل $windows$JavaPackages للعثور على ملف ZIP الذي يحتوي على فئة JSObject.

يقوم الخادم بإجراء تسلسل لمثيل فئة ImageArrayElement.java في سلسلة من خلال أسلوب toString() ويرسله إلى التطبيق الصغير. يقوم الخادم بإنشاء كل كائن من ملف البيانات، ويستدعي الأسلوب toString()، ويسلسل السلاسل التي تمثل جميع الكائنات، ويرسل أخيرًا السلسلة الناتجة. في الطرف الآخر، يتلقى التطبيق الصغير هذه السلسلة ويوزعها ويعيد بناء كل كائن ImageArrayElement. السبب وراء إرسال البيانات هنا في شكل سلسلة طويلة هو أن هذه الطريقة لا تتطلب سوى عملية معالجة بسيطة للغاية، مما يسمح للمستخدمين بالتعرف على الفور على تغييرات البيانات بسرعة قريبة من الوقت الفعلي، ومع ذلك، يمكننا أيضًا استخدام طريقة أخرى طريقة الطريقة، التي ترسل الكائن كمتجه.

في التطبيق المباشر، يجب عليك عمومًا جعل عملية إدراج البيانات الجديدة في الصفحة الحالية شفافة. ولكن في نموذج التطبيق، من أجل جعل عملية تشغيل البرنامج أكثر سهولة، فإنه سيطالب المستخدم عند وصول محتوى جديد.

الميزة الرئيسية لتقنية الدفع هي أن خادم التطبيقات يرسل فقط البيانات المتغيرة إلى الشبكة، وبالتالي تقليل زمن الوصول. نظرًا لأن هذا التطبيق الصغير مسؤول عن القليل جدًا من العمل (لا يتضمن واجهة المستخدم، ويتم الاعتناء بهذا الجزء من العمل بواسطة المتصفح)، فإن التطبيق الصغير صغير الحجم ويتم تحميله بسرعة كبيرة.

5. كيفية تشغيل مثال هذه المقالة
لاختبار نموذج التطبيق الوارد في هذه المقالة، يجب أن يكون لديك خادم ويب وJDK 1.7 أو إصدار أحدث مثبتًا على جهازك.

نقاط التثبيت:

قم بفك ضغط الملف المضغوط ZIP وتثبيته على الدليل الجذر الافتراضي لخادم الويب.
بالنسبة لملقمات IIS، الدليل الجذر الافتراضي هو Inetputwwwroot
بالنسبة للخادم المجاني المتضمن مع jsdk2.1، الدليل الافتراضي هو <دليل التثبيت>webpages
بعد فك ضغط الأرشيف، سيتم تثبيت كافة الملفات في الدليل <Web server root>/exp/.
أضف أسطر التعليمات البرمجية التالية إلى الصفحة الافتراضية. يحتوي كل خادم على صفحته الافتراضية الخاصة. الصفحة الافتراضية لـ IIS هي "default.htm". الرجاء الرجوع إلى وثائق خادم الويب للحصول على إرشادات محددة:

<ul><li> <a href="/exp/ImageMain.htm"> لافتة إعلانية ديناميكية تعتمد على Java</a></li> </ul>

خطوات تشغيل التطبيق:

افتح نافذة DOS، وأدخل <دليل الويب الافتراضي>/exp، وقم بتنفيذ "java ImageApplication". سيعرض النظام الرسالة "بدأ الخادم في الاستماع على المنفذ 6011". تأكد من أن متغير بيئة classpath يشير إلى دليل العمل الحالي.
ابدأ تشغيل خادم الويب.
افتح المتصفح وأدخل عنوان URL التالي: http://localhost:8080 . سيفتح عنوان URL هذا الصفحة الافتراضية لخادم الويب، والتي يجب أن تحتوي على رابط "إعلان بانر ديناميكي يعتمد على Java". انقر فوق هذا الارتباط لبدء تشغيل التطبيق النموذجي لهذه المقالة.
افتح الملف "/exp/images.txt" باستخدام برنامج "المفكرة"، وانسخ سطرًا من المحتوى والصقه، ثم احفظ الملف. يمكنك أن ترى على الفور أن النظام يعرض نافذة JavaScript تطالبك بتحديثات المحتوى. أغلق نافذة JavaScript وستعرض الصفحة محتوى جديدًا.
برجاء تنزيل الكود الكامل للمثال الموجود في هذه المقالة من هنا، 411 كيلو بايت/u/info_img/2009-06/20/pushweb.zip