জাভাস্ক্রিপ্ট দিয়ে মাইক্রোসফ্ট ব্যবহার করে প্রমাণীকরণ করুন, জাভাস্ক্রিপ্ট দিয়ে মাইক্রোসফ্ট ব্যবহার করে প্রমাণীকরণ করুন

আপনি আপনার ব্যবহারকারীদেরকে Microsoft Azure Active Directory-এর মতো OAuth প্রদানকারী ব্যবহার করে Firebase-এর সাথে প্রমাণীকরণ করতে দিতে পারেন আপনার অ্যাপে জেনেরিক OAuth লগইন করে Firebase SDK ব্যবহার করে সাইন-ইন প্রবাহ শেষ করতে।

তুমি শুরু করার আগে

মাইক্রোসফ্ট অ্যাকাউন্ট (Azure অ্যাক্টিভ ডিরেক্টরি এবং ব্যক্তিগত Microsoft অ্যাকাউন্ট) ব্যবহার করে ব্যবহারকারীদের সাইন ইন করতে, আপনাকে প্রথমে আপনার Firebase প্রকল্পের জন্য একটি সাইন-ইন প্রদানকারী হিসাবে Microsoft সক্ষম করতে হবে:

1. আপনার JavaScript প্রকল্পে Firebase যোগ করুন ।
2. Firebase কনসোলে , Auth বিভাগটি খুলুন।
3. সাইন ইন পদ্ধতি ট্যাবে, Microsoft প্রদানকারী সক্ষম করুন।
4. সেই প্রদানকারীর ডেভেলপার কনসোল থেকে প্রদানকারী কনফিগারেশনে ক্লায়েন্ট আইডি এবং ক্লায়েন্ট সিক্রেট যোগ করুন:
   1. একটি Microsoft OAuth ক্লায়েন্ট নিবন্ধন করতে, Quickstart-এর নির্দেশাবলী অনুসরণ করুন: Azure Active Directory v2.0 endpoint এর সাথে একটি অ্যাপ নিবন্ধন করুন । মনে রাখবেন যে এই এন্ডপয়েন্ট Microsoft ব্যক্তিগত অ্যাকাউন্টগুলির পাশাপাশি Azure অ্যাক্টিভ ডিরেক্টরি অ্যাকাউন্টগুলি ব্যবহার করে সাইন-ইন সমর্থন করে৷ Azure Active Directory v2.0 সম্পর্কে আরও জানুন ।
   2. এই প্রোভাইডারদের সাথে অ্যাপ রেজিস্টার করার সময়, আপনার প্রোজেক্টের জন্য *.firebaseapp.com ডোমেনটিকে আপনার অ্যাপের রিডাইরেক্ট ডোমেন হিসেবে রেজিস্টার করতে ভুলবেন না।
5. Save এ ক্লিক করুন।

Firebase SDK দিয়ে সাইন-ইন ফ্লো পরিচালনা করুন

আপনি যদি একটি ওয়েব অ্যাপ তৈরি করেন, তাহলে আপনার ব্যবহারকারীদেরকে তাদের Microsoft অ্যাকাউন্ট ব্যবহার করে Firebase-এর মাধ্যমে প্রমাণীকরণ করার সবচেয়ে সহজ উপায় হল Firebase JavaScript SDK-এর মাধ্যমে সম্পূর্ণ সাইন-ইন প্রবাহ পরিচালনা করা।

Firebase JavaScript SDK দিয়ে সাইন-ইন প্রবাহ পরিচালনা করতে, এই ধাপগুলি অনুসরণ করুন:

1. প্রোভাইডার আইডি microsoft.com ব্যবহার করে একটি OAuthProvider- এর একটি উদাহরণ তৈরি করুন।

   Web modular API

   import { OAuthProvider } from "firebase/auth";
   
   const provider = new OAuthProvider('microsoft.com');
   auth_msft_create_provider.js

   Web namespaced API

   var provider = new firebase.auth.OAuthProvider('microsoft.com');
   microsoft-oauth.js

2. ঐচ্ছিক : অতিরিক্ত কাস্টম OAuth প্যারামিটার নির্দিষ্ট করুন যা আপনি OAuth অনুরোধের সাথে পাঠাতে চান।

   Web modular API

   provider.setCustomParameters({
     // Force re-consent.
     prompt: 'consent',
     // Target specific email with login hint.
     login_hint: 'user@firstadd.onmicrosoft.com'
   });
   auth_msft_provider_params.js

   Web namespaced API

   provider.setCustomParameters({
     // Force re-consent.
     prompt: 'consent',
     // Target specific email with login hint.
     login_hint: 'user@firstadd.onmicrosoft.com'
   });
   microsoft-oauth.js

   মাইক্রোসফ্ট সমর্থন করে প্যারামিটারগুলির জন্য, Microsoft OAuth ডকুমেন্টেশন দেখুন। মনে রাখবেন যে আপনি setCustomParameters() দিয়ে Firebase-প্রয়োজনীয় প্যারামিটার পাস করতে পারবেন না। এই প্যারামিটারগুলি হল client_id , response_type , redirect_uri , state , scope এবং response_mode ।

   শুধুমাত্র একটি নির্দিষ্ট Azure AD ভাড়াটে থেকে ব্যবহারকারীদের অ্যাপ্লিকেশনে সাইন ইন করার অনুমতি দেওয়ার জন্য, হয় Azure AD টেন্যান্টের বন্ধুত্বপূর্ণ ডোমেন নাম বা ভাড়াটেদের GUID শনাক্তকারী ব্যবহার করা যেতে পারে। কাস্টম প্যারামিটার অবজেক্টে "ভাড়াটে" ক্ষেত্রটি নির্দিষ্ট করে এটি করা যেতে পারে।

   Web modular API

   provider.setCustomParameters({
     // Optional "tenant" parameter in case you are using an Azure AD tenant.
     // eg. '8eaef023-2b34-4da1-9baa-8bc8c9d6a490' or 'contoso.onmicrosoft.com'
     // or "common" for tenant-independent tokens.
     // The default value is "common".
     tenant: 'TENANT_ID'
   });
   auth_msft_provider_params_tenant.js

   Web namespaced API

   provider.setCustomParameters({
     // Optional "tenant" parameter in case you are using an Azure AD tenant.
     // eg. '8eaef023-2b34-4da1-9baa-8bc8c9d6a490' or 'contoso.onmicrosoft.com'
     // or "common" for tenant-independent tokens.
     // The default value is "common".
     tenant: 'TENANT_ID'
   });
   microsoft-oauth.js

3. ঐচ্ছিক : মৌলিক প্রোফাইলের বাইরে অতিরিক্ত OAuth 2.0 স্কোপ নির্দিষ্ট করুন যা আপনি প্রমাণীকরণ প্রদানকারীর কাছ থেকে অনুরোধ করতে চান।

   provider.addScope('mail.read');
   provider.addScope('calendars.read');
   

   আরও জানতে, Microsoft অনুমতি এবং সম্মতি ডকুমেন্টেশন পড়ুন।

4. OAuth প্রদানকারী অবজেক্ট ব্যবহার করে Firebase দিয়ে প্রমাণীকরণ করুন। আপনি আপনার ব্যবহারকারীদের একটি পপ-আপ উইন্ডো খুলে বা সাইন-ইন পৃষ্ঠায় পুনঃনির্দেশ করে তাদের Microsoft অ্যাকাউন্টগুলির সাথে সাইন ইন করতে অনুরোধ করতে পারেন৷ রিডাইরেক্ট পদ্ধতি মোবাইল ডিভাইসে পছন্দ করা হয়।

   • একটি পপ-আপ উইন্ডো দিয়ে সাইন ইন করতে, signInWithPopup কল করুন:

   Web modular API

   import { getAuth, signInWithPopup, OAuthProvider } from "firebase/auth";
   
   const auth = getAuth();
   signInWithPopup(auth, provider)
     .then((result) => {
       // User is signed in.
       // IdP data available in result.additionalUserInfo.profile.
   
       // Get the OAuth access token and ID Token
       const credential = OAuthProvider.credentialFromResult(result);
       const accessToken = credential.accessToken;
       const idToken = credential.idToken;
     })
     .catch((error) => {
       // Handle error.
     });
   auth_msft_signin_popup.js

   Web namespaced API

   firebase.auth().signInWithPopup(provider)
     .then((result) => {
       // IdP data available in result.additionalUserInfo.profile.
       // ...
   
       /** @type {firebase.auth.OAuthCredential} */
       var credential = result.credential;
   
       // OAuth access and id tokens can also be retrieved:
       var accessToken = credential.accessToken;
       var idToken = credential.idToken;
     })
     .catch((error) => {
       // Handle error.
     });
   microsoft-oauth.js

   • সাইন-ইন পৃষ্ঠায় পুনঃনির্দেশ করে সাইন ইন করতে, signInWithRedirect কল করুন:

   signInWithRedirect , linkWithRedirect , অথবা reauthenticateWithRedirect ব্যবহার করার সময় সর্বোত্তম অনুশীলনগুলি অনুসরণ করুন৷

   Web modular API

   import { getAuth, signInWithRedirect } from "firebase/auth";
   
   const auth = getAuth();
   signInWithRedirect(auth, provider);
   auth_msft_signin_redirect.js

   Web namespaced API

   firebase.auth().signInWithRedirect(provider);
   microsoft-oauth.js

   ব্যবহারকারী সাইন-ইন সম্পূর্ণ করে পৃষ্ঠায় ফিরে আসার পরে, আপনি getRedirectResult এ কল করে সাইন-ইন ফলাফল পেতে পারেন।

   Web modular API

   import { getAuth, getRedirectResult, OAuthProvider } from "firebase/auth";
   
   const auth = getAuth();
   getRedirectResult(auth)
     .then((result) => {
       // User is signed in.
       // IdP data available in result.additionalUserInfo.profile.
   
       // Get the OAuth access token and ID Token
       const credential = OAuthProvider.credentialFromResult(result);
       const accessToken = credential.accessToken;
       const idToken = credential.idToken;
     })
     .catch((error) => {
       // Handle error.
     });
   auth_msft_signin_redirect_result.js

   Web namespaced API

   firebase.auth().getRedirectResult()
     .then((result) => {
       // IdP data available in result.additionalUserInfo.profile.
       // ...
   
       /** @type {firebase.auth.OAuthCredential} */
       var credential = result.credential;
   
       // OAuth access and id tokens can also be retrieved:
       var accessToken = credential.accessToken;
       var idToken = credential.idToken;
     })
     .catch((error) => {
       // Handle error.
     });
   microsoft-oauth.js

   সফলভাবে সম্পন্ন হলে, প্রদানকারীর সাথে যুক্ত OAuth অ্যাক্সেস টোকেন firebase.auth.UserCredential অবজেক্ট থেকে পুনরুদ্ধার করা যেতে পারে।

   OAuth অ্যাক্সেস টোকেন ব্যবহার করে, আপনি Microsoft Graph API কল করতে পারেন।

   উদাহরণস্বরূপ, মৌলিক প্রোফাইল তথ্য পেতে, নিম্নলিখিত REST API কল করা যেতে পারে:

   curl -i -H "Authorization: Bearer ACCESS_TOKEN" https://graph.microsoft.com/v1.0/me
   

   Firebase Auth দ্বারা সমর্থিত অন্যান্য প্রদানকারীদের থেকে ভিন্ন, Microsoft একটি ফটো URL প্রদান করে না এবং পরিবর্তে, একটি প্রোফাইল ছবির জন্য বাইনারি ডেটা Microsoft Graph API এর মাধ্যমে অনুরোধ করতে হবে।

   OAuth অ্যাক্সেস টোকেন ছাড়াও, ব্যবহারকারীর OAuth আইডি টোকেন firebase.auth.UserCredential অবজেক্ট থেকেও পুনরুদ্ধার করা যেতে পারে। আইডি টোকেনের sub -ক্লেইম অ্যাপ-নির্দিষ্ট এবং Firebase Auth দ্বারা ব্যবহৃত ফেডারেটেড ইউজার আইডেন্টিফায়ারের সাথে মেলে না এবং user.providerData[0].uid মাধ্যমে অ্যাক্সেসযোগ্য। পরিবর্তে oid দাবি ক্ষেত্র ব্যবহার করা উচিত. সাইন-ইন করার জন্য Azure AD ভাড়াটে ব্যবহার করার সময়, oid দাবিটি একটি সঠিক মিল হবে। তবে অ-ভাড়াটেদের ক্ষেত্রে, oid ক্ষেত্রটি প্যাডেড। একটি ফেডারেটেড ID 4b2eabcdefghijkl এর জন্য, oid একটি ফর্ম থাকবে 00000000-0000-0000-4b2e-abcdefghijkl ।

5. যদিও উপরের উদাহরণগুলি সাইন-ইন প্রবাহের উপর ফোকাস করে, আপনার কাছে linkWithPopup / linkWithRedirect ব্যবহার করে বিদ্যমান ব্যবহারকারীর সাথে একটি Microsoft প্রদানকারীকে লিঙ্ক করার ক্ষমতাও রয়েছে। উদাহরণস্বরূপ, আপনি একই ব্যবহারকারীর সাথে একাধিক প্রদানকারীকে লিঙ্ক করতে পারেন যাতে তাদের উভয়ের সাথে সাইন ইন করতে পারেন৷

   Web modular API

   import { getAuth, linkWithPopup, OAuthProvider } from "firebase/auth";
   
   const provider = new OAuthProvider('microsoft.com');
   const auth = getAuth();
   
   linkWithPopup(auth.currentUser, provider)
       .then((result) => {
         // Microsoft credential is linked to the current user.
         // IdP data available in result.additionalUserInfo.profile.
   
         // Get the OAuth access token and ID Token
         const credential = OAuthProvider.credentialFromResult(result);
         const accessToken = credential.accessToken;
         const idToken = credential.idToken;
       })
       .catch((error) => {
         // Handle error.
       });
   auth_msft_link_popup.js

   Web namespaced API

   var provider = new firebase.auth.OAuthProvider('microsoft.com');
   firebase.auth().currentUser.linkWithPopup(provider)
       .then((result) => {
         // Microsoft credential is linked to the current user.
         // IdP data available in result.additionalUserInfo.profile.
         // OAuth access token can also be retrieved:
         // result.credential.accessToken
         // OAuth ID token can also be retrieved:
         // result.credential.idToken
       })
       .catch((error) => {
         // Handle error.
       });
   microsoft-oauth.js

6. একই প্যাটার্ন reauthenticateWithPopup / reauthenticateWithRedirect এর সাথে ব্যবহার করা যেতে পারে যা সাম্প্রতিক লগইন প্রয়োজন এমন সংবেদনশীল অপারেশনগুলির জন্য নতুন শংসাপত্র পুনরুদ্ধার করতে ব্যবহার করা যেতে পারে।

   Web modular API

   import { getAuth, reauthenticateWithPopup, OAuthProvider } from "firebase/auth";
   
   const provider = new OAuthProvider('microsoft.com');
   const auth = getAuth();
   reauthenticateWithPopup(auth.currentUser, provider)
       .then((result) => {
         // User is re-authenticated with fresh tokens minted and
         // should be able to perform sensitive operations like account
         // deletion and email or password update.
         // IdP data available in result.additionalUserInfo.profile.
   
         // Get the OAuth access token and ID Token
         const credential = OAuthProvider.credentialFromResult(result);
         const accessToken = credential.accessToken;
         const idToken = credential.idToken;
       })
       .catch((error) => {
         // Handle error.
       });
   auth_msft_reauth_popup.js

   Web namespaced API

   var provider = new firebase.auth.OAuthProvider('microsoft.com');
   firebase.auth().currentUser.reauthenticateWithPopup(provider)
       .then((result) => {
         // User is re-authenticated with fresh tokens minted and
         // should be able to perform sensitive operations like account
         // deletion and email or password update.
         // IdP data available in result.additionalUserInfo.profile.
         // OAuth access token can also be retrieved:
         // result.credential.accessToken
         // OAuth ID token can also be retrieved:
         // result.credential.idToken
       })
       .catch((error) => {
         // Handle error.
       });
   microsoft-oauth.js

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

try {
  // Step 1: User tries to sign in using Microsoft.
  let result = await signInWithPopup(getAuth(), new OAuthProvider());
} catch (error) {
  // Step 2: User's email already exists.
  if (error.code === "auth/account-exists-with-different-credential") {
    // The pending Microsoft 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 Microsoft 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) {
  // ...
}

একটি Chrome এক্সটেনশনে Firebase দিয়ে প্রমাণীকরণ করুন

আপনি যদি একটি Chrome এক্সটেনশন অ্যাপ তৈরি করেন, অফস্ক্রিন ডকুমেন্টস গাইড দেখুন।

পরবর্তী পদক্ষেপ

একজন ব্যবহারকারী প্রথমবার সাইন ইন করার পরে, একটি নতুন ব্যবহারকারীর অ্যাকাউন্ট তৈরি করা হয় এবং শংসাপত্রগুলির সাথে লিঙ্ক করা হয়—অর্থাৎ, ব্যবহারকারীর নাম এবং পাসওয়ার্ড, ফোন নম্বর, বা প্রমাণ প্রদানকারীর তথ্য — ব্যবহারকারী সাইন ইন করেছেন। এই নতুন অ্যাকাউন্টটি আপনার ফায়ারবেস প্রকল্পের অংশ হিসাবে সংরক্ষণ করা হয়েছে এবং ব্যবহারকারী কীভাবে সাইন ইন করুন না কেন, আপনার প্রকল্পের প্রতিটি অ্যাপ জুড়ে একজন ব্যবহারকারীকে শনাক্ত করতে ব্যবহার করা যেতে পারে।

• আপনার অ্যাপে, আপনার ব্যবহারকারীর প্রমাণীকরণের স্থিতি জানার প্রস্তাবিত উপায় হল Auth অবজেক্টে একজন পর্যবেক্ষক সেট করা। তারপর আপনি User অবজেক্ট থেকে ব্যবহারকারীর মৌলিক প্রোফাইল তথ্য পেতে পারেন। ব্যবহারকারীদের পরিচালনা দেখুন।

• আপনার ফায়ারবেস রিয়েলটাইম ডেটাবেস এবং ক্লাউড স্টোরেজ সুরক্ষা নিয়মে , আপনি 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