इस पेज का अनुवाद Cloud Translation API से किया गया है.

JavaScript के साथ GitHub का इस्तेमाल करके पुष्टि करें

अपने ऐप्लिकेशन में GitHub से पुष्टि करने की सुविधा को जोड़कर, उपयोगकर्ताओं को Firebase से पुष्टि करने की सुविधा दी जा सकती है. साइन-इन फ़्लो को पूरा करने के लिए, Firebase SDK टूल का इस्तेमाल करके या GitHub OAuth 2.0 फ़्लो को मैन्युअल तरीके से चलाकर, Firebase को ऐक्सेस टोकन पास करके, GitHub से पुष्टि करने की सुविधा इंटिग्रेट की जा सकती है.

वेब कंटेनर इंस्टॉल करने से पहले

Firebase को अपने JavaScript प्रोजेक्ट में जोड़ें.
Firebase कंसोल में, पुष्टि करें सेक्शन खोलें.
साइन इन करने का तरीका टैब पर, GitHub सेवा देने वाली कंपनी को चालू करें.
सेवा देने वाली कंपनी के डेवलपर कंसोल से, Client-ID और क्लाइंट सीक्रेट जोड़ें:
1. GitHub पर डेवलपर ऐप्लिकेशन के तौर पर अपने ऐप्लिकेशन को रजिस्टर करें और अपने ऐप्लिकेशन का OAuth 2.0 क्लाइंट आईडी और क्लाइंट सीक्रेट पाएं.
2. पक्का करें कि आपका Firebase OAuth रीडायरेक्ट यूआरआई (उदाहरण के लिए, my-app-12345.firebaseapp.com/__/auth/handler) आपके GitHub ऐप्लिकेशन के कॉन्फ़िगरेशन पर आपके ऐप्लिकेशन के सेटिंग पेज पर, आपके ऑथराइज़ेशन कॉलबैक यूआरएल के तौर पर सेट है.
सेव करें पर क्लिक करें.

Firebase SDK टूल की मदद से साइन-इन की प्रोसेस को मैनेज करना

अगर आप कोई वेब ऐप्लिकेशन बना रहे हैं, तो अपने उपयोगकर्ताओं के GitHub खातों का इस्तेमाल करके Firebase की पुष्टि करने का सबसे आसान तरीका यह है कि वे Firebase JavaScript SDK टूल की मदद से साइन-इन फ़्लो को मैनेज करें. (अगर आपको Node.js या बिना ब्राउज़र वाले एनवायरमेंट में किसी उपयोगकर्ता की पुष्टि करनी है, तो आपको मैन्युअल तरीके से साइन-इन फ़्लो मैनेज करना होगा.)

Firebase JavaScript SDK टूल से साइन इन फ़्लो को मैनेज करने के लिए, यह तरीका अपनाएं:

GitHub प्रोवाइडर ऑब्जेक्ट का इंस्टेंस बनाएं:
वेब मॉड्यूलर एपीआई

ट्री-शेक किए जा सकने वाले मॉड्यूलर वेब एपीआई के बारे में ज़्यादा जानें और नेमस्पेसेड एपीआई से अपग्रेड करें.
```
import { GithubAuthProvider } from "firebase/auth";

const provider = new GithubAuthProvider();auth_github_provider_create.js
```
वेब नेमस्पेसेड एपीआई
```
var provider = new firebase.auth.GithubAuthProvider();github.js
```
ज़रूरी नहीं: OAuth 2.0 के ऐसे अन्य दायरे तय करें जिनका अनुरोध आपको पुष्टि करने वाली कंपनी से करना है. स्कोप जोड़ने के लिए, addScope को कॉल करें. उदाहरण के लिए:
वेब मॉड्यूलर एपीआई

ट्री-शेक किए जा सकने वाले मॉड्यूलर वेब एपीआई के बारे में ज़्यादा जानें और नेमस्पेसेड एपीआई से अपग्रेड करें.
```
provider.addScope('repo');auth_github_provider_scopes.js
```
वेब नेमस्पेसेड एपीआई
```
provider.addScope('repo');github.js
```
पुष्टि करने की सेवा देने वाली कंपनी का दस्तावेज़ देखें.
ज़रूरी नहीं: कस्टम OAuth प्रोवाइडर के ऐसे अतिरिक्त पैरामीटर तय करें जिन्हें आपको OAuth अनुरोध के साथ भेजना है. कोई कस्टम पैरामीटर जोड़ने के लिए, शुरू की गई सेवा देने वाली कंपनी के उस ऑब्जेक्ट के साथ setCustomParameters को कॉल करें जिसमें वह कुंजी मौजूद हो जो OAuth की सेवा देने वाली कंपनी के दस्तावेज़ और उससे जुड़ी वैल्यू में बताया गया हो. उदाहरण के लिए:
वेब मॉड्यूलर एपीआई

ट्री-शेक किए जा सकने वाले मॉड्यूलर वेब एपीआई के बारे में ज़्यादा जानें और नेमस्पेसेड एपीआई से अपग्रेड करें.
```
provider.setCustomParameters({
  'allow_signup': 'false'
});auth_github_provider_params.js
```
वेब नेमस्पेसेड एपीआई
```
provider.setCustomParameters({
  'allow_signup': 'false'
});github.js
```
रिज़र्व किए गए ज़रूरी OAuth पैरामीटर की अनुमति नहीं है. इन्हें अनदेखा कर दिया जाएगा. ज़्यादा जानकारी के लिए, पुष्टि करने वाली कंपनी का रेफ़रंस देखें.
GitHub प्रोवाइडर ऑब्जेक्ट का इस्तेमाल करके, Firebase से पुष्टि करें. उपयोगकर्ताओं से पॉप-अप विंडो खोलकर या साइन-इन पेज पर रीडायरेक्ट करके, उनके GitHub खातों से साइन इन करने के लिए कहा जा सकता है. मोबाइल डिवाइस पर रीडायरेक्ट करने के तरीके को प्राथमिकता दी जाती है.
- पॉप-अप विंडो की मदद से साइन इन करने के लिए, signInWithPopup पर कॉल करें:
  वेब मॉड्यूलर एपीआई
  
  ट्री-शेक किए जा सकने वाले मॉड्यूलर वेब एपीआई के बारे में ज़्यादा जानें और नेमस्पेसेड एपीआई से अपग्रेड करें.
```
import { getAuth, signInWithPopup, GithubAuthProvider } from "firebase/auth";

const auth = getAuth();
signInWithPopup(auth, provider)
  .then((result) => {
    // This gives you a GitHub Access Token. You can use it to access the GitHub API.
    const credential = GithubAuthProvider.credentialFromResult(result);
    const token = credential.accessToken;

    // The signed-in user info.
    const user = result.user;
    // IdP data available using getAdditionalUserInfo(result)
    // ...
  }).catch((error) => {
    // Handle Errors here.
    const errorCode = error.code;
    const errorMessage = error.message;
    // The email of the user's account used.
    const email = error.customData.email;
    // The AuthCredential type that was used.
    const credential = GithubAuthProvider.credentialFromError(error);
    // ...
  });auth_github_signin_popup.js
```
  वेब नेमस्पेसेड एपीआई
```
firebase
  .auth()
  .signInWithPopup(provider)
  .then((result) => {
    /** @type {firebase.auth.OAuthCredential} */
    var credential = result.credential;

    // This gives you a GitHub Access Token. You can use it to access the GitHub API.
    var token = credential.accessToken;

    // The signed-in user info.
    var user = result.user;
    // IdP data available in result.additionalUserInfo.profile.
      // ...
  }).catch((error) => {
    // Handle Errors here.
    var errorCode = error.code;
    var errorMessage = error.message;
    // The email of the user's account used.
    var email = error.email;
    // The firebase.auth.AuthCredential type that was used.
    var credential = error.credential;
    // ...
  });github.js
```
  यह भी ध्यान रखें कि GitHub सेवा देने वाली कंपनी के OAuth टोकन को वापस लाया जा सकता है. इसका इस्तेमाल, GitHub API का इस्तेमाल करके ज़्यादा डेटा फ़ेच करने के लिए किया जा सकता है.
  यहां पर गड़बड़ियों का पता लगाकर उन्हें ठीक भी किया जा सकता है. गड़बड़ी कोड की सूची के लिए, आधिकारिक रेफ़रंस दस्तावेज़ पर एक नज़र डालें.
- साइन-इन पेज पर रीडायरेक्ट करके साइन इन करने के लिए, signInWithRedirect को कॉल करें: `signInWithredirect` का इस्तेमाल करते समय सबसे सही तरीके अपनाएं.
  वेब मॉड्यूलर एपीआई
  
  ट्री-शेक किए जा सकने वाले मॉड्यूलर वेब एपीआई के बारे में ज़्यादा जानें और नेमस्पेसेड एपीआई से अपग्रेड करें.
```
import { getAuth, signInWithRedirect } from "firebase/auth";

const auth = getAuth();
signInWithRedirect(auth, provider);auth_signin_redirect.js
```
  वेब नेमस्पेसेड एपीआई
```
firebase.auth().signInWithRedirect(provider);index.js
```
  इसके बाद, पेज लोड होने पर getRedirectResult को कॉल करके, GitHub की सेवा देने वाली कंपनी का OAuth टोकन भी वापस पाया जा सकता है:
  वेब मॉड्यूलर एपीआई
  
  ट्री-शेक किए जा सकने वाले मॉड्यूलर वेब एपीआई के बारे में ज़्यादा जानें और नेमस्पेसेड एपीआई से अपग्रेड करें.
```
import { getAuth, getRedirectResult, GithubAuthProvider } from "firebase/auth";

const auth = getAuth();
getRedirectResult(auth)
  .then((result) => {
    const credential = GithubAuthProvider.credentialFromResult(result);
    if (credential) {
      // This gives you a GitHub Access Token. You can use it to access the GitHub API.
      const token = credential.accessToken;
      // ...
    }

    // The signed-in user info.
    const user = result.user;
    // IdP data available using getAdditionalUserInfo(result)
    // ...
  }).catch((error) => {
    // Handle Errors here.
    const errorCode = error.code;
    const errorMessage = error.message;
    // The email of the user's account used.
    const email = error.customData.email;
    // The AuthCredential type that was used.
    const credential = GithubAuthProvider.credentialFromError(error);
    // ...
  });auth_github_signin_redirect_result.js
```
  वेब नेमस्पेसेड एपीआई
```
firebase.auth()
  .getRedirectResult()
  .then((result) => {
    if (result.credential) {
      /** @type {firebase.auth.OAuthCredential} */
      var credential = result.credential;

      // This gives you a GitHub Access Token. You can use it to access the GitHub API.
      var token = credential.accessToken;
      // ...
    }

    // The signed-in user info.
    var user = result.user;
    // IdP data available in result.additionalUserInfo.profile.
      // ...
  }).catch((error) => {
    // Handle Errors here.
    var errorCode = error.code;
    var errorMessage = error.message;
    // The email of the user's account used.
    var email = error.email;
    // The firebase.auth.AuthCredential type that was used.
    var credential = error.credential;
    // ...
  });github.js
```
  यहां पर गड़बड़ियों का पता लगाकर उन्हें ठीक भी किया जा सकता है. गड़बड़ी कोड की सूची के लिए, आधिकारिक रेफ़रंस दस्तावेज़ पर एक नज़र डालें.

अलग-अलग क्रेडेंशियल के साथ खाता-मौजूद है से जुड़ी गड़बड़ियों को मैनेज करना

अगर आपने Firebase कंसोल में हर ईमेल पते के लिए एक खाता सेटिंग चालू की है, तो जब कोई उपयोगकर्ता किसी सेवा देने वाली कंपनी (जैसे कि GitHub) में किसी ऐसे ईमेल के साथ साइन इन करने की कोशिश करता है जो Firebase का इस्तेमाल करने वाले दूसरे व्यक्ति (जैसे, Google) के लिए पहले से मौजूद है, तो गड़बड़ीauth/account-exists-with-different-credential के साथ AuthCredential ऑब्जेक्ट (GitHub ऐक्सेस टोकन) दिखेगा. सेवा देने वाली अनुमानित कंपनी में साइन इन करने के लिए, उपयोगकर्ता को पहले मौजूदा कंपनी (Google) में साइन इन करना होगा. इसके बाद, उसे पहले वाले AuthCredential (GitHub ऐक्सेस टोकन) से लिंक करना होगा.

signInWithPopup का इस्तेमाल करने पर, कोड से auth/account-exists-with-different-credential गड़बड़ियों को ठीक किया जा सकता है. इसका उदाहरण नीचे दिया गया है:

import {
  getAuth,
  linkWithCredential,
  signInWithPopup,
  GitHubAuthProvider,
} from "firebase/auth";

try {
  // Step 1: User tries to sign in using GitHub.
  let result = await signInWithPopup(getAuth(), new GitHubAuthProvider());
} catch (error) {
  // Step 2: User's email already exists.
  if (error.code === "auth/account-exists-with-different-credential") {
    // The pending GitHub credential.
    let pendingCred = error.credential;

    // Step 3: Save the pending credential in temporary storage,

    // Step 4: Let the user know that they already have an account
    // but with a different provider, and let them choose another
    // sign-in method.
  }
}

// ...

try {
  // Step 5: Sign the user in using their chosen method.
  let result = await signInWithPopup(getAuth(), userSelectedProvider);

  // Step 6: Link to the GitHub credential.
  // TODO: implement `retrievePendingCred` for your app.
  let pendingCred = retrievePendingCred();

  if (pendingCred !== null) {
    // As you have access to the pending credential, you can directly call the
    // link method.
    let user = await linkWithCredential(result.user, pendingCred);
  }

  // Step 7: Continue to app.
} catch (error) {
  // ...
}

रीडायरेक्ट मोड

इस गड़बड़ी को रीडायरेक्ट मोड में इसी तरह से हैंडल किया जाता है. इसमें अंतर यह है कि पेज के रीडायरेक्ट के बीच पेंडिंग क्रेडेंशियल को कैश मेमोरी में सेव किया जाता है (उदाहरण के लिए, सेशन स्टोरेज का इस्तेमाल करके).

साइन-इन की प्रोसेस को मैन्युअल तरीके से मैनेज करना

GitHub खाते का इस्तेमाल करके, Firebase से पुष्टि की जा सकती है कि साइन-इन फ़्लो को मैनेज करने के लिए, GitHub OAuth 2.0 एंडपॉइंट को कॉल किया जा सकता है या नहीं:

डेवलपर के दस्तावेज़ में दिए गए निर्देशों का पालन करके, अपने ऐप्लिकेशन में GitHub की पुष्टि करने की सुविधा को इंटिग्रेट करें. GitHub साइन इन फ़्लो के खत्म होने पर, आपको OAuth 2.0 का ऐक्सेस टोकन मिलेगा.
अगर आपको Node.js ऐप्लिकेशन पर साइन इन करना है, तो Node.js ऐप्लिकेशन पर OAuth ऐक्सेस टोकन भेजें.
जब कोई उपयोगकर्ता GitHub से साइन इन कर ले, तब Firebase क्रेडेंशियल के लिए, OAuth 2.0 ऐक्सेस टोकन को एक्सचेंज करें:
वेब मॉड्यूलर एपीआई

ट्री-शेक किए जा सकने वाले मॉड्यूलर वेब एपीआई के बारे में ज़्यादा जानें और नेमस्पेसेड एपीआई से अपग्रेड करें.
```
import { GithubAuthProvider } from "firebase/auth";

const credential = GithubAuthProvider.credential(token);auth_github_provider_credential.js
```
वेब नेमस्पेसेड एपीआई
```
var credential = firebase.auth.GithubAuthProvider.credential(token);github.js
```

Firebase क्रेडेंशियल का इस्तेमाल करके, Firebase से पुष्टि करें:

वेब मॉड्यूलर एपीआई

import { getAuth, signInWithCredential } from "firebase/auth";

// Sign in with the credential from the user.
const auth = getAuth();
signInWithCredential(auth, credential)
  .then((result) => {
    // Signed in 
    // ...
  })
  .catch((error) => {
    // Handle Errors here.
    const errorCode = error.code;
    const errorMessage = error.message;
    // The email of the user's account used.
    const email = error.customData.email;
    // ...
  });auth_signin_credential.js

वेब नेमस्पेसेड एपीआई

// Sign in with the credential from the user.
firebase.auth()
  .signInWithCredential(credential)
  .then((result) => {
    // Signed in 
    // ...
  })
  .catch((error) => {
    // Handle Errors here.
    const errorCode = error.code;
    const errorMessage = error.message;
    // The email of the user's account used.
    const email = error.email;
    // ...
  });index.js

Chrome एक्सटेंशन में Firebase की मदद से पुष्टि करें

अगर आप Chrome एक्सटेंशन ऐप्लिकेशन बना रहे हैं, तो ऑफ़स्क्रीन दस्तावेज़ गाइड देखें.

प्रोजेक्ट बनाते समय, Firebase आपके प्रोजेक्ट के लिए एक यूनीक सबडोमेन का प्रावधान करेगा: https://my-app-12345.firebaseapp.com.

इसका इस्तेमाल, OAuth में साइन इन करने के लिए रीडायरेक्ट करने के तरीके के तौर पर भी किया जाएगा. उस डोमेन को उन सभी OAuth कंपनियों के लिए अनुमति दी जानी चाहिए जिन पर OAuth की सेवा काम करती है. हालांकि, इसका मतलब है कि GitHub में साइन इन करते समय, उपयोगकर्ताओं को ऐप्लिकेशन पर वापस रीडायरेक्ट करने से पहले वह डोमेन दिख सकता है: जारी रखें: https://my-app-12345.firebaseapp.com.

अगर आपको अपना सबडोमेन नहीं दिखाना है, तो Firebase होस्टिंग की मदद से, कस्टम डोमेन सेट अप करें:

अपने डोमेन को होस्टिंग के लिए सेट अप करना में पहले से लेकर तीसरे चरण तक का पालन करें. जब आप अपने डोमेन के मालिकाना हक की पुष्टि करते हैं, तो होस्टिंग सेवा आपके कस्टम डोमेन के लिए एक एसएसएल सर्टिफ़िकेट का प्रावधान करती है.
Firebase कंसोल में मौजूद अनुमति वाले डोमेन की सूची में अपना कस्टम डोमेन जोड़ें: auth.custom.domain.com.
GitHub डेवलपर कंसोल या OAuth सेटअप पेज में, रीडायरेक्ट पेज के यूआरएल को वाइटलिस्ट करें. रीडायरेक्ट पेज को आपके कस्टम डोमेन से ऐक्सेस किया जा सकेगा: https://auth.custom.domain.com/__/auth/handler.

JavaScript लाइब्रेरी शुरू करते समय, authDomain फ़ील्ड का इस्तेमाल करके अपना कस्टम डोमेन बताएं:

var config = {
  apiKey: '...',
  // Changed from 'my-app-12345.firebaseapp.com'.
  authDomain: 'auth.custom.domain.com',
  databaseURL: 'https://my-app-12345.firebaseio.com',
  projectId: 'my-app-12345',
  storageBucket: 'my-app-12345.appspot.com',
  messagingSenderId: '1234567890'
};
firebase.initializeApp(config);

अगले चरण

जब कोई उपयोगकर्ता पहली बार साइन इन करता है, तो एक नया उपयोगकर्ता खाता बनाया जाता है और उपयोगकर्ता के क्रेडेंशियल से लिंक किया जाता है. इन क्रेडेंशियल में उपयोगकर्ता नाम और पासवर्ड, फ़ोन नंबर या पुष्टि करने वाली सेवा की जानकारी शामिल है. यह नया खाता आपके Firebase प्रोजेक्ट के हिस्से के तौर पर सेव किया जाता है. साथ ही, इसका इस्तेमाल आपके प्रोजेक्ट के हर ऐप्लिकेशन में किसी उपयोगकर्ता की पहचान करने के लिए किया जा सकता है. भले ही, उपयोगकर्ता ने किसी भी तरह से साइन इन किया हो.

हमारा सुझाव है कि आप अपने ऐप्लिकेशन में, उपयोगकर्ता की पुष्टि की स्थिति जानने के लिए Auth ऑब्जेक्ट पर एक ऑब्ज़र्वर सेट करें. इसके बाद, User ऑब्जेक्ट से उपयोगकर्ता की प्रोफ़ाइल की बुनियादी जानकारी पाई जा सकती है. उपयोगकर्ताओं को मैनेज करें देखें.
अपने Firebase रीयल टाइम डेटाबेस और Cloud Storage के सुरक्षा नियमों में, auth वैरिएबल से साइन-इन किए हुए उपयोगकर्ता का यूनीक यूज़र आईडी पाया जा सकता है और उसका इस्तेमाल करके यह कंट्रोल किया जा सकता है कि उपयोगकर्ता कौनसा डेटा ऐक्सेस कर सकता है.

आप पुष्टि करने वाली सेवा देने वाली कंपनियों के क्रेडेंशियल को किसी मौजूदा उपयोगकर्ता खाते से लिंक करके, उपयोगकर्ताओं को अपने ऐप्लिकेशन में साइन इन करने की अनुमति दे सकते हैं.

किसी उपयोगकर्ता को साइन आउट करने के लिए, signOut पर कॉल करें:

वेब मॉड्यूलर एपीआई

import { getAuth, signOut } from "firebase/auth";

const auth = getAuth();
signOut(auth).then(() => {
  // Sign-out successful.
}).catch((error) => {
  // An error happened.
});auth_sign_out.js

वेब नेमस्पेसेड एपीआई

firebase.auth().signOut().then(() => {
  // Sign-out successful.
}).catch((error) => {
  // An error happened.
});index.js

JavaScript के साथ GitHub का इस्तेमाल करके पुष्टि करें

वेब कंटेनर इंस्टॉल करने से पहले

Firebase SDK टूल की मदद से साइन-इन की प्रोसेस को मैनेज करना

वेब मॉड्यूलर एपीआई

वेब नेमस्पेसेड एपीआई

वेब मॉड्यूलर एपीआई

वेब नेमस्पेसेड एपीआई

वेब मॉड्यूलर एपीआई

वेब नेमस्पेसेड एपीआई

वेब मॉड्यूलर एपीआई

वेब नेमस्पेसेड एपीआई

वेब मॉड्यूलर एपीआई

वेब नेमस्पेसेड एपीआई

वेब मॉड्यूलर एपीआई

वेब नेमस्पेसेड एपीआई

अलग-अलग क्रेडेंशियल के साथ खाता-मौजूद है से जुड़ी गड़बड़ियों को मैनेज करना

पॉप-अप मोड

रीडायरेक्ट मोड

साइन-इन की प्रोसेस को मैन्युअल तरीके से मैनेज करना

वेब मॉड्यूलर एपीआई

वेब नेमस्पेसेड एपीआई

वेब मॉड्यूलर एपीआई

वेब नेमस्पेसेड एपीआई

Chrome एक्सटेंशन में Firebase की मदद से पुष्टि करें

GitHub में साइन इन करने के लिए रीडायरेक्ट डोमेन को पसंद के मुताबिक बनाना

अगले चरण

वेब मॉड्यूलर एपीआई

वेब नेमस्पेसेड एपीआई