تنظيم صفحاتك في مجموعات
يمكنك حفظ المحتوى وتصنيفه حسب إعداداتك المفضّلة.
تتولّى خدمة "تسجيل الدخول باستخدام حساب Google" إدارة مسار OAuth 2.0 ودورة حياة الرمز المميّز، ما يسهّل عملية الدمج مع Google APIs. يمكن للمستخدم في أي وقت
إبطال إذن الوصول إلى أي تطبيق.
يوضّح هذا المستند كيفية إكمال عملية دمج أساسية لميزة "تسجيل الدخول باستخدام Google".
إنشاء بيانات اعتماد التفويض
يجب أن يتضمّن أي تطبيق يستخدم بروتوكول OAuth 2.0 للوصول إلى Google APIs بيانات اعتماد تفويض
تحدّد التطبيق لخادم OAuth 2.0 من Google. توضّح الخطوات التالية كيفية إنشاء بيانات اعتماد لمشروعك. يمكن لتطبيقاتك بعد ذلك استخدام بيانات الاعتماد للوصول إلى واجهات برمجة التطبيقات التي فعّلتها لهذا المشروع.
بعد اكتمال عملية الإعداد، دوِّن معرّف العميل الذي تم إنشاؤه.
ستحتاج إلى رقم تعريف العميل لإكمال الخطوات التالية. (يتم أيضًا إنشاء سر عميل، ولكنك تحتاج إليه فقط لإجراء عمليات من جهة الخادم).
تحميل مكتبة Google Platform
يجب تضمين مكتبة Google Platform في صفحات الويب التي تتضمّن ميزة "تسجيل الدخول باستخدام حساب Google".
أسهل طريقة لإضافة زر "تسجيل الدخول باستخدام حساب Google" إلى موقعك الإلكتروني هي استخدام زر تسجيل دخول يتم عرضه تلقائيًا. باستخدام بضعة أسطر فقط من الرمز البرمجي، يمكنك إضافة زر يتم إعداده تلقائيًا ليتضمّن النص والشعار والألوان المناسبة لحالة تسجيل الدخول للمستخدم والنطاقات التي تطلبها.
لإنشاء زر "تسجيل الدخول باستخدام حساب Google" يستخدِم الإعدادات التلقائية، أضِف عنصر div
بالفئة g-signin2 إلى صفحة تسجيل الدخول:
بعد تسجيل دخول المستخدم باستخدام حساب Google والنطاقات التلقائية، يمكنك الوصول إلى رقم تعريف المستخدم على Google واسمه وعنوان URL الخاص بملفه الشخصي وعنوان بريده الإلكتروني.
لاسترداد معلومات الملف الشخصي لمستخدم، استخدِم طريقة
getBasicProfile().
يمكنك السماح للمستخدمين بتسجيل الخروج من تطبيقك بدون تسجيل الخروج من Google من خلال إضافة زر أو رابط تسجيل خروج إلى موقعك الإلكتروني. لإنشاء رابط تسجيل خروج، أرفِق دالة تستدعي الطريقة GoogleAuth.signOut() بحدث onclick الخاص بالرابط.
<ahref="#"onclick="signOut();">Signout</a>
<script>
functionsignOut(){varauth2=gapi.auth2.getAuthInstance();auth2.signOut().then(function(){console.log('User signed out.');});}
</script>
تاريخ التعديل الأخير: 2025-08-31 (حسب التوقيت العالمي المتفَّق عليه)
[[["يسهُل فهم المحتوى.","easyToUnderstand","thumb-up"],["ساعَدني المحتوى في حلّ مشكلتي.","solvedMyProblem","thumb-up"],["غير ذلك","otherUp","thumb-up"]],[["لا يحتوي على المعلومات التي أحتاج إليها.","missingTheInformationINeed","thumb-down"],["الخطوات معقدة للغاية / كثيرة جدًا.","tooComplicatedTooManySteps","thumb-down"],["المحتوى قديم.","outOfDate","thumb-down"],["ثمة مشكلة في الترجمة.","translationIssue","thumb-down"],["مشكلة في العيّنات / التعليمات البرمجية","samplesCodeIssue","thumb-down"],["غير ذلك","otherDown","thumb-down"]],["تاريخ التعديل الأخير: 2025-08-31 (حسب التوقيت العالمي المتفَّق عليه)"],[[["\u003cp\u003eGoogle Sign-In is being deprecated; developers should consult the Deprecation and Sunset guide for more information and migration strategies.\u003c/p\u003e\n"],["\u003cp\u003eTo integrate Google Sign-In, you must create authorization credentials in the Google Developers Console and include the Google Platform Library in your web pages.\u003c/p\u003e\n"],["\u003cp\u003eYou can easily add a Google Sign-In button using a provided HTML snippet and retrieve basic user profile information after sign-in.\u003c/p\u003e\n"],["\u003cp\u003eFor server-side authentication, it is crucial to use ID tokens instead of relying on Google IDs or profile information directly.\u003c/p\u003e\n"],["\u003cp\u003eUsers can sign out of your application without signing out of Google using the provided sign-out method.\u003c/p\u003e\n"]]],[],null,["| **Warning:** The Google Sign-In library optionally uses FedCM APIs, and their use will become a requirement. [Conduct an impact assessment](/identity/sign-in/web/gsi-with-fedcm) to confirm that user sign-in continues to function as expected. \n|\nSupport for the Google Sign-In library is deprecated, see the [Deprecation and Sunset](/identity/sign-in/web/deprecation-and-sunset) guide for more. \n\nGoogle Sign-In manages the OAuth 2.0 flow and token lifecycle,\nsimplifying your integration with Google APIs. A user always has the option to\n[revoke access](https://myaccount.google.com/permissions) to an\napplication at any time.\n\nThis document describes how to complete a basic Google Sign-In integration.\n\nCreate authorization credentials\n\nAny application that uses OAuth 2.0 to access Google APIs must have authorization credentials\nthat identify the application to Google's OAuth 2.0 server. The following steps explain how to\ncreate credentials for your project. Your applications can then use the credentials to access APIs\nthat you have enabled for that project.\n\n1. Go to the [Clients page](https://console.developers.google.com/auth/clients).\n2. Click **Create Client**.\n3. Select the **Web application** application type.\n4. Name your OAuth 2.0 client and click **Create**\n\nAfter configuration is complete, take note of the client ID that was created.\nYou will need the client ID to complete the next steps. (A client secret is also\ncreated, but you need it only for server-side operations.)\n\nLoad the Google Platform Library\n\nYou must include the Google Platform Library on your web pages that integrate\nGoogle Sign-In. \n\n \u003cscript src=\"https://apis.google.com/js/platform.js\" async defer\u003e\u003c/script\u003e\n\nSpecify your app's client ID\n\nSpecify the client ID you created for your app in the Google Developers Console\nwith the `google-signin-client_id` meta element. \n\n```\n\u003cmeta name=\"google-signin-client_id\" content=\"YOUR_CLIENT_ID.apps.googleusercontent.com\"\u003e\n```\n| **Note:** You can also specify your app's client ID with the `client_id` parameter of the [`gapi.auth2.init()`](/identity/sign-in/web/reference#gapiauth2initparams) method.\n\nAdd a Google Sign-In button\n\nThe easiest way to add a Google Sign-In button to your site is to use an\nautomatically rendered sign-in button. With only a few lines of code, you can\nadd a button that automatically configures itself to have the appropriate text,\nlogo, and colors for the sign-in state of the user and the scopes you request.\n\nTo create a Google Sign-In button that uses the default settings, add a `div`\nelement with the class `g-signin2` to your sign-in page: \n\n \u003cdiv class=\"g-signin2\" data-onsuccess=\"onSignIn\"\u003e\u003c/div\u003e\n\nGet profile information\n\nAfter you have signed in a user with Google using the default scopes, you can\naccess the user's Google ID, name, profile URL, and email address.\n\nTo retrieve profile information for a user, use the\n[`getBasicProfile()`](/identity/sign-in/web/reference#googleusergetbasicprofile)\nmethod. \n\n function onSignIn(googleUser) {\n var profile = googleUser.getBasicProfile();\n console.log('ID: ' + profile.getId()); // Do not send to your backend! Use an ID token instead.\n console.log('Name: ' + profile.getName());\n console.log('Image URL: ' + profile.getImageUrl());\n console.log('Email: ' + profile.getEmail()); // This is null if the 'email' scope is not present.\n }\n\n| **Important:** Do not use the Google IDs returned by `getId()` or the user's profile information to communicate the currently signed in user to your backend server. Instead, [send ID tokens](/identity/sign-in/web/backend-auth), which can be securely validated on the server.\n\nSign out a user\n\nYou can enable users to sign out of your app without signing out of Google by\nadding a sign-out button or link to your site. To create a sign-out link, attach\na function that calls the\n[`GoogleAuth.signOut()`](/identity/sign-in/web/reference#googleauthsignout)\nmethod to the link's `onclick` event. \n\n \u003ca href=\"#\" onclick=\"signOut();\"\u003eSign out\u003c/a\u003e\n \u003cscript\u003e\n function signOut() {\n var auth2 = gapi.auth2.getAuthInstance();\n auth2.signOut().then(function () {\n console.log('User signed out.');\n });\n }\n \u003c/script\u003e"]]
