Google Sign-In, OAuth 2.0 फ़्लो और टोकन के लाइफ़साइकल को मैनेज करता है. इससे Google API के साथ इंटिग्रेशन करना आसान हो जाता है. उपयोगकर्ता के पास किसी भी समय, किसी ऐप्लिकेशन का ऐक्सेस वापस लेने का विकल्प होता है.
इस दस्तावेज़ में, Google से साइन इन करने की सुविधा को बुनियादी तौर पर इंटिग्रेट करने का तरीका बताया गया है.
अनुमति देने वाले क्रेडेंशियल बनाना
Google APIs को ऐक्सेस करने के लिए OAuth 2.0 का इस्तेमाल करने वाले किसी भी ऐप्लिकेशन के पास अनुमति देने वाले क्रेडेंशियल होने चाहिए. इनसे Google के OAuth 2.0 सर्वर पर ऐप्लिकेशन की पहचान होती है. यहां दिए गए तरीके से, अपने प्रोजेक्ट के लिए क्रेडेंशियल बनाए जा सकते हैं. इसके बाद, आपके ऐप्लिकेशन इन क्रेडेंशियल का इस्तेमाल करके, उन एपीआई को ऐक्सेस कर सकते हैं जिन्हें आपने उस प्रोजेक्ट के लिए चालू किया है.
- Go to the Clients page.
- क्लाइंट बनाएं पर क्लिक करें.
- ऐप्लिकेशन टाइप के तौर पर वेब ऐप्लिकेशन चुनें.
- अपने OAuth 2.0 क्लाइंट का नाम डालें और बनाएं पर क्लिक करें
कॉन्फ़िगरेशन पूरा होने के बाद, बनाए गए क्लाइंट आईडी को नोट कर लें. अगले चरण पूरे करने के लिए, आपको क्लाइंट आईडी की ज़रूरत होगी. (एक क्लाइंट सीक्रेट भी बनाया जाता है, लेकिन आपको इसकी ज़रूरत सिर्फ़ सर्वर-साइड कार्रवाइयों के लिए होती है.)
Google Platform Library लोड करना
आपको अपने उन वेब पेजों पर Google Platform Library को शामिल करना होगा जिन पर Google Sign-In को इंटिग्रेट किया गया है.
<script src="https://apis.google.com/js/platform.js" async defer></script>
अपने ऐप्लिकेशन का क्लाइंट आईडी डालें
Google Developers Console में अपने ऐप्लिकेशन के लिए बनाए गए क्लाइंट आईडी को google-signin-client_id
मेटा एलिमेंट के साथ तय करें.
<meta name="google-signin-client_id" content="YOUR_CLIENT_ID.apps.googleusercontent.com">
'Google से साइन इन करें' बटन जोड़ना
अपनी साइट पर 'Google से साइन इन करें' बटन जोड़ने का सबसे आसान तरीका यह है कि अपने-आप रेंडर होने वाले साइन-इन बटन का इस्तेमाल किया जाए. कोड की कुछ ही लाइनों की मदद से, ऐसा बटन जोड़ा जा सकता है जो उपयोगकर्ता की साइन-इन स्थिति और आपके अनुरोध किए गए स्कोप के हिसाब से, अपने-आप सही टेक्स्ट, लोगो, और रंगों के साथ कॉन्फ़िगर हो जाता है.
डिफ़ॉल्ट सेटिंग का इस्तेमाल करने वाला Google पर साइन इन करने का बटन बनाने के लिए, अपने साइन-इन पेज पर div
एलिमेंट जोड़ें. साथ ही, क्लास g-signin2
जोड़ें:
<div class="g-signin2" data-onsuccess="onSignIn"></div>
प्रोफ़ाइल की जानकारी पाना
डिफ़ॉल्ट स्कोप का इस्तेमाल करके, Google से किसी उपयोगकर्ता के साइन इन करने के बाद, उसके Google आईडी, नाम, प्रोफ़ाइल यूआरएल, और ईमेल पते को ऐक्सेस किया जा सकता है.
किसी उपयोगकर्ता की प्रोफ़ाइल की जानकारी वापस पाने के लिए, getBasicProfile()
तरीके का इस्तेमाल करें.
function onSignIn(googleUser) {
var profile = googleUser.getBasicProfile();
console.log('ID: ' + profile.getId()); // Do not send to your backend! Use an ID token instead.
console.log('Name: ' + profile.getName());
console.log('Image URL: ' + profile.getImageUrl());
console.log('Email: ' + profile.getEmail()); // This is null if the 'email' scope is not present.
}
किसी उपयोगकर्ता को साइन आउट करना
उपयोगकर्ताओं को Google से साइन आउट किए बिना, आपके ऐप्लिकेशन से साइन आउट करने की सुविधा दी जा सकती है. इसके लिए, अपनी साइट पर साइन-आउट बटन या लिंक जोड़ें. साइन आउट करने का लिंक बनाने के लिए, एक ऐसा फ़ंक्शन अटैच करें जो लिंक के onclick
इवेंट पर GoogleAuth.signOut()
तरीके को कॉल करता हो.
<a href="#" onclick="signOut();">Sign out</a>
<script>
function signOut() {
var auth2 = gapi.auth2.getAuthInstance();
auth2.signOut().then(function () {
console.log('User signed out.');
});
}
</script>