सेटअप

अपनी वेबसाइट में 'Google से साइन इन करें', 'एक टैप करें' या 'अपने-आप साइन-इन' सुविधा को जोड़ने से पहले, अपना OAuth कॉन्फ़िगरेशन सेटअप करें. साथ ही, अपनी साइट के लिए कॉन्टेंट की सुरक्षा के बारे में नीति को कॉन्फ़िगर करना ज़रूरी नहीं है.

अपना Google API क्लाइंट आईडी पाना

अपनी वेबसाइट पर 'Google से साइन इन करें' सुविधा चालू करने के लिए, आपको सबसे पहले अपना Google API क्लाइंट आईडी सेट अप करना होगा. ऐसा करने के लिए, नीचे दिया गया तरीका अपनाएं:

  1. Google API कंसोल का क्रेडेंशियल पेज खोलें.
  2. Google API प्रोजेक्ट बनाएं या चुनें. अगर आपके पास 'Google से साइन इन करें' बटन या Google One Tap का कोई प्रोजेक्ट पहले से है, तो मौजूदा प्रोजेक्ट और वेब क्लाइंट आईडी का इस्तेमाल करें. प्रोडक्शन ऐप्लिकेशन बनाते समय, कई प्रोजेक्ट की ज़रूरत पड़ सकती है. मैनेज किए जा रहे हर प्रोजेक्ट के लिए, इस सेक्शन के बाकी चरणों को दोहराएं.
  3. क्रेडेंशियल बनाएं > OAuth क्लाइंट आईडी पर क्लिक करें. इसके बाद, ऐप्लिकेशन का टाइप दिखाने पर, नया क्लाइंट आईडी बनाने के लिए वेब ऐप्लिकेशन को चुनें. किसी मौजूदा क्लाइंट आईडी का इस्तेमाल करने के लिए, वेब ऐप्लिकेशन टाइप में से किसी एक को चुनें.

  4. अपनी वेबसाइट का यूआरआई, अनुमति वाले JavaScript ऑरिजिन में जोड़ें. यूआरआई में सिर्फ़ स्कीम और पूरी तरह क्वालिफ़ाइड होस्टनेम शामिल होता है. उदाहरण के लिए, https://www.example.com.

  5. इसके अलावा, क्रेडेंशियल को JavaScript कॉलबैक के बजाय, आपके होस्ट किए गए एंडपॉइंट पर रीडायरेक्ट करने वाले यूआरएल का इस्तेमाल करके लौटाया जा सकता है. अगर ऐसा है, तो अपने रीडायरेक्ट यूआरआई को अनुमति वाले रीडायरेक्ट यूआरआई में जोड़ें. रीडायरेक्ट यूआरआई में स्कीम, पूरी तरह क्वालिफ़ाइड होस्टनेम, और पाथ शामिल होता है. साथ ही, यह रीडायरेक्ट यूआरआई की पुष्टि करने के नियमों के मुताबिक होना चाहिए. उदाहरण के लिए, https://www.example.com/auth-receiver.

'Google से साइन इन करें' और One Tap की मदद से पुष्टि करने की सुविधा, दोनों में सहमति वाली स्क्रीन शामिल होती है. इससे उपयोगकर्ताओं को पता चलता है कि ऐप्लिकेशन ने उनका डेटा ऐक्सेस करने के लिए किस तरह का डेटा मांगा है और उन्हें कौनसी शर्तें लागू करनी हैं.

  1. Google Developer Console के एपीआई और सेवाएं सेक्शन का OAuth की सहमति वाली स्क्रीन पेज खोलें.
  2. अगर आपसे कहा जाए, तो अभी-अभी बनाया गया प्रोजेक्ट चुनें.

  3. "OAuth की सहमति वाली स्क्रीन" पेज पर, फ़ॉर्म भरें और "सेव करें" बटन पर क्लिक करें.

    1. ऐप्लिकेशन का नाम: सहमति मांगने वाले ऐप्लिकेशन का नाम. नाम से आपके ऐप्लिकेशन के बारे में सही जानकारी मिलनी चाहिए. साथ ही, यह उस ऐप्लिकेशन के नाम से मेल खाना चाहिए जो उपयोगकर्ताओं को कहीं और दिखता है.

    2. ऐप्लिकेशन का लोगो: यह इमेज सहमति वाली स्क्रीन पर दिखाई जाती है, ताकि उपयोगकर्ता आपके ऐप्लिकेशन को पहचान सकें. यह लोगो, 'Google से साइन इन करें' स्क्रीन और खाता सेटिंग पर दिखता है. हालांकि, इसे One Tap के डायलॉग बॉक्स में नहीं दिखाया जाता है.

    3. सहायता ईमेल: यह उपयोगकर्ता सहायता के लिए सहमति वाली स्क्रीन पर दिखाया जाता है. यह G Suite एडमिन को दिखाया जाता है कि अपने उपयोगकर्ताओं के लिए आपके ऐप्लिकेशन के ऐक्सेस का आकलन किया जा रहा है या नहीं. जब उपयोगकर्ता ऐप्लिकेशन के नाम पर क्लिक करता है, तब 'Google से साइन इन करें' की सहमति वाली स्क्रीन पर, उपयोगकर्ताओं को यह ईमेल पता दिखता है.

    4. Google API के दायरे: दायरे में आपके ऐप्लिकेशन को उपयोगकर्ता के निजी डेटा को ऐक्सेस करने की अनुमति मिलती है. पुष्टि करने के लिए, डिफ़ॉल्ट दायरा (ईमेल, प्रोफ़ाइल, Openid) काफ़ी है. आपको संवेदनशील स्कोप जोड़ने की ज़रूरत नहीं है. आम तौर पर, बड़े पैमाने पर दायरे के लिए अनुरोध करना सबसे अच्छा तरीका है. ऐसा उस समय किया जाता है जब ऐक्सेस की ज़रूरत होती है, न कि पहले से बड़े पैमाने पर. ज़्यादा जानें

    5. अनुमति वाले डोमेन: आपको और आपके उपयोगकर्ताओं को सुरक्षित रखने के लिए, Google सिर्फ़ उन ऐप्लिकेशन को अनुमति वाले डोमेन इस्तेमाल करने की अनुमति देता है जो OAuth का इस्तेमाल करके पुष्टि करते हैं. आपके ऐप्लिकेशन के लिंक, अनुमति वाले डोमेन पर होस्ट किए जाने चाहिए. ज़्यादा जानें.

    6. ऐप्लिकेशन का होम पेज लिंक: यह 'Google से साइन इन करें' के लिए सहमति वाली स्क्रीन पर दिखता है. साथ ही, यह "इस रूप में जारी रखें" बटन के तहत, जीडीपीआर का पालन करने वाले डिसक्लेमर की जानकारी पर दिखता है. किसी ऐसे डोमेन पर होस्ट किया गया होना चाहिए जिसे अनुमति मिली हुई है.

    7. ऐप्लिकेशन की निजता नीति का लिंक: "इस रूप में जारी रखें" बटन के नीचे, 'Google से साइन इन करें' वाली सहमति स्क्रीन और एक टैप में जीडीपीआर का पालन करने वाले डिसक्लेमर की जानकारी दिखती है. किसी ऐसे डोमेन पर होस्ट किया गया होना चाहिए जिसे अनुमति मिली हुई है.

    8. आवेदन की सेवा की शर्तों का लिंक (ज़रूरी नहीं): "इस रूप में जारी रखें" बटन के नीचे, 'Google से साइन इन करें' वाली स्क्रीन पर और जीडीपीआर का पालन करने वाले डिसक्लेमर की जानकारी पर दिखाया जाता है. किसी ऐसे डोमेन पर होस्ट किया गया होना चाहिए जिसे अनुमति मिली हुई है.

  4. "पुष्टि की स्थिति" चुनें. अगर आपके आवेदन के लिए पुष्टि की ज़रूरत है, तो "पुष्टि के लिए सबमिट करें" बटन पर क्लिक करें. इससे आवेदन की पुष्टि हो जाएगी. ज़्यादा जानकारी के लिए, OAuth की पुष्टि करने की ज़रूरी शर्तें देखें.

साइन इन करने के दौरान OAuth सेटिंग दिखाना

FedCM का इस्तेमाल करके One Tap

FedCM का इस्तेमाल करके Chrome One Tap पर दिखाई गई OAuth सहमति सेटिंग

Chrome में उपयोगकर्ता की सहमति के दौरान, टॉप लेवल अनुमति वाला डोमेन दिखता है.

FedCM के बिना One Tap

One Tap की मदद से दिखाई गई OAuth सहमति सेटिंग

ऐप्लिकेशन का नाम, उपयोगकर्ता की सहमति के दौरान दिखाया जाता है.

पहला डायग्राम. Chrome में One Tap की मदद से, OAuth के लिए सहमति की सेटिंग दिखाई जा रही हैं.

कॉन्टेंट की सुरक्षा के बारे में नीति

हालांकि, आपके ऐप्लिकेशन को सुरक्षित रखने और क्रॉस-साइट स्क्रिप्टिंग (XSS) हमले को रोकने के लिए, कॉन्टेंट की सुरक्षा के बारे में नीति का सुझाव दिया जाता है. हालांकि, ऐसा करना ज़रूरी नहीं है. ज़्यादा जानने के लिए, सीएसपी के बारे में जानकारी और सीएसपी और XSS के बारे में जानकारी देखें.

आपके कॉन्टेंट की सुरक्षा नीति में एक या उससे ज़्यादा डायरेक्टिव शामिल हो सकते हैं, जैसे कि connect-src, frame-src, script-src, style-src या default-src.

अगर आपके सीएसपी में ये चीज़ें शामिल हैं:

  • connect-src डायरेक्टिव, https://accounts.google.com/gsi/ जोड़ें, ताकि किसी पेज को Google Identity Services के सर्वर-साइड एंडपॉइंट के लिए पैरंट यूआरएल लोड करने की अनुमति मिल सके.
  • frame-src डायरेक्टिव, एक टैप और 'Google से साइन इन करें' बटन iframe के पैरंट यूआरएल को अनुमति देने के लिए, https://accounts.google.com/gsi/ जोड़ें.
  • script-src डायरेक्टिव, Google Identity Services की JavaScript लाइब्रेरी के यूआरएल को अनुमति देने के लिए, https://accounts.google.com/gsi/client जोड़ें.
  • style-src डायरेक्टिव, https://accounts.google.com/gsi/style जोड़ें, ताकि Google Identity Services की स्टाइलशीट के यूआरएल को अनुमति दी जा सके.
  • अगर किसी default-src डायरेक्टिव का इस्तेमाल किया जाता है, तो यह फ़ॉलबैक के तौर पर होता है. ऐसा तब होता है, जब पिछले किसी डायरेक्टिव (connect-src, frame-src, script-src या style-src) के बारे में नहीं बताया गया हो, तो https://accounts.google.com/gsi/ जोड़ें. इससे, पेज को Google Identity Services के सर्वर-साइड पॉइंट के लिए पैरंट यूआरएल लोड करने की अनुमति देने में मदद मिलती है.

connect-src का इस्तेमाल करते समय, अलग-अलग GIS यूआरएल की सूची बनाने से बचें. इससे GIS को अपडेट करते समय होने वाली रुकावटों को कम करने में मदद मिलती है. उदाहरण के लिए, https://accounts.google.com/gsi/status जोड़ने के बजाय, GIS पैरंट यूआरएल 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 (सीओओपी) में बदलाव करना पड़ सकता है.

FedCM के चालू होने पर, ब्राउज़र सीधे पॉप-अप रेंडर करता है. इसमें किसी बदलाव की ज़रूरत नहीं होती.

हालांकि, FedCM के बंद होने पर, COOP हेडर सेट करें:

  • same-origin और
  • same-origin-allow-popups शामिल करें.

विंडो के बीच सही हेडर ब्रेक कम्यूनिकेशन सेट न कर पाने से, खाली पॉप-अप विंडो या मिलती-जुलती गड़बड़ियां हो जाती हैं.