أهم أدوات بناء تطبيقات ووردبرس دون رأس Headless WordPress

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

MailHog: وهي أداة اختبار SMTP تعتمد على الويب وواجهة برمجة التطبيقات.
Insomnia: هو عميل REST قوي متعدد الأنظمة يستخدم لاختبار واجهات برمجة التطبيقات.
JWT Auth: هي أداة شائعة الاستخدام لتأمين واجهات برمجة التطبيقات.

تطبيقات ووردبرس بدون رأس Headless WordPress باستخدام REST API

لنتعرف في الفقرات التالية على أهم المتطلبات والخطوات التي تحتاجها لتطور تطبيقات ووردبريس بدون رأس مع توضيح حالات الاستخدام المفيدة لهذا النوع من التطبيقات.

المتطلبات

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

خادم ويب يدعم لارافيل مثل Valet
نظام إدارة قواعد البيانات مثل MariaDB
لغة البرمجة PHP (أي إصدار أعلى من 7.4.33 حسب نوع الخادم الذي تشغل المشروع عليه) ولمزيد من المعلومات حول إعداد بيئة تطوير محلية يمكنك الاطلاع على مقال تثبيت وضبط تطبيق لارافيل مع خادم Nginx على حزمة LEMP من أوبنتو ومقال دليل إعداد خادم ويب محلي خطوة بخطوة

سنستخدم أيضاً الأدوات التالية بالنسبة لبيئة التطوير الخاصة بنا:

Visual Studio Code Insiders: لتحرير الأكواد.
PHPDoc Comment: لتوثيق الأكواد.
PHP Sniffer & Beautifier مع PSR12: لتحليل وتنسيق كود PHP والتأكد من مطابقته للمعايير والقواعد البرمجية.
PHP Debug: لمراقبة تطبيقات PHP وتتبع أخطائها.
Ray: أداة تسهل تصحيح الأخطاء البرمجية. عملياً إذا كنت على معرفة بكل الأدوات والتقنيات السابقة وكان لديك الإعدادات الخاصة بك أو كنت معتاد على بناء التطبيقات أو الحلول باستخدام ووردبرس فقد يكون كل ما سبق لا يعنيك. وإلا يجب عليك أن تأخذ بعض الوقت لتتعرف على كل ما ورد أعلاه.

دراسة حالة بسيطة:

بفرض طلب منك تطوير تطبيق ووردبرس بدون رأس Headless WordPress يوفر نقاط نهاية مخصصة endpoints ويمكن لتطبيق iOS الاتصال بها لتسجيل الدخول والقيام بالاستيثاق أو التأكد من صحة البيانات وإرسال واستقبال البيانات. سيقدم تطبيق ووردبريس الوظائف التالية بالتحديد:

إنشاء حساب جديد للمستخدم.
الحصول على معلومات المستخدم.
طلب مفتاح التشفير المساعد token.
التحقق من المفتاح المساعد token.
ضبط بيانات المستخدم. إن هذه البنود ليست كاملة ولكنها كافية لتوضيح طريقة استخدام الأدوات المختلفة في بناء تطبيقات مماثلة.كما أن الوظائف المذكورة في التطبيق يمكنها أن توفر عبر نقاط الوصول endpoints التالية:
/acme/v1/getUser
/acme/v1/createUser
/jwt-auth/v1/token
/jwt-auth/v1/token/validate
/acme/v1/setData

ملاحظة: إن acme هنا عبارة عن قيمة مؤقتة placeholder تعبر عن اسم التطبيق. أما jwt-auth فهو اسم المكتبة الخاصة بعملية المصادقة (اسم المستخدم وكلمة المرور) التي نقوم باستخدامها وهذا ما سيتم مناقشته لاحقاً في هذه المقالة

توثيق واجهة برمجة التطبيقات API:

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

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

الأداة MailHog

إذا قمت سابقاً بتثبيت برنامج ووردبريس فمن المؤكد أنك رأيت كمية رسائل البريد الإلكتروني المرسلة لك وذلك إما عبر واجهة التطبيق أو عبر واجهة سطر الأوامر Command Line Interface فعندما تعمل في بيئة التطوير الخاصة بك سيكون هناك اختلاف بسيط في التعامل وإدارة رسائل البريد الإلكتروني (سواء في طريقة استلامها أو تخصيصها) وهنا يمكنك استخدام تقنية MailHog وهي عبارة عن تطبيق ويب مفيد جداً عندما تصل إلى مراحل متقدمة في تطوير واختبار مشروعك حيث تقوم هذه التقنية بدور خادم SMTP وهمي وتقوم بشكل أساسي بدور خادم بريد إلكتروني وهمي لمساعدتك في اختبار وظائف البريد الإلكتروني وتصحيح الأخطاء.

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

الموضوع (عنوان الرسالة)
المرسل
المستقبل (مستلم الرسالة)
الرسالة (نص الرسالة)

كما تسهل هذه الأداة وظائف البريد الإلكتروني من خلال التأكد من تنسيق رسائل البريد الإلكتروني وتسليمها بشكل صحيح. وعلى الرغم من أن هذه الأداة تعد مفيدة نوعاً ما عند العمل ضمن برنامج ووردبريس إلا أنه يجب الأخذ بعين الاعتبار معرفة كيفية استجابة التطبيق عندما نستخدم بيئة ووردبريس بدون رأس Headless WordPress فكل الأوامر تشغل من خلال نقاط الوصول الخاصة بواجهة برمجة التطبيق API

الأداة Insomnia

الأداة Insomnia هي تطبيق عميل API مفتوح المصدر متوافق مع مختلف الأنظمة، لكن إذا كنت معتادًا على التعامل مع تطبيقات REST API مثل تطبيق Postman أو تطبيق Paw (المسمى حالياً RapidAPI) فإنك لن تكون مهتماً بالعمل على هذه التقنية بالرغم من أنها أبسط نوعاً ما من التطبيقات المذكورة أعلاه

بالنسبة للمطورين الذين لا يعملون على البرامج المذكورة أعلاه فإن هدفهم الأول هو تبسيط عملية التفاعل مع واجهة برمجة التطبيق REST API واختبارها. تنشئ الأداة Insomnia طلبات بروتوكول HTTP وتحللها وترسلها إلى نقاط وصول واجهة برمجة التطبيق API باستخدام الأوامر GET و POST و PUT و DELETE القياسية وتجعل التعامل معها أكثر سهولة.

كما أنها تسهل التعامل مع ملفات JSON, XML وبيانات النماذج أو الاستمارات forms. وإن كان هذا الأمر غير مهم عند إنشاء التطبيقات لأنه يمكنك التحكم بنوع ملفات الخرج التي سيتم استرجاعها ولكنه أساسي عندما تتعامل API آخر لأن تحتاج لتغيير تنسيق البيانات قبل إرسالها أو استقبالها.

ومن أهم ميزات هذه الأداة هي قدرتها على تنظيم الطلبات requests في مجلدات ومساحات عمل workspaces وهذا يسمح للمطورين بتنظيم وإدارة مشاريع اختبار واجهة برمجة التطبيق API الخاصة بهم ويسهل عملية التنقل والتبديل بين نقاط الوصول المختلفة. بالإضافة إلى ذلك فإن الطريقة التي يسمح لنا التطبيق بها في هذه الأداة بتوثيق وتنظيم كل نقطة وصول تجعل عملية مشاركة التطبيق مع المطورين الآخرين أسهل وبالتالي يمكنهم اختبار التطبيق على تطبيق واجهة برمجية API آخر على سبيل المثال بمجرد إنشاء REST API لموقع مبني بواسطة ووردبريس يمكنك مشاركته بواسطة الأداة Insomnia مع مطوري تطبيقات iOS ليتمكنوا من معرفة ما يلي:

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

الأداة JWT-Auth

قبل البدء في معرفة أهمية الأداة JWT-Auth فإنه من المفيد جداً معرفة ما هي JWT ومدى فائدتها في تطوير واجهة برمجة التطبيقات REST API بشكل عام يمكن تعريف JWT على أنه طريقة آمنة لنقل المعلومات بين المطورين بصيغة JSON وبعبارة أبسط هي عبارة عن آلية مصادقة معتمدة على المفتاح المساعد token وتستخدم بشكل كبير في تطبيقات الويب ملاحظة: على الرغم من صحة ما سبق فإنك إن لم تكن على دراية بآلية عمل مصادقة REST API لن تستطيع بناء المصادقة التي تحتاج إليها. عند إجراء مقارنة بين طريقة تفاعلنا مع الووردبريس من خلال المتصفح، وطريقة تفاعلنا مع الوورد بريس من خلال JWT فإنه يجب الانتباه إلى النقاط التالية:

أولا نقوم بإرسال بيانات الاستيثاق (اسم المستخدم وكلمة السر) إلى المتصفح ومن ثم يطابق التطبيق تلك البيانات ويرسلها إلى المتصفح وبعد ذلك نكون قادرين على العمل والتنقل ضمن الوورد بريس (إدارة المستخدمين - كتابة وتحرير المنشورات وما إلى ذلك وأحياناً يكون عبارة عن مراجعة للمنشورات فقط) وهذه الأمور تتم فقط من خلال مدير نظام ووردبريس.
أما عندما تتم المصادقة عبر واجهة برمجة التطبيقات REST APIs فيجب أن يكون هناك طريقة أخرى للمصادقة يستطيع التطبيق من خلالها معرفة بيانات استيثاق المستخدم وهنا يأتي دور المفتاح المساعد token حيث ستقوم آلية المصادقة المعتمدة على JWT بإنشاء مفتاح مساعد token ثم تقوم بتضمين هذا المفتاح المساعد token مع كل طلب وفي انتهاء صلاحية المفتاح المساعد token ستقوم واجهة برمجة التطبيق API بإعلامك من أجل أن تقوم بتحديث المفتاح المساعد token من الواضح بأنك بحاجة إلى عمل كثير عند تطبيق JWT في ووردبريس ولكن عند استخدام إضافة JWT-Auth فإن ستصبح الأمور أسهل بكثير.

وكما توضح الصورة أعلاه المأخوذة من توثيق الإضافة فإن استيثاق ووردبريس باستخدام JSON Web Token يسمح بإجراء مصادقة واجهة REST API باستخدام المفتاح المساعد token وهي عملية بسيطة وغير معقدة وسهلة الاستخدام وهذه الإضافة مناسبة جداًَ لعمل مصادقة JWT ضمن ووردبريس.

وللتعامل معها عليك القيام بما يلي:

ضع مفتاح سري في الملف wp-config.php
حدد فيما إذا كنت تريد من الإضافة أن تدعم خاصية CROS (وهو موضوع مهم إذا كنت تريد تمكين الاتصال الآمن بين تطبيقات الويب)
بعد الانتهاء من تثبيت الإضافة يمكنك ان تقوم بعمل طلب request إلى wp-json/jwt-auth/v1/token/ متضمنا اسم المستخدم وكلمة السر للحساب بتنسيق JSON كما في المثال التالي:

{
  "username": "John@appleseed.com",
  "password": "kn6oLrcW0\/D1M"
}

وبعدها سوف تستقبل الرد التالي:

{
  "success": true,
  "statusCode": 200,
  "code": "jwt_auth_valid_credential",
  "message": "Credential is valid",
  "data": {
    "token": "eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJpc3MiOiJodHRwczovL3NjYXJpZi50ZXN0IiwiaWF0IjoxNjg0MzU1MzA5LCJuYmYiOjE2ODQzNTUzMDksImV4cCI6MTY4NDk2MDEwOSwiZGF0YSI6eyJ1c2VyIjp7ImlkIjoyNTksImRldmljZSI6IiIsInBhc3MiOiJiMWM3OTBhMmJhYzExNzNlYzI4ZTQxZGUxMDYyYzIwZiJ9fX0.q3-DRC_DQvezy1w-XV0CYNQYyKC3X8iSs7GKy86zjbg",
    "id": 259,
    "email": "John@appleseed.com",
    "nicename": "johnappleseed-com",
    "firstName": "John",
    "lastName": "Appleseed",
    "displayName": "John@appleseed.com"
}

وبعد ذلك ستقوم بتضمين المفتاح المساعد token مع كل طلب جديد، وإما أن يسمح لك الووردبريس مع إضافة JWT Auth بإرسال هذا الطلب request أو أن يمنعك من ذلك. هذا هو باختصار جوهر عمل الأداة JWT ضمن التطبيقات دون الرأس headless ولكن هذا ليس كل شيء إذ توفر هذه الأداة الكثير من المميزات الأخرى التي لن نتطرق لها حاليًا

الخاتمة

تعرفنا في مقال اليوم على أهم الأدوات التي سنحتاجها لبناء تطبيقات ووردبريس بدون رأس Headless WordPress باستخدام واجهة برمجة التطبيق REST API والتي يمكنك من خلالها الاستفادة من مرونة الووردبريس كنظام إدارة محتوى. نتمنى لكم الاستفادة الجيدة من هذا المقال وفي حال كان لديكم أي تساؤل حول ما ورد فيه فيمكن تركه في قسم التعليقات أسفل المقال أو كتابته في قسم الأسئلة والأجوبة في أكاديمية حسوب.

ترجمة وبتصرف للمقال How To Build Headless WordPress Applications with a REST API لكاتبه Tom McFarlin