Weitere ähnliche Inhalte Ähnlich wie تقنيات الويب 2.0 وتوظيف تطبيقاتها في مؤسسات المعلومات (20) Mehr von Dr. Ahmed Farag (16) تقنيات الويب 2.0 وتوظيف تطبيقاتها في مؤسسات المعلومات1. 1
أعلم مجلة–ع7شوال1341–اكتوبر0212
تقنياتالويب0.2وتوظيفالمعلومات مؤسسات في تطبيقاتها
د.أحمد فرج أحمد
المستخلص
اب ااا اااياه ااايال ااارااع ين اباااه الي ااااالع اويبااة شب ااامت"ااااالع0.2"ااا ين ش ااا ش دا ااا قوا ال ا اتااخلا اء
اباعع ف الا األ ل الا ا األ ،اخلا اعا او داشا اإعع اة و ريا ا اع ين ابا ق ال ا تا ا اهيعع ا ا ؤس.احتاهاباساشالت
اايال اارااع ين اااالع اويبال ابا يع اه ا اااا ال اباجل يابااا ااه ه ارا امالاAjaxاباااMashupاباااRIA "Rich
Internet Application"اهي ا ؤس ين هت قوا ه ،ا عع.اف ي ال اسبشالت اا ااا ال اهل ساب األس هام هف
ين ال ء الوا اهلايلهلويب اه ل الي ا آلا،اباعع ف ا ا قوا ام اط ء اا ين تن ا املا اب الا ا ا قوا ال ا هه اريمي
ا اتا ا اال اس ين ا اا اهيعع ا اا ؤس اارلا ات ااب ثت ااااا ي اإاعع الا ياباا اهيعع ملبش االاه اتهاواباا ق ال ابائالوا ين.
ض ياسبشالتععب جمااالع ا ااا اليلف اب بو املا ا اهيعع ا ؤس ذج من ر شا خم0.2ات اي ب اس مل اهت اع اع
لب في ناب اليرت ا ت تمي قعا ين ععاأ.
مي املا ا اال ا ا ال اس ابساشالت اه ين ايفث الو احيارعفاف اريا ا اهيعع ا ا ؤس ان ا ارالتعماه الي ااقو
اا ي اعشاق ا ا يعع ا ات اتمي اتد ا ااا الاملب الالارا فاتار ا اه ات ابا اليع اناعاجل نتا ا الصاع ال.ار
ىل ثيف الو عة هالاب ال اب ئا ال ش او ىل اسبشالت ام:
الأوةةةمالمقد:ااا، اارث ق امالا ائعباساأل ااش اا ف اةس اا ه ، ااد ابا يع اه اتااهاأل ، اار ا ه اباساشالت اععاعع ىل ل اتا
ب ال ا اسشالت ه وا ء ر ان اهعععع جلب ي ين ويب اه اهارجاب اض ي س ًاش.
ااثانيةررالن ةاطاإلةةسا للد:اابس األس هام افاه ر اض اا ها اااالااع0.2،اهت قوااهش و عااب ئا ال ابجل اهي اعشحم
اسبشالت هلالم ععاب ف ال العا ا قوا ء ا حنع اةنقالق قب نه مييرت يين ا ا اهيعع ا ا ؤس ععاراهاع حم اعاق
ناب اةليرت هت ت.
ااثالثاسة للد التطبيقية النماذج:م ا فارمن أل اض ي اسالعا ا اا ا قوا ذج0.2ا اهيعع ا ؤس ينعاة قت
ثيف الوض يشا خم ذج منالعا ا اا ل ب اهقو ا اهيعع ا ؤس ا اع ر0.2ل ب س ملاب اهيعع هت ت تمي.
ابعا:الخاتمةوالمقترحات
ثاب اهف ا اليع
العا0.2–ا اهيعع ا ؤس–اة ا اعنرتنب–ِAjax–Mashup-RIA
1.المقدمة
متيلا ااالعا ةويبهاب اليثتا الي ااعر ينا هاريط ال ااالع ايش ا ارتهة املا اب اهل ااشاعق ال
،املا
ااياإاععاء ااا اا قوا الا اتاخلااباان اةليرت ابائالوا ين اا اهيعع ايفاثالو لا ااسه اعااق ابااعع ف الإل ،فب ااعابائا ااهنملعىل
سوب احنع ثع لعقوافرعناةنرتنب ا اعععاب ف الا اهيعع ا ؤس عف خم ين.
ا اهيعع س احل عععن ملعاب ا اهيعع ا اسشد م ق ر يل اسشت هائب عضع-ن اإل يب ا-ا اهيعع ا و اهي م ق ،يعداب ال-هساعط يب ا–ط.ميير ا اهيعع ر ات ه
ثيف لعو طي الل اهعقع ععإ اإلبالعhttp://ahmed.farag.free.fr
2. 2
ملاسبشالت هععإعر ن العي ببب التاع ا اا اللععا0.2اال ار انلذ ،ا ا اهيعع ا ا ؤس ين هت قوا ه
ايفا اتميا ين اتا ي اا ا ذج اا لا ض ااعامالا ،ا اااا ال ااه اإاعع ااهاع حم-اناة اتا-شب اامتاء اا اعااق ين ااة و ش د
ثب اه ا اخلت،الويف ا ن ي دعمئي اةناي ق ال عا ث لعاباعع ف ا ات ا ا قوا ء اا ،اعفريال ي اتااات ط امنه
ا ملبش الاه اتهو اإعع ًاد ا ع ا ا اهيعع دش اطه احلا اعصالع اا ي ععإاباالوثي اباع اةا ا اويلال اال ار ت ت ا اه ت
ايفاااثش د اعشااقاريااوملاتااث ىل تن ااا اهاباا بي اوثااطلااهاااااهرعن ااالاعااا ث عىل ا ااا اهؤس ا اااا ملاعاافد ل ااالا ااا األ ،
ا اا ال ه ش ي اس.
1/1.ال أهميةاسة د
ااظحتإاايال اارااع ين اااالع ا اا قوااهر االا ااا ق يناا ه،ا اا اهيعع ا اا ؤس ا اا اع اعاقاع اان ا ارا ارياوملن
اااجئ ن اراا اااملل ااالا ااا األأا اااة اهواععاااذاتااااات ا ااا قواابااقةر اتعاال ًا اااظن فاتار ااا اه ا اااي جم ااان ا اراا اريااومل اعااوق
اه ا ااا ال ار ابعع جم اإعع دا ا اسا ا ا قوا ال اه اباا قت ،ت ت اه نب ي تعام عاب اةا ا لعلوياتشطاه ابثع ف
ا قوا ء ا ين األ ش الت هل ملالما تععاب فالعا ائب يناه ا ه ابجل ي ين ابساشالت اه ابا ه ا ها ر ،
ىل فب اعإل ل الي ين ب ت اه لاب ا ين ال ئي الوا دايعر د اف ي ال ال ر ا اا الاض ي اساقوا ال ذج ا الا ا هابا
هلال رالعا ا اا ل ب اهقو ا اهيعع ا ؤس أل ث0.2ثعال ل ذج الا ه ض علين اهري اإعع اي ع
ح اه عا او ا اخلت قعا.
1/0.اسة الد أهدافوتساؤلتها
اسبشالت ه رتش د حتعال ىل ب ع طعشاالعا ا اا0.2ا قوا ء ا يناهلال ار اريمي ععاب فابسش مم
اي ين اب اهقو ا ااا ال اه ار ذج امن ض اع ، ارا فاتار اه ع جم ا ين ثب اه ا اهيعع ا ت اء ين في ش د
،ا اهيعع ا ؤسار قوا اإعع ابواهرت ااري ا ال ا ه ااا الي ا ا اهيعع ا ا هؤس اعفدا اتة اب بي اعي لا اة اعحن ب
ناب اةليرت هت ت ش ب ين اعتاعال ا اا ال ه يل قوا ىل.
لاب ال ااش ف اةس ععب جم ععإ ب اإلا ا ل اس ال ر اسبشالت هل ب الي األهتا ا حت ناب ي ثيف الو ا ا:
؟ الي ااعر ين العا للويب ب التاع ا اا ال ه هي
ه هيالعا ا اا ىل اتا اه ا قوا ال هم0.2؟
عفاف ميير ملافا ااالعا0.2دعم ينا اهيعع ا ؤس؟
ه هيالذج االعا ا اا ع شه ي اس ا اهيعع ا هؤس ميير الم0.2؟
العا ا اا قوا ري هع0.2ا؟ اهيعع ا ؤس ا ت ععإ
ف ا هيالعا ا اا ل عقيب اه وعاب اه ق0.2هت قوا؟
1/4.اسة الد منهجية
بوايب عب فععععثعاعي ال العصفي اهار تان اس اسبشالتااالع ا ااا بوايب ععإ ي لع0.2ء ااالو الياهلا
ؤس ين ابااعع ف ال اااالع ا اا قوا ء ااا ين ااهش د اارع ع ابااآل ااد ااعي اه اينا الا اا اهيعع ا اا.ايفاث الو عااة اا ملاثا ىل
ا ا ااا هدإلافاع ب اباساشالت اععاعع اعاث ل اايالف جاا نهل اياةأ،ذج اامن ض ااع ء اا انا اا اع اعاقاع اراا اا اهيعع ا اا ؤس
ين العا ايش تهن ع9191،ال رارينري اام اعع(Tim Berners-Lee)ين ايفث الو(CERN- European Laboratory for Particle Physics)هام افاه
ابااه الي اااالع اويباة اارععا ابا ق امالا ااباس األس.ن ااظن ام ااط احرتق اا ا اايالف اتهاا ذا اا يععل ث اا اثيت ااوعين ملبش االاهاا ا ش اعفريا ااا ب اراع ،اعااط ال عب اا ل اارلا الاصع ال م ااا امالا ئ اا الا
(links)الماثُناب يىل العصعدش اهطهاب الي العا ةويب ععار ب ق الم ااعالا احرتاةق ذلن لَّيَة ،اإلنرتنب ععإ اهعاعدا.
3. 3
ااااالع ا اااااا ل اباا التاع0.2،اباااااألااو اتاالا ارااا اتدااع ين اباااث اههت ب اااالن اماااعد ين ااايف ش د ااااهل اعاايا ه ارااايمي اماالا ،
فاتار اااا اه اعااا جم اتااا الاااصاع ال ااااا ي ،اباااان اةليرت ابااائالوا ين هت اتااا.اؤدلااا اتاااق امااالائ اااا الا ارااا اباااعع جم ىل الاااصع ال ىل
ا رتث اهالعا ا اا عفاف ين عت ه ميير الم0.2ا اهيعع ا ؤس ا اع اقعع قعا ين.
اسبشالت ه ين ل الي اثل ب ان لدا اه مجع ل الفي ج اةن حبيف ين ىل األ ثعب اه يل ،ت سا هس ت ثع ىل
اسبشالت بعععع ب يع اه اب اليعاب اليع ا اسشالت لاأ صعب هثتث ععء ينحتتات ىل فب إلع ،اب قوا ال ذج الاين
ا اهيعع ا ؤسا ج دت ثعال ال ععإ ناب الي ثعب اه ا ملش ،هل احل لليل اسبشلت.
1/3.السابقة اسات الد
حاا اه ل اايالف جاا اإلن ا ااا هد اثا االا اراارا اتاااليت ىل الاصع ال متا ااساشالتش ااج الب اا الا ااتلع اباث اه
األااواب،ه ه ر الم:
9.اسبشدPaul Anderson(2007)اعيا:
"What is Web 2.0? Ideas, technologies and implications for education"
اباااساشالت ااااه اباااقغا ااااض ال ارااا اتاااااليتا اااا قوا ا اااااا اباااقو اه ا لا اياااةاإلاااااالع0.2ااااث ،ايفاااث الو
ااي اإاعع اعءاضال اعاا اباااهيا ا اااا ال ض ي ااساامالا ا اتااث ال ا ااض الااماعي ال ا اا ؤس ااي ين اار قوا اإاعع اباو
اه ين اليثتا اه عيب.اامعي ال اجم اأااع ااب ئاش ا اتاحت اب ال اعدا ىل ابساشالت رب اناثااالع ا ااا ااقو0.2،
امالا اتااااجلت ا ااي اي ابااع اةا ا اويالال ين ارياوالي اعشاق ال ين األ الايمتا اارفري اا اأال اا األ ا ااه ،اباادمي األمل ابائالوا ين
اويباة اإاعع ااباصاخلطع اإاعع ااة واباناةنرت.اتلاث ال ااعيااياليناأااعع حاا اه اعاا او د اا اع تن اا اه ابان ي اعشاقا ااه
لاب ةي حاق ه ير اه ر األاهطتاقابعا او ينابا الفي اباعي لع ب ي اه قلب اها ىل اب احل ين يل فا ري األ األ ه ،
ا اهؤس اد األف ن ا ر.
0.اسبشدGaelle CrennGeneviève Vidal(0229).اعيا:
"L’introduction des technologies web 2.0 dans les musées d’art moderne et contemporain :
vers de nouvelles relations entre l’institution muséale et ses publics?"
العا ا اا ري ىل اسبشالت ه عب ي0.2قق ينملات ىل رب ان قت ،ا ص اهي احلتايب الفاع ثف ع
الوثيف ين اتاتا لا هس ا ل اس ،يتدا اه ئ العس ععإ ت اهي عا او اء حنع ا اا ال ه شسأ مت ه ميير الم ش الت
اةععإ اإلبالع عسرتادش طاه وته ععإ اسبشالت هملتا مل، العا ائب ين ا اهيععاأل فاتار اه ع جم ت ملبش ل
ئج ن ر ملل الأا ة اهوا يت اليالقبا اع اقععثف اهار فاتار اه ع جم.
3.اسبشدCharles Crook(2008)اعيا ه:
"Web 2.0 technologies for learning: The current landscape: opportunities, challenges and
tensions "
ععإ اسبشالت ه ا ملشالعا ا اا0.2ه عف ه ميير الم ا نا ي اإل.ىل شا هةفرعشععب جمر
اخلا تب بي ي المقعادا اين ابش ا ااريتا ث ثت حنعهاب الي اللويب بوايب.حتتداسبشالتالم ب ا الق ين تاري ال
ا ع جم د ل ي اقلب ا ،ا اخلت ه ع فاتار هملافهل مييرا ياعلعاا اله اعتاعالين هما ل اسص ف
اب يعالع ض ي ال ع لب فيثتااد اع د حتع قت المهام فالعا0.2.
4.اسبشدDorine Kieft-Wondergem(0229)اعيا:
"How to use Web 2.0 technologies in your library instructions"
4. 4
ىل اسبشالت ه لريئص اخلطنا ي اإلاغرياودا تلععا0.2ار ااش ف اةس ر اليتات ،ملافاب
اهيع دا ف اةسإين ا اا ال هلا اهيعع ا ؤساأ ععإ القواب ا ع ق ال ين ططب اه ا و اهي ب ع طفب
اخلطعصال ا ملش قت ،تان اس ملافابععإ اسبشتقواNetvibesي الم ا و اهي ينر اثتاا قواالعا0.2
ععإ ت ي الموتهيف ل هت ت تمي ين طاص العا اوناب ي ىل فب إلع ،فات اه ا ا ا اث ا ةه ف
عا او ين ملبش اهل.
0.األساسية المفاهيم
افعاا اااافر اعاقاعاه ارا اتاقمن ابااه الي اويبالال ابائا ينابااعع ف ال اباااي التاا اعاقاعاهDynamic Sitesين امالا اياه
حمل حتل ه ىل سواعرين يل اه األ الاملابا ال ه اب الي اقععاه ععار اقع الم العا ر األ اجلال اقععStatic
Sites.اهفرعن ا ه ضث ا لييشقم اجلت الري(9)مللت اب اجلعه ق الف ىلار:
ات(9:)العا ت ساب األس ق الف9.2العا0.2
الساكنة الويب مواقعالديناميكية الويب وبوابات مواقع
ع ب افع ا صفث ر دا الي ين لفلتبHTML
العا ععإ ح دن ار ععإ نب خم.
واشتا اسع رصب عا او داشا ا جما
اهطتش عثب اهفيلJoomlaFusionايع ،
ا ن ا عتا ق ل دا خم عا او.
،دا حمت دن اخل ار ن ا ر م الم ا جل اهي ي
ا اهعف ه ا الطفث شس ب بر ف اقعع ثايف
اخل العا طفث ن ىل ععار اإلبالع اهقععص
تن ه.
آلاب يلل اليينل العا طفث شسبع دن ع
يالن اسالعا ةويب ععإ ا ن الوا ل ن ملعع ف
"HyperText Transfer Protocol"
HTTP.صاتب ف يالن اةس ثعال دن اخل عن ا
SQLيعار يت ،فاأ نب اه ا ن الوا عتا ق ىل
د يالن اةس ئ نتن اه ىل سعر ا ل ال دن اخل ىل
ملعع فHTTPال رنمل طفث اه
شقم لليل ععث هع(9.)
العقب ين يعفأ اليوريا صب اقععاه ه يل نب صا
ميير ذلن ع ليار ،فاب الي نب ه ب لا ههن مل
لف الم احلجم الطتريا اقعع لع سوب ا يع هر
عس اه ين ا صفث ا عل.
لب في نب اياب التاا اقععاه نب صا
5. 5
1.مستخدم يقوم
بإرسال رنتاالنت
استعالمhttpإلى
الخادمServer
4.رضبع الخادم يقوم
للمستخدم النتائج صفحة
رضمستع خالل من
الويب
2.الخادم يقوم
االستعالم بتحويل
صيغة وفقSQL
البيانات قاعدة إلى
فيه زنةالمخت
3.النتائج إرسال
الخادم إلى
شكل(1)الديناميكي الويب في العمل آلية
ااالع اعشط ل طوب ائب ايي التاا العا ا قوا يعب0.2،اتقاقعثطاه ا اه ارفين ا ا ألاعا اااامق
اتاابا ؤس ارا الامل“O'Reilly Media”ابا ؤس“MediaLive International”ين اء ااخلا ااث ايفااثا ااه
اةع االعصعىلاقعع ام الهل ر ميير حمتد اري يالعااقعع ىلعاتاب9.2اقععابااي داا0.2اعه ا مل،
شقم اجلت ين ععث(0)
ات(0)
:العا ت ساب األس ق الف9.2العا0.2
الويب1.2الويب0.2
DoubleClickGoogle AdSense
OfotoFlickr
AkamaiBitTorrent
mp3.comNapster
Britannica OnlineWikipedia
personal websitesblogging
eviteupcoming.org and EVDB
domain name speculationsearch engine optimization
page viewscost per click
screen scrapingweb services
publishingparticipation
content management systemsWikis
directories (taxonomy)tagging ("folksonomy")
stickinesssyndication
اا اياااالع0.2اباعثاباال انين ابا هايش اااإل ين الاي امالا اااالع اويباةارا اا ناعنارفاعاقاعاهابااعات ال،امالااتا اي
اإعع اهععععي اهع حماإعع اب ئ ال ابراجل اأثا اداشااعقاهع،ىلاعنرفالا ا قوااهاملا ابع ياعفا اتخلا ار ابعع جم
ععاب ف التن اه ا ين،ل الاااه اب بي اعيلا ش د اعشقارعن ا هاهع اعا ث لعاإعع اععيعال ا الأ ايةها مل،
شقم الليل ين وت هع(0)
.
اجلت طتش20.html-web-is-http://www.oreillynet.com/pub/a/oreilly/tim/news/2005/09/30/what
الليل طتش:difference-visual-the-20-web-vs-10-http://www.sizlopedia.com/2007/08/18/web
6. 6
شكل(0)مكانةالويب في المستخدم1.2والويب0.2
الاظ مييرىلWeb 2.0ههن ععإةويبا ا قواا اتاباع ااباعع فار ايهملد اجماعا او ات اي ،اعقاع ابعع جم
ساب هس طفب ح اهملترتاهل ععإ.اععثشقم اجلت(3)هت قوا ا اخلت ه ه.
ات(3)العا ا ت ا0.2
الخدمةبها المتعلق الوصف
Youtubeا قوا اطبين ملبش ل لعن ا ر ثب اه الفاتاع ا عفت ت اهملترتاهلب اخلت ين
Flickrااااعشاطال ين ملبش االاه تعمث اا ا ،اافث ار ااا ارياوملاماملاار(ارا اا ا اا3اا ف اعشااص ش اااع
هعسععباياواتا)ثب اه ،ا ينت ت اه.
BitTorrentنعن اد واها عفا ا اهيعع دش اطهل ايةه ال ا ا اإععاف.(p2p). Point to
point
MySpaceنفس ين ملترتاهل ء األعض اع ج ث عاب اا ةويبا اةهاهععععاب.
Del.icio.usاباا تاالاااضاهف ين ملبش ااالاه رت ااااباااع اإلاSocial Bookmarking،ث ااا
ل مل طتش ال ر العا ا صفث ين ملبش اهل داشا حبف ار فاتار لع.
ابا بي اا ي،اويباالال اإاعع االااضاهف ين ملبش ااالاه اأالال اراا ارايمي الا ي الااادلار ااضااا ا ش
العصف ،اهفضالا”عص اه“ثاب اهف التالب ا اليع ،ا اهالثظ ،.
Wikipediaش ااي ا اائدااباان ليرتم اايال اعاث اععتاق اه آة اتادهاع ين ااي اااهتة اتداع اتشا اااث
اعناع0222ععإ ات ا ب ن2.0عاعلبفار ا022عفب خم لتب.
Yoonoي حبيف حمالعا ا قوا ا ت ع افع0.2.
7. 7
Technoratiا ن اتا لع ايفاحب ااحماتاعااالف ا اافع اعشاطالم اااه الا الي ااصالا االا ارا ايفاثالوtags(
ا اصفعال ،التالب ا اليع)
Wikioارا اايألمل ااظما اعا جم92222ابااش اجل اتاثاثاأل اعاث اتشاطابااانيفعن الف(ئل ااسالعاباا اإلعال
،عاتاب الا ن اهت،ذلن غري ىل الفاتاع ا عف).
Netvibesب اعطاص لع عب ق و اس(تن ا اه ا ا إله ا ف ا ا اهيعع اظام)ث ا املاملبش اله
عا او ين،طاب الل اتاب ال ار اليا مجعب تRSSذلن غري ىل.
العا ا قوا ش ب ين0.2ا ه ىل تن ا ار ارتايب اه ئ ا الا ا افثص ا عا حم عف خت قت،ابان ي اتا
ه اهعقع ا عا حم فب ملععإ اإلبالعععإف اأ اء هالأ اعثأ اه اثش ط ال عا ه ف ذلن.ا دا اعاعا حم اتايفحت م اا
ه ب ئ ق متيل لطفثب ، اهي سوال فيعإ ،اياب داا طعشا اهعقعابا ات اب ا ق فب اعإل ايعدا ااه ااسعف ،هعقع ا ابص اخل ةا
م جلب اهي ه يل ه ثايف ،اجلتاتا لب اه ىل حتال قب اشئاب ع طعشا.
4.تقنياتالويب0.2
لار ات الم ا اا ال ه ثط مييرر اليتاتين ايال ااعر ين العا ةويب ا قواAjax technology،
Mashups technology،Rich Internet Applications (RIAs)،ا ااا ال اه اليمتاء اااألاا ئا البم اا املا
ين ر جل يلاب ال اا الفاسبشالت ر.
4/1.تقنيةAJAXالتفاعلية الويب تطبيقات وبناء
4/1/1.عامة نررة
طقعث فرAJAXألان ع ر اا ف ين0222ال ره ا ث ن ق لبJesse CARRETيع
بعقعAdaptive Path.متيلAJAXش ط ا“Asynchronous JavaScript And XML”هيال ثتاا اا
المععإ ل يا ل اسابسع ث ثععاهطتش عثب فلام طا قوا قعاالعا ةويب ععإ ععاب ف،رذج من ه
اه اقععاهااب ال هل ب تاهي سوال ععإ:AmazonGoogle maps.
ر يسر هس ععإ ااب الم اب ئا ال ا الفيال هاابد او ح ال ناب ي ينا ان الواات ا ا اهيععافثط
العااخلال حت دا ع ىل اب احل د دنا عا حم فب ملععار اةبالع م ا الم الطفثب.ا الفي ه ععاث لض ع م ااهي
ال:
اعاألث ينعات داب اليتن اه ن قاا صفث ر صفثب هل شا ااقععا ال ر قب اش ععإ الا العاثب اه،اأع ن م اا
ىلاععاالطفثباجلتاتاقب ا ال لار حتال المض ععا اوا ة وال رافثطا اه ااالعتن.تان اسا اتاع ا ه
اباااAJAXئ اا الا ش اارف م ااااتاااجلت اعاا او الاا حتافثباطال اسافن يناعشااط تن اا اه اارععا اعاعاق امالاااائ عبانالذارا
حم الAJAXين ل اي ل العفطفث اه ن اب.
يب تGoogle suggestه را قوا الععإ اهواابAJAXاس فيات ،ر تافات ا اه ان ا رين
اا يعع ايفاحب اء ااااتءاوال ،يناا دهااثاراع ا ااياه ا اا اليع ه ابا اليع اراايفاثالو ا اقعثاطينايفاثالو ق ااتاص
Search Box،ابا اخلت ااه اتهاواباائ ع اعشااطاحرتق ااا اا اليع ارا اباعع جما اقعثاطاهاا اتهاو امالاافسااحلااالاممت
هل د.ا ينه يل اض ي اس ىل الوثيف حم دفع ل ال األ قعار ب ئ الا ا اليعاعهاأ دعاباا لAJAXاعه ا مل،
شقم الليل ين ععث(3)شسر فر ال ر ب اخلت ه قوا ين ا اهيعع ا ؤس ر اليتات عب ة قت ،لاب ا.
8. 8
شكل(4)خدمةGoogle suggest
4/1/0.الهيكلوالبناءالتقنيلتقنيةAJAX
ت ايالواءاهلايعيااب لAJAXععإاهلرت تان اةسر ععب يا اهيعنالا قوااهاهطتش عثب ف
العا ةويب ععإ ا طفب ب ت اه،المااب ل ن الي اهلايعي ء الوا متيلAJAXه ه ر الماعي:
1.XHTMLوCSS
ر ايين ش دا اهيعع ا ا ض عا ه شا يو ،ض عاهلايلالتة ء الواا يعع لع.
الايمتXHTMLاتااثاهاري اايابااه الي اباااليايوع اويبالال اإاعع فب االاه ابائاهلا اان ا ارا اتاا اهي
W3Cا افثاص ام ااط ل
اااالع،ن ااظن ايناو امالااتاايعاهيع ا اان لعواا اا عاتااا اايهملًااراHTMLايفااثات اااإاععااواتداااها افاصاعابا يع اه
بش ياXML.
ا صفث يع لييXHTMLحلب صValidا يعا ال اعتع ال ر ععب بج ان اةل جيااهي سوال ععإ ر:
ه ب االع نعع حتتات شل الض ر الوتااب ينات اهDoctype
ر ضالطفثبععلعتب اهلايعاب ص اليا األقل إHTMLهيادعهملHeadBody
صتري حب ي ادعاألملاابش اة ا العت ين
ي اصعخل صب اخل ام الاأ د ه دا ف اطاص ا عال ت"………"
اعشاطال اعداملIMGااجيهااباص اخل اا دائ ر ااض اALTالايمت امالا اياهاعشااطلع اتالاوال ااصالاااراظ ل االاابال ث ين
فرعش عتنه.
اب الار يعد و ا الوتااب ملعد
ذلن غري ىل
يا الطفث ذج مناب اا اةن"cascading style sheet"CSSاب بيا افثص ض اع اا ا ين ثيم ا ابتل
اثت عف ال ر اهعقعفاأ م اا اهيعع صفص اليا فب لي الليعي ا ا ل ب يع اهابناهيعا افثطلع،ا ايف اي
قب اشاللويباب اهيععهاب الي(World Wide Web Consortium, W3C)ختعاعتعقاري يالعار رهياطاللويباب اهيععىلهقطإهت نا يذلنااب
ا لعااعيا ال،ا اصفع ر،دةئلااا هدسع لعث.اهطتش:http://www.w3c.org.ma
9. 9
افثباص الاملاعاقاهع ا افثاص ارااعذجا اااا ا الايعيالالااد ص ااخلا.اإاعع ااجيا افثاطاإاعع اتشاا ال ااهل افعاا ه اااالع
اري ااي اتاعاعق اااقواباصاااقو م ااا ،ض اايال اباالعط اامناألالاي اتاي ااطيا اباص اخلاععاانهااحلااار هثج، اعاالاأل ،
ايب ال اخلقعطئعب اه ،ذلن غري ىلالياط عا حم ععإ ق ي ليل.
اقعثاط اينايا"Cascading"ا عا اا اه اباف ملاإاعع ئي اا ع ايلال اأا قوا م ااا اعاس اتاي عا اا ين ش اا اه اععاساأل ه
ابف ملاإعع اأ قوا م اا اع ف افثبطال عا ا اإعع اتي ا اععال اعل اتاحتت ابل ث ين اياه اوالس فيعإ ،عب ع اهاا ا الف
الطفثب ل دا اب ض اه.ار ًةات انلذ ا الطفث ذج من عف ين ل ت ال ف ايفي ، ا ا ال ا ه يتال ين غوب ال لب ث ين
ثت ععإ صفثب مللتاري يتالا الطفث ذج من تان اس قول م ا مل مل.
0.استخدامDOM(Document Object Model)
اليمتاباجم اباتل-ال ابارا ارالاا ي-اعا دا ااع تن اا اان الوا ض ااع اااي داا الاع ف لع اوب اياس اف اجلالا ي هل
ععإض اليا يعع لع ععي ف ال ايي التااالعا ائب ين ثب اه.
4.معياالتكويدالقابللالمتدادوالتوسعXML
ا ايeXtensible Markup Language"XML"ش اايين اصطاه دش اط ابعهايابان اةليرت ا ا يعع،
ةيل حتتد لعاطعص يعات لتب هعارا ن الوا ض لي ععاأ ف.ر اض ا اأي افاع اصن هل انف لا ان الوا ابف مل
اهء الوا يت اا اهؤة ه ث ،ا ن الوا ه ؤدار ه ميير الم اش األد ثع اا ؤةاهلايعياال ار لاص ا ص اخل
ا عع جمادعاألمل.ا اي"XML"ار عاف"SGML"اب ا اياه(ISO 8879)اب قو اأاش يا ابتل اليمي ل الا
اه دش ط داشا عقق ين،ا يععر ض ا"XML"ععإحنع92%د عن ا الم ئف العف ن اهر ر"SGML".
ام ط مت هنأ ىل شا اإلة تش"XML"مللاس ا ن الوا لعصف ش يالر اا ااع عراع احلا اعه ا يع"HTML"،
داش م ااا اأااعع ء اااا اا اهيعع ا اان الوا ض ااع اا اا قوا االا ارا اارععا اواضال ااا ا ال اء ااا ،ا افثاطال ذج اامنStyle
sheetsن ع اب هن ين ،0222ض ع ا ا ل ثعع ب ال ثب ال ععإ افعع ب افع اه الاطعص"XML"هي:
ذج مناب اا اةن ا افثطال(Cascading StyleSheet) CSS:اع ابص ً تا اسا اياألمل ايهHTMLاتق
ش يا ع ر قوا اور متXML.
اتادا لال اباع ال ا افثاطال ذج اامن اباتل(eXtensible StyleSheet Language) XSL:ا ااتل اتااث اا ي
ر ا ط مت الم عسيب لع عب ال ا الطفث ذج منش يا ع قوا لع ًطاط ه قعاXML.
الااحتع اباتلاتادا لال اباع ال ا افثاطال ذج اامن(eXtensible StyleSheet Language Transformation)
XSLT:اويباالال اإااعع فب ااالاه اباائاهلا ا ااااصع اتاااث الاايمتابااااليايوعاباااه اليW3Cاتااقين اتشاااص92اعفاان
9111ثعال ث ،اتXMLىلةيلع افعHTMLا صفث ذج لا ث ط.
3.استخدامXMLHttpRequest
يا ن الوا ل ن ه عاسرتا آلاب،دن اخلا افثط اه اتن اع ىل اباا ال اه ا اتاا اعا0222اال ارملباة
اعفباس اي،افثااط اه اباارا اراا الاا ي اماالا ا اااتالع اعاا الاا ي ايااهWeb browser scripting languagesالااي
JavaScriptهVBScriptا ااان الوا ابااجل ي الاا لا اااهغري هش ااااي ااافXMLىل ارااااااالع دن ااااالاا اراا اناالذ
ملعع تان اسHTTPا ل ،شل اضال ار ااسلاتاعاسشافثط اه ىل دن اخلا ار ئ ا الادا اعافثبطال ال ملالا حت
حب اتات رام ا يففء ا حتتايفهاء هاالطفثب رهت عا حم ععإ تاري ه اق الم.
5.استخدامJavaScript
10. 11
ملبة ىل ىل األ ر تاا اعNetscapeمتيلجمب ال ا لت هةر ر اثتاةويب ععإ ثب اه ا اهيعع دش هط
،اةنرتنبشه د ر اير اء ها ين ثيم ال ععاب ف ال اياب التاا صفب ء عف ينا صفثاقععثبعتبhtmlر ،
ب ت اه لتال ال ب هنظ فب ملع افع ال العتب ه ئص ط ه.
شقم الليل اععث(4)ااب اأ لف ل ال ن الي اهلايعي ء الواAJAX
XML
XMLHttpRequest JavaScript
HTML & CSS
DOM
AJAX
شكل(3)اله البناءيكليلتقنيةAJAX
تن ااا اا قواAJAXاااالا را افثاطاااالع، اااالع ا ااع ي اويالا اارععا ااعاق اا مل هه اقب ااةاتعما
ااه اتا ارا ، اراع ع اا ال ا اا قوا ال ا ااناهيعا افثاط اهMozilla Firefox،Internet Explorer،Opera،
غريه.
4/1/4.تقنيةAjaxالعمل وآلية
ىل ااظالا ارايميAJAXااهنه اإاععمي اباااارا ارايااهلالا اان الوا الا ناراع ع اد ااها ا اا اهيععاتاافثاط اهدن ااخلا
ين ا غري ليلasynchronousععإ عت ا ا ه ،ا صفث ث ف ن ا الاقعع، ااالعار ء اا اتايفحتالافثأطم اا املا
ععار اةبالعىل اأ احل ددا عال حتا عا حمالطفثباتات ر عب مل.اشد م ا ليياي ال شل الض ر ل الي آلاب
ععإهت ق الفاب ا اه العا ا قوات اب ا اه غريدن اخلطفث اهق ق ال م اقب الا هللاب ال اا الف ين:
1.بين امنةزالمت الويب تطبيقاتالخادموالمتصفحWeb Application Model (Synchronous)Classic
اريالااقعثاط"ر ا اا ال"Synchronousابا ع افباطهابااآلا اان الوا الا نا اا اهيععم اااتا ا ااة و اعشااطين ااب
ط اة(ول اه سل اه)،ااتع ر ت ة لقب نفس يناسلرتالشقم الليل ين ععث هع مل،(2)
11. 11
شكل(5)للبيانات امنيزالت النقلsynchronous
اا اير ا اا اه ارتاياإلل ااماعي الSynchronous E-learningايفااث ااالا ا ااه اإاعع اباعي األ اا ه ارااراشل ااضالااط ا
ا ااساألا اا اهيعع ن ااظا االاقالالاع ف ال اباا ا ل اا ن اشعااث اء اااإل اباقالع اسافن ينااة اهواارماا ابااث ن ارا االاقال اتا
ن ارا ا ااساأل اتاا اا ه ابااث.ا ااه االا ارا ارايميال ب اااق ااالااباا تالابايااFeed backااة و ايلال.اماهه ارا
ا اااا الاال ابا التاعاا اه ااط اة اارتاياةل ااماعي ال ن ااظن ين ر ا:ء ااضالوا احعاالاألWhite Boards،ااباعارتاةف اعاطالف
virtual classrooms،الفاتاع ع اا متؤاهVideoconferencing،اعاطال اع اا متؤاهAudio conferencing،
التشدةب غChatting Roomsذلن غري ىل ،.
ينش باب ا اه العا ا قوايعدن اخلا ىل ا ا اهيعع ا ن الوا طفث اه سل ا ثايف طفث اه دن اخل ار ت ا اليالق
اثتا عب ملي ر جل ي هت ه هضعن ا ل الانلذ اتيافثط اه ىل ئ ا الا اسنشاهات ال الي ابال اباعات ال اب ا الق ايه
طفث اه دن اخل.
لط ا ين اب ا اه العا ا قوا ل ع آلاب يلتن ا ه ص اخلا افثط اهاليمي ل الاالا اليClientدن اخلا ارجب
Serverعر ح اهُيتاهع ا افثطل ضاف اهيالن اسا ه ش ا ف اس اء ا ا تن ا اه ن ااق اتاع ،اأ عا حم ض اع اععاهق اعق
افثاط اه اعنا اىل اأاعثعا،دن ااخلاافثاط اه ىل ئ اا الا ااسش يالن ااساة اباجل بي دن ااخلا ن اااق اتا اعباص الف ابااا ال ارتاافال ء ااا ه ين
ملاس طفث اه إ اوا ةعنسعا ةي هل ل ياش ظ ناة اجب نيالن سث دن اخل رعن اتن اه ععإ ئ الا ض ي.
مثالتوضيحي:
تن عن ا دا عن اظالا ير اا اث ًة ه اجال ل ا اهيعع ا ؤس ا اع ع ثب اه ناب اةليرت ا اهيعع ا ت
ث ال اتي احلا ابيقوا انلذ ا اخلت ىل لعجعل صب اخل اثش ط ال ئأ عق را هعا ار اأاال ارابئيول تن ا اهاعذج ا
شا اس هجال لعالمر ضععب جما ا ن الوا ررل ثاصطخمل، ارتياةل اتا عاتق اعاثاأل اي يناأل د م اا
اتااع ،ابائب اعشااطاعنا ا ااعالق ا ااه ااسشابا ر اعا دن ااخلا ااراارا اتامل ل اعنا ا ارتاياةل اتاا ال اصاثفاثاصأارا
أ عتمث ،ل الي ين اش اةس ين طفث اه اوته ف يته ،تن اه طفث ىل ئ الا شس.اع ال اريمي ا ا ه شا يوا
اص الف اباا ال الفرتاعافثط اه الظا ا ا ه ا ا ئ ا الا و اسا ات ار جل هي دن اخلا ىل ا ا اهيعع ا ان الوا افثط اه اسش ات ب
تاع ال صث ذا ل ع هل د.
المستقبل المرسل
المعلوماتو البيانات
المو البياناتعلومات
12. 12
شكل(6)المكتب بوابة في للتسجيل نموذجةاليةرالست الوطنية
0.بين امنةزالمت غير الويب تطبيقاتالخادموالمتصفح(ل الداعمةتقنيةAjax)
Ajax Web Application model (Asynchronous)
ااالا ا اااه ااافاين اااب اعاايا ه شل اااضال اراا ااساال الااسارتال اراااعتااط اااط اةابااقالع اساافن ينا ااان الوا اياا ع ل
اباق ابانةنرت الط ارياغ ول اا اه اعيا ه اراي اه ارا ف ا ا اهيععالاس اه ن ااقاالعاباة اأااميي ا اا اهيعع ا ان الوا ااسش
اويبلل طل ايع ثت ه قب ين ععارانلذ اإعع ابعي األ ا ه ارارتياةل اتا ال اب تاعه ا مل،ايللال ين اثعع
شقم(7)
شكل(7)الللبيانات امنيزالت غير نقلasynchronous
ارتاياةل ااماعي ال ااي اافر ا اا اه ارياغAsynchronous E-learningش ااضال ارا ااساللاعداااباق اسافن ين االاقال
ا ااط األااسااان الوا اإاعع االعاباإل اتاشباعل ارايمي ايفااثاعباس اه ا اا اهيعع ااا ثااالاط ااوبا لا اأا نف ااحلا ،اويبالل
اويبالل ااط اة اباق ابااهقعع ا ااوااعال لاف ااي ال اإاعع االعاباإل ارايمي ايفااث ا ااسلأل،ااط اة ا اابه اتاااع اا لين
المستقبليتصل
لإلطالععلى
الرسالة
يقوم المرسل
رسالة بارسال
اتصاله عند
البريد خادم
االلكتروني
13. 13
شل ع غري ه اي العقب نفس.اه غري ط اة لا ب التاع اا األد ا اا ال ههم رر ا ا:ارتياةل اتا الE-mail
،اتاب ال ائمع الMailing lists،ل الا ا عع جمDiscussion Groups،ا اهعف ل نFiles Exchangeغريه ،.
هاهيع ا ان الوا افثط اه الس ا ايفاث افثط اه دن اخلا ارا ات يع ا ليالق ف اب ا اه غري العا ا قوا ل وب لاا ا ع
افطعب ثتاا ةيل ين ر جل ي هت ه هض دن اخل ىلا ه اضب دن اخلا عن اا ا األ ا ان الوا ارع ايب اتاث اإعع اا المل.
الفل اهلايعي ء الواب التاع اب ا اه غري العا ا قوالاابAjaxرسات هس ت ق:
ه.ااأل م لال اليClientيع ار:
ااط اهفث:اعاهالايمياان الفات اا اه اان ا ارا تن اا اهلافثاص ض ااياعااعاقااهتش ا م ااا امالا اااالع،اا ه ارا
ذار منMozilla Firefox،Internet Explorer،Opera،غريه.
حمAJAX:ل الال ايد افثط اه اأاعف ينه،تن ا اه اأ ايلااب بر اععاقاعبس اه ا ان الوا اصثفىل
دن ااخلاتن اا اه اا اد اتااع هل ،تن اا اه اان ا اراةاأامسهين اأاطفث م ااا ااياه اوالاس اإاعع ارتاياةل اتاا
او ا ه قول ر احل.
.دن اخل مييعأ ل ال الي م الServer:
ش د يل اين ي ئا الا ن الوا فثصا اهيععععإ ل الييالن اس جلب يت اهن.عن ا لئ ا ن اسشيالن اساة
ال الي ىلClient،ايله ا األ ين اتااجلت رئ ا الا اهةالسىلافثط اها اة وايفاثالساحم ىلAJAXل الا
ب بر اضقععلأ و اس مت ت فأاهقعع ا اهيعع طفث اه ال ر ض ع دن اخل ن ا ر.
م ااا الف ينلاب الي ض عععاثاب ال يعب األقول ل الي لاب نبش اه ال رقواابااAJAXاتهياريمي اث
الف الثظبق.
مثال1:اللكتروني البريد خدمة في التسجيل
قبلAJAXبعدAJAX
•ىل األ اعااقاخلاجالا اعاه دا ااع ااد ن ااا ال م ااا امالا
ارتاةةاياةل ات ال ب ت ينرتاال ارابئيو
ض الت ا هل خمطص منعذج
•ا ااه ر ااض االتن اا اه اراع ا اان ا اعذجا اخلابا ت
اعااااااالي تن ااااا اه امااااسه ااااارا ارتااااياةل اتااااا ال
اأااا ص ااااخلا اتلاااا ال،اافاااضاه دن ااااخلا ااااراقعو امااالا
اةليرت ات ال ب خلت.
•اتااياراا ء ااار اةناعذجاا الا اباائيوش اإااعع اتااضال
ا ، ااسش، ااعالق اباجل ي ين دن ااخلا اتهاوا اافا اتاق
اعاجحم ش اا ا ل االا تن اا اه اماسه اا تن اا اه
ااااااعال ارااا اااا ل ، اااا ه تن اااا اااان ا ارااا
جال ال دا ع.
•اااااملذاافثااااط اهااااا ف ابااااااا ااااااا ر اااااض اع
•ىل األ اعااقاخلد ااع ااد ن ااا ال م ااا امالااجالا اعاه ا
ارتاةةاةليرت ات ال ب ت ينال ريوئب
ض الت ا هل خمطص منعذج
•ا ااه ر ااض االتن اا اه اراع ا اان ا اعذجا اخلابا ت
اعااااااالي تن ااااا اه امااااسه ااااارا ارتااااياةل اتااااا ال
اأاا ص اااخلا اتلااا ال،اافااضاه دن اااخلا اااراقعو اماالا
اةليرت ات ال ب خلت.
•دعم لب ث ينابااAJAXامسا ا د د اج فو
اااحب اء اناا ااة و ايلال ن ااظالا اعنا ا تن اا اهيف
اع اااس(تن ااا لع اياائ اريااغ)تن ااا لع اثااعلاع
ااان ا اراا تن ااا ش ااا اه امااساة اااملذا ااا ع
تنهأ عت ر.
•ين ابااياا ال ابااا ت ال اإااعع تن ااا اه الااطحي ااا ل