API:Picture of the day viewer/ar

نظرة عامة
سوف تتعلم في هذا التدريب التعليمي كيفية تصميم عارض ويكيبيديا:صورة اليوم المختارة مستخدما واجهة برمجة تطبيقات ميدياويكي من النوع Action. تنزيل الكود المصدري من غت هب ابحث عن التطبيق في مصنع الأدوات

سوف يعلمك هذا التدريب التعليمي كيفية تنفيذ هذا مستخدما:


 * بايثون 3 وكذا إطار عمل فلاسك
 * واجهة برمجة تطبيقات ميدياويكي التي تحمل اسم Action وكذا وحدات و البرمجية

تأسيس بايثون
يستخدم هذا التدريب التوضيحي بايثون الإصدار 3. يمكنك تنزيل أحدث إصدار من بايثون من هنا:


 * بايثون لأنظمة ويندوز 7 و8 و10
 * بايثون لنظام التشغيل Mac OS X

طالع الدليل الإرشادي للمبتدئين في نظام بايثون لمزيد من التعليمات التي تتناول تنصيب بايثون على أنظمة تشغيل أخرى.

تأسيس فلاسك
إن بيب (Pip) هو نظام لإدارة الحزم يمكنك استخدامه في تثبيت Flask:. إن لم يكن لديك «بيب» بالفعل، ثبته من الموقع الشبكي الرسمي لبيب.

الخطوة 2: إنشاء تطبيق فلاسك بسيط
لو كان كل شيء مثبتًا لديك ويعمل على ما يرام، ضع النص البرمجي التالي في ، داخل مجلد مشروعك:. حينما تشغله (مستخدمًا  أو  )، سوف يعرض «Hello world» في http://localhost:5000/:

الخطوة 3: عارض صورة اليوم المختارة
منذ أن كل شيء جاهز، يمكنك البدء في كتابة الكود البرمجي لعارض صورة اليوم المختارة. صورة اليوم المختارة، اختصارًا «POTD»، هي Wikipedia:Wikipedia:Featured_pictures صورة مختارة تعرض يوميًا على الصفحة الرئيسية لويكيبيديا. سوف تحصل على الصورة من قالب ويكي يتغير كل يوم.

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

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

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

تاليًا أضف متغيرين اثنين جديدين:  و. سوف تستخدم عنصر  كي ترفع طلبات إلى معرف الموارد الموحد.

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

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

في الختام، غيّر  كي تستدعي. استورد  من  ، واجعل   يرد.

عرض الصفحة


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

تحويلها إلى صفحة تفاعلية
أضف عنصر إلى  ، ثم امنحه مدخلات زر الإرسال التالية: «عودة - Back» و «التالي - Next». حينما لا يختار أي من الزرين، سوف يرسل النموذج طلب نشر «POST»، وسوف تمرر القيمة المختارة مرة أخرى إلى. سوف يسمح هذا الأمر للمستخدمين تصفح أرشيف صورة اليوم المختارة.

بعد ذلك حدّث  داخل الدالة  ، كي تضبط التاريخ المعروض للمستخدم. وسّع أيضًا طريق  كي تتعامل مع طلبات النشر «POST» من النموذج. كي تسمح لملف  بقراءة رسائل طلبات النشر «POST»، استورد فئة   من Flask.

هذا هو الكود البرمجي الكامل لبايثون وإتش تي إم إل:

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

الخطوات التالية

 * ساهم بتطبيق تجريبي صممته بنفسك مستخدمًا واجهة برمجة تطبيقات ميدياويكي في مستودع عينات الكود البرمجي هذا.
 * تعرف على بعض السبل لإضافة نص وصفي من صفحة صورة اليوم المختارة:
 * يقدم عنصر   يمكن استخدامه في صفة عارض لمحة سريعة عن وصلة شبكية
 * يمكن استخدام #1 للحصول على النص المعرب كاملًا من المقالات على مواقع الويكي التي نصّب فيها الامتداد #2 (طالع المثال).

انظر أيضا

 * : نظرة عامة على واجهة برمجة تطبيقات Action
 * : أسئلة متكررة تقدم بيانًا متعمقًا لواجهة برمجة التطبيقات Action
 * مستودع عينات كود واجهة برمجة التطبيقات Action الخاص بميدياويكي: يحتوي على المزيد من العينات التوضيحية وعينات من الكود البرمجي
 * المزيد على ويكيبيديا وIFTTT
 * مستودع عينات كود واجهة برمجة التطبيقات Action الخاص بميدياويكي: يحتوي على المزيد من العينات التوضيحية وعينات من الكود البرمجي
 * المزيد على ويكيبيديا وIFTTT