الإعداد

لإضافة زر "تسجيل الدخول باستخدام حساب Google" أو إشعارات "بنقرة واحدة" و"تسجيل الدخول تلقائيًا" إلى موقعك الإلكتروني، عليك أولاً اتّباع الخطوات التالية:

1. الحصول على معرّف عميل OAuth 2.0
2. ضبط إعدادات وهوية العلامة التجارية لبروتوكول OAuth
3. تحميل مكتبة برامج Google Identity Services،
4. يمكنك اختياريًا إعداد "سياسة أمان المحتوى" و
5. تعديل "السياسة المحدّدة لفتح المستندات المشتركة المصدر"

الحصول على معرّف عميل Google API

لتفعيل "خدمات هوية Google" على موقعك الإلكتروني، عليك أولاً إعداد معرّف عميل Google API. لإجراء ذلك، يُرجى إكمال الخطوات التالية:

1. افتح صفحة "العملاء" في Google Cloud Console.
2. أنشئ مشروعًا على Cloud Console أو اختَر مشروعًا حاليًا. إذا كان لديك مشروع حالي لزر "تسجيل الدخول باستخدام حساب Google" أو ميزة "النقرة الواحدة من Google"، استخدِم المشروع الحالي ومعرّف عميل الويب. عند إنشاء تطبيقات إنتاج، قد يكون من الضروري إنشاء مشاريع متعددة، لذا كرِّر الخطوات المتبقية في هذا القسم لكل مشروع تديره.
3. انقر على إنشاء عميل، ثم اختَر تطبيق الويب في حقل نوع التطبيق لإنشاء معرّف عميل جديد. لاستخدام معرّف عميل حالي، اختَر معرّفًا من النوع تطبيق ويب.

4. أضِف معرّف الموارد المنتظم (URI) لموقعك الإلكتروني إلى مصادر JavaScript المسموح بها. يتضمّن معرّف الموارد الموحّد المخطط واسم المضيف المؤهَّل بالكامل فقط. على سبيل المثال، https://www.example.com.

5. يمكنك بدلاً من ذلك إرجاع بيانات الاعتماد باستخدام عملية إعادة توجيه إلى نقطة نهاية تستضيفها بدلاً من استخدام دالة ردّ JavaScript. في هذه الحالة، أضِف معرّفات الموارد المنتظمة (URI) لإعادة التوجيه إلى معرّفات الموارد المنتظمة (URI) المعتمَدة لإعادة التوجيه. تتضمّن معرّفات الموارد المنتظمة (URI) الخاصة بإعادة التوجيه المخطط واسم المضيف المؤهّل بالكامل والمسار، ويجب أن تتوافق مع قواعد التحقّق من صحة معرّف الموارد المنتظم (URI) الخاص بإعادة التوجيه. على سبيل المثال، https://www.example.com/auth-receiver.

أدرِج معرّف العميل في تطبيق الويب باستخدام الحقلَين data-client_id أو client_id.

ضبط شاشة طلب الموافقة المتعلّقة ببروتوكول OAuth

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

1. افتح صفحة "العلامة التجارية" في قسم "منصة Google للمصادقة" ضمن Cloud Console.
2. إذا طُلب منك ذلك، اختَر المشروع الذي أنشأته للتو.

3. في صفحة "العلامة التجارية"، املأ النموذج وانقر على الزر "حفظ".

   1. اسم التطبيق: اسم التطبيق الذي يطلب الموافقة. يجب أن يعبّر الاسم بدقّة عن تطبيقك وأن يكون متوافقًا مع اسم التطبيق الذي يظهر للمستخدمين في أماكن أخرى.

   2. شعار التطبيق: تظهر هذه الصورة على شاشة طلب الموافقة لمساعدة المستخدمين في التعرّف على تطبيقك. يظهر الشعار على شاشة الموافقة الخاصة بخدمة "تسجيل الدخول باستخدام حساب Google" وعلى إعدادات الحساب، ولكنّه لا يظهر في مربّع الحوار "نقرة واحدة".

   3. عنوان البريد الإلكتروني المخصّص للدعم: يظهر على شاشة طلب الموافقة المخصّصة لدعم المستخدمين، ويظهر أيضًا لمشرفي حسابات Google Workspace الذين يقيّمون إمكانية وصول المستخدمين إلى تطبيقك. يظهر عنوان البريد الإلكتروني هذا للمستخدمين على شاشة طلب الموافقة "تسجيل الدخول باستخدام حساب Google" عندما ينقر المستخدم على اسم التطبيق.

   4. النطاقات المعتمَدة: لحمايتك وحماية المستخدمين، لا تسمح Google إلا للتطبيقات التي تتم مصادقتها باستخدام OAuth باستخدام النطاقات المعتمَدة. يجب أن تكون روابط تطبيقاتك مستضافة على نطاقات معتمَدة. مزيد من المعلومات

   5. رابط الصفحة الرئيسية للتطبيق: يظهر على شاشة طلب الموافقة "تسجيل الدخول باستخدام حساب Google" ومعلومات إخلاء المسؤولية المتوافقة مع اللائحة العامة لحماية البيانات (GDPR) في ميزة "نقرة واحدة" ضمن الزر "المتابعة باسم". يجب أن تتم استضافته على نطاق معتمَد.

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

   7. رابط بنود خدمة التطبيق (اختياري): يظهر على شاشة طلب الموافقة على "تسجيل الدخول باستخدام Google" ومعلومات إخلاء المسؤولية المتوافقة مع اللائحة العامة لحماية البيانات (GDPR) في ميزة "النقرة الواحدة" ضمن الزر "المتابعة باسم". يجب أن تتم استضافته على نطاق معتمَد.

4. انتقِل إلى صفحة "الوصول إلى البيانات" لإعداد نطاقات تطبيقك.

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

5. تحقَّق من "حالة التحقّق"، وإذا كان طلبك بحاجة إلى التحقّق، انقر على الزر "إرسال طلب التحقّق" لإرسال طلبك. يُرجى الاطّلاع على متطلبات إثبات الأهلية في OAuth للحصول على التفاصيل.

عرض إعدادات OAuth أثناء تسجيل الدخول

الشكل 1: إعدادات موافقة OAuth التي تعرضها ميزة "نقرة واحدة" في Chrome

تحميل مكتبة البرامج

احرص على تحميل مكتبة برامج Google Identity Services على أي صفحة قد يسجّل المستخدم الدخول إليها. استخدِم مقتطف الرمز التالي:

<script src="https://accounts.google.com/gsi/client" async></script>

يمكنك تحسين سرعة تحميل صفحاتك إذا حمّلت النص البرمجي باستخدام السمة async.

راجِع مراجع واجهة برمجة التطبيقات HTML وJavaScript للاطّلاع على قائمة بالطرق والسمات التي تتوافق معها المكتبة.

سياسة أمان المحتوى

على الرغم من أنّ سياسة أمان المحتوى اختيارية، ننصحك باستخدامها لتأمين تطبيقك ومنع الهجمات التي تستخدم النصوص البرمجية على المواقع الإلكترونية (XSS). لمزيد من المعلومات، يمكنك الاطّلاع على مقدمة عن سياسة أمان المحتوى وسياسة أمان المحتوى والهجمات التي تستخدم النصوص البرمجية على المواقع الإلكترونية (XSS).

قد تتضمّن "سياسة أمان المحتوى" توجيهًا واحدًا أو أكثر، مثل connect-src أو frame-src أو script-src أو style-src أو default-src.

إذا كان موفّر خدمة السحابة الإلكترونية يتضمّن ما يلي:

• connect-src توجيه، أضِف https://accounts.google.com/gsi/ للسماح للصفحة بتحميل عنوان URL الرئيسي لنقاط نهاية من جهة الخادم في "خدمات هوية Google".
• frame-src توجيه، أضِف https://accounts.google.com/gsi/ للسماح بعنوان URL الرئيسي لإطارات iframe الخاصة بزرّي نقرة واحدة و"تسجيل الدخول باستخدام حساب Google".
• script-src، أضِف https://accounts.google.com/gsi/client للسماح بعنوان URL الخاص بمكتبة JavaScript الخاصة بخدمات Google Identity.
• في توجيه style-src، أضِف https://accounts.google.com/gsi/style للسماح بعنوان URL الخاص بأوراق أنماط "خدمات هوية Google".
• في حال استخدام التوجيه default-src، يكون هذا التوجيه بديلاً في حال عدم تحديد أي من التوجيهات السابقة (connect-src أو frame-src أو script-src أو style-src)، ويجب إضافة https://accounts.google.com/gsi/ للسماح للصفحة بتحميل عنوان URL الرئيسي لنقاط نهاية من جهة الخادم في "خدمات هوية Google".

تجنَّب إدراج عناوين URL فردية لنظام المعلومات الجغرافية عند استخدام connect-src. يساعد ذلك في تقليل حالات الفشل عند تعديل نظام المعلومات الجغرافية. على سبيل المثال، بدلاً من إضافة https://accounts.google.com/gsi/status استخدِم عنوان URL الرئيسي لنظام معلومات جغرافية https://accounts.google.com/gsi/.

يسمح عنوان الاستجابة المثال هذا لخدمات Google Identity Services بالتحميل والتنفيذ بنجاح:

Content-Security-Policy-Report-Only: script-src
https://accounts.google.com/gsi/client; frame-src
https://accounts.google.com/gsi/; connect-src https://accounts.google.com/gsi/;

السياسة المحدّدة لفتح المستندات المشتركة المصدر

قد يتطلّب زرّ "تسجيل الدخول باستخدام حساب Google" وGoogle One Tap إجراء تغييرات على Cross-Origin-Opener-Policy (COOP) من أجل إنشاء النوافذ المنبثقة بنجاح.

عند تفعيل FedCM، يعرض المتصفّح النوافذ المنبثقة مباشرةً، ولا يلزم إجراء أي تغييرات.

ومع ذلك، عند إيقاف FedCM، اضبط عنوان COOP على النحو التالي:

• إلى same-origin و
• تضمين same-origin-allow-popups

يؤدي عدم ضبط العنوان المناسب إلى تعذُّر التواصل بين النوافذ، ما يؤدي إلى ظهور نافذة منبثقة فارغة أو أخطاء مشابهة.