الوصول إلى Facebook OAuth 2.0 للموقع الإلكتروني

تتم عملية التفويض OAuth 2.0 المستخدمة بواسطة Facebook عبر "منح رمز التفويض". دعونا نقدم كيفية تنفيذه وكيفية تصحيحه في Apidog.

ما هو OAuth 2.0؟

OAuth 2.0 هو بروتوكول تفويض مستخدم على نطاق واسع يسمح للوصول من طرف ثالث إلى الموارد المحمية دون الحاجة إلى بيانات اعتماد المستخدم. ويتضمن أربعة أدوار رئيسية:

1. مالك المورد: عادةً ما يكون المستخدم الذي يمتلك الموارد المحمية.
2. العميل: هو التطبيق الخارجي الذي يسعى للوصول إلى بيانات مالك المورد.
3. خادم التفويض: يتحقق من مالك المورد ويمنح العميل التفويض.
4. خادم المورد: يخزن ويدير الموارد المحمية، ويوفر واجهات برمجة التطبيقات للوصول.

تدفقات التفويض الشائعة

تقوم بروتوكولات OAuth 2.0 بتنفيذ التفويض من خلال عدة تدفقات تفويض مختلفة. تشمل تدفقات التفويض الشائعة:

• منح رمز التفويض: يقوم العميل بإعادة توجيه المستخدم إلى خادم التفويض. بعد تسجيل دخول المستخدم ومنحه الإذن، يعيد خادم التفويض رمز تفويض إلى العميل. ثم يقوم العميل بتبادل رمز التفويض مع بيانات اعتماده للحصول على رمز الوصول.
• منح رمز التفويض مع PKCE (مفتاح الإثبات لتبادل الرمز): مشابه لتدفق رمز التفويض القياسي، لكن العميل يعزز الأمان باستخدام PKCE (مفتاح الإثبات لتبادل الرمز).
• منح بيانات اعتماد كلمة مرور مالك المورد: يقدم مالك المورد مباشرة اسم المستخدم وكلمة المرور للعميل. ثم يستخدم العميل هذه البيانات لطلب رمز وصول من خادم التفويض.
• منح بيانات اعتماد العميل: يطلب العميل مباشرة رمز وصول من خادم التفويض باستخدام بيانات اعتماده الخاصة. هذه التدفق مناسب للحالات التي يحتاج فيها العميل نفسه إلى الوصول إلى الموارد.
• منح ضمني: يُستخدم للحصول على رمز الوصول مباشرة من العميل في تطبيق قائم على المتصفح. يُستخدم هذا التدفق عادةً لتطبيقات الواجهة الأمامية للويب.

كيفية استخدام Facebook OAuth 2.0 لتسجيل الدخول إلى مواقع الويب التابعة لطرف ثالث

الخطوة 1: إنشاء التطبيق والحصول على معرف العميل والسرية العميلة

أولاً، تحتاج إلى فتح حساب مطور Facebook على https://developers.facebook.com. بعد فتحه، قم بإنشاء تطبيق فيه.

بعد إنشاء التطبيق بنجاح، انقر على خيار [إعدادات التطبيق -> أساسي]. رقم التطبيق هنا هو معرف العميل (Client ID)، ومفتاح التطبيق هو السرية العميلة (Client Secret). سنحتاج إلى هذين السمتين لاحقًا.

الخطوة 2: تكوين عنوان العودة

بعد إنشاء التطبيق، تحتاج أيضًا إلى ضبط "عنوان العودة" في لوحة التحكم، انقر على خيار [لوحة التحكم -> تخصيص هذا التطبيق]، ثم انقر على "إعدادات تسجيل دخول Facebook" للدخول إلى واجهة التكوين.

في بند "URI الصالح للقفز OAuth" في واجهة التكوين، املأ عنوان العودة (Callback URL)، وهو عنوان إعادة التوجيه. عادةً ما يكون اسم النطاق الخاص بالخادم الخاص بك (يتطلب Facebook أن يبدأ بـ https).

إذا لم يكن لديك واحد بعد، يمكنك ملؤه أولاً، طالما أنك تأكدت من إمكانية الوصول إلى اسم النطاق. بعد الانتهاء من التكوين، احفظه.

الغرض من حاجتنا لعنوان "العودة" هو الحصول على رمز التفويض (code) في شريط العنوان. بشكل عام، بعد ملء اسم المستخدم وكلمة المرور على صفحة تسجيل دخول OAuth 2.0، سيتم إعادة توجيهك إلى "عنوان العودة" ويمكن عرضه في شريط العنوان.

الحصول على رمز التفويض (code). يتم استخدام شريط العنوان التالي للحصول على قيمة الرمز يدويًا:

بعد تكوين المعلومات أعلاه، ندخل رسميًا في العملية الرئيسية لتفويض OAuth 2.0.

الخطوة 3: الحصول على رمز الوصول

عندما تكون الخطوتان الأولى والثانية أعلاه جاهزتان، يمكننا التقدم للحصول على رمز وصول (Token). سنظهر هذه الخطوة من خلال Apidog.

Apidog هو أداة ممتازة جدًا لتصحيح وإدارة APIs، يمكنك الحصول على رمز الوصول (Token) مباشرة في Apidog. إذا لم يكن لديك Apidog مثبتًا بعد، قم بتحميله الآن!

1. إنشاء طلب HTTP بعد إنشاء مشروع HTTP في Apidog، افتحه، ثم أنشئ طلبًا في المشروع، اختر خيار "تحرير الوثيقة -> المصادقة -> OAuth 2.0".

2. تكوين معرف العميل، السرية العميلة، وعنوان العودة وضع السرية والعميل وعنوان Callback URL التي تم الحصول عليها في الأسفل من صفحة OAuth 2.0 في Apidog حيث يتم تحديد وضع التفويض الافتراضي المختار على صفحة OAuth 2.0 في Apidog هو رمز التفويض، حيث يستخدم Facebook OAuth 2.0 أيضًا رمز التفويض. لذلك، لا تحتاج إلى التبديل هنا.

بعد ذلك، ابحث عن معرف العميل وعنوان العودة في أسفل الصفحة، واملأ معرف العميل والسرية وعنوان العودة المكون من خدمة Facebook OAuth 2.0. المعلمات المحددة هي التكوينات المذكورة في "الخطوة 1، الخطوة 2" أعلاه.

3. تكوين عنوان طلب رمز التفويض وفقًا لوثائق Facebook الرسمية، أثناء مصادقة OAuth 2.0، فإن عنوان طلب رمز التفويض هو: https://www.facebook.com/v19.0/dialog/oauth

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

عادةً، عند إنشاء صفحة تفويض تسجيل الدخول يدويًا، تتطلب صفحة التفويض زيادة في المعلمات، مثل:

https://www.facebook.com/v19.0/dialog/oauth?
  client_id={app-id}
  &redirect_uri={redirect-uri}
  &state={state-param}

ملاحظة: لا يجب أن تحتوي تكملة المعلمات على فواصل أسطر عادة.

ومع ذلك، في Apidog، عادةً ما لا تكون هناك حاجة إلى معلمات إضافية بعد عنوان URL الأساسي. فقط المسار قبل علامة الاستفهام "؟" مطلوب لأن المعلمات الإلزامية الأخرى يتم تكوينها بشكل منفصل في خيارات أخرى. بالطبع، إذا كنت تريد تضمين بعض معلمات الاستعلام، يمكنك أيضًا إضافتها من خلال النقر على الرمز بجوار صندوق الإدخال هذا:

يمكننا أيضًا توسيع خيارات "المزيد" وملء القيم للمعلمات التي تحتاج إلى تعبئتها، مثل ملء "المدى" بالأذن المطلوبة "public_profile". إذ إن إذن "public_profile" في Facebook يسمح للتطبيق بقراءة حقول ملف التعريف العامة الافتراضية لعميل المستخدم، ويتم منح هذا الإذن تلقائيًا لجميع التطبيقات.

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

4. تكوين عنوان طلب رمز الوصول وفقًا لوثائق Facebook الرسمية، للحصول على رمز وصول، يكون عنوان الطلب هو: https://graph.facebook.com/v19.0/oauth/access_token

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

5. الحصول على رمز الوصول بمجرد إعداد جميع العناصر التكوينية المذكورة أعلاه، يمكنك النقر على زر "الحصول على الرمز" للحصول على رمز الوصول.

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

بعد إدخال اسم المستخدم وكلمة المرور، سيطلب منك تأكيد الإذن.

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

الخطوة 4: الوصول إلى الموارد المفتوحة بناءً على الرمز باستخدام رمز الوصول (Token)، يمكنك الآن استخدامه للوصول إلى الموارد المفتوحة لـ Facebook. يمكنك رؤية الموارد المفتوحة المتاحة في واجهة برمجة تطبيقات Facebook Graph.

على سبيل المثال، تسترجع واجهة برمجة التطبيقات التالية معرف المستخدم واسم. إذا لم يعرض واجهتك أي شيء، قد تحتاج إلى التحقق مما إذا كانت لديك الأذونات اللازمة، كما هو مذكور في القسم 3 من "الخطوة 3"، ببساطة قم بإعدادها في النطاق. https://graph.facebook.com/v12.0/me?fields=id,name

عند إرسال طلب، سيقوم Apidog تلقائيًا بإرفاق الرمز إلى رأس التفويض وإرساله مضافًا إلى "Bearer".

إذا كنت تريد تضمين الرمز في عنوان URL، يمكنك أيضًا تعديل "إضافة الموقع" للرمز في خيارات التكوين على الصفحة، واختيار "معلمات الاستعلام".

الملخص

OAuth 2.0 هو بروتوكول تفويض مفتوح المعيار يسمح للتطبيقات الخارجية بالوصول الآمن إلى الموارد المحمية. عملية تفويض رمز التفويض هي طريقة تفويض شائعة تُستخدم بواسطة Facebook.

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