ওয়েবসাইটগুলিতে ফায়ারবেস প্রমাণীকরণ দিয়ে শুরু করুন

আপনি ইমেল ঠিকানা এবং পাসওয়ার্ড সাইন-ইন এবং গুগল সাইন-ইন এবং ফেসবুক লগইনের মতো ফেডারেটেড পরিচয় সরবরাহকারী সহ এক বা একাধিক সাইন-ইন পদ্ধতি ব্যবহার করে আপনার অ্যাপ্লিকেশনটিতে সাইন ইন করার জন্য ব্যবহারকারীগণ ফায়ারবেস প্রমাণীকরণ ব্যবহার করতে পারেন। এই টিউটোরিয়ালটি আপনার অ্যাপটিতে ইমেল ঠিকানা এবং পাসওয়ার্ড সাইন ইন কীভাবে যুক্ত করবেন তা দেখিয়ে আপনি ফায়ারবেস প্রমাণীকরণ দিয়ে শুরু করেছিলেন started

আপনার অ্যাপ্লিকেশনটিকে ফায়ারবেসে সংযুক্ত করুন

Firebase SDK এর ইনস্টল করুন । বর্ণিত হিসাবে কনফিগারেশন কোডটি আপনার ওয়েব পৃষ্ঠায় পেস্ট করতে ভুলবেন না।

(Ptionচ্ছিক) ফায়ারবেস লোকাল এমুলেটর স্যুট সহ প্রোটোটাইপ এবং পরীক্ষা করুন

আপনার অ্যাপ কীভাবে ব্যবহারকারীদের অনুমোদন দেয় সে সম্পর্কে কথা বলার আগে আসুন আপনি প্রোটোটাইপ এবং প্রমাণীকরণ কার্যকারিতা পরীক্ষা করতে ব্যবহার করতে পারেন এমন সরঞ্জামগুলির একটি সেট প্রবর্তন করুন: ফায়ারবেস লোকাল এমুলেটর স্যুট। যদি আপনি প্রমাণীকরণ কৌশল এবং সরবরাহকারীদের মধ্যে সিদ্ধান্ত নিচ্ছেন, প্রমাণীকরণ এবং ফায়ারবেস সুরক্ষা বিধিগুলি ব্যবহার করে অথবা সরকারী ইন সাইন-ইন ইউআই ডিজাইন ব্যবহার করে জনসাধারণ এবং ব্যক্তিগত ডেটা সহ বিভিন্ন ডেটা মডেলগুলি চেষ্টা করে দেখা, সরাসরি পরিষেবাদি স্থাপন না করে স্থানীয়ভাবে কাজ করতে সক্ষম হওয়া দুর্দান্ত ধারণা হতে পারে ।

একটি প্রমাণীকরণ এমুলেটর লোকাল এমুলেটর স্যুটের অংশ, যা আপনার অ্যাপ্লিকেশনটিকে এমুলেটেড ডাটাবেস সামগ্রী এবং কনফিগারেশনের পাশাপাশি বিকল্পভাবে আপনার এমুলেটেড প্রকল্পের সংস্থানগুলি (ফাংশন, অন্যান্য ডাটাবেস এবং সুরক্ষা বিধি) সক্ষম করে।

প্রমাণীকরণ এমুলেটর ব্যবহার করা মাত্র কয়েকটি পদক্ষেপ জড়িত:

  1. এমুলেটরটির সাথে সংযোগ রাখতে আপনার অ্যাপ্লিকেশনটির পরীক্ষা কনফিগারেশনে কোডের একটি লাইন যুক্ত করা।
  2. আপনার স্থানীয় প্রকল্প ডিরেক্টরি রুট, দৌড়ানো থেকে firebase emulators:start
  3. ইন্টারেক্টিভ প্রোটোটাইপিংয়ের জন্য স্থানীয় এমুলেটর স্যুট ইউআই বা অ-ইন্টারেক্টিভ পরীক্ষার জন্য প্রমাণীকরণ এমুলেটর REST এপিআই ব্যবহার করে।

একটি বিস্তারিত গাইড পাওয়া যাবে কানেক্ট প্রমাণীকরণ এমুলেটর এ আপনার অ্যাপ্লিকেশান । আরো তথ্যের জন্য, দেখুন স্থানীয় এমুলেটর সুইট ভূমিকা

এখন আসুন কীভাবে ব্যবহারকারীদের প্রমাণীকরণ করবেন তা চালিয়ে নেওয়া যাক।

নতুন ব্যবহারকারীদের সাইন আপ করুন

এমন একটি ফর্ম তৈরি করুন যা নতুন ব্যবহারকারীদের তাদের ইমেল ঠিকানা এবং একটি পাসওয়ার্ড ব্যবহার করে আপনার অ্যাপ্লিকেশনটিতে নিবন্ধভুক্ত করতে দেয়। একটি ব্যবহারকারী ফর্ম সমাপ্ত হলে, ইমেইল ঠিকানা এবং পাসওয়ার্ড ব্যবহারকারী দ্বারা উপলব্ধ যাচাই, তারপর তাদের পাস createUserWithEmailAndPassword পদ্ধতি:

ওয়েব ভি 8

firebase.auth().createUserWithEmailAndPassword(email, password)
  .then((userCredential) => {
    // Signed in 
    var user = userCredential.user;
    // ...
  })
  .catch((error) => {
    var errorCode = error.code;
    var errorMessage = error.message;
    // ..
  });

ওয়েব ভি 9

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

const auth = getAuth();
createUserWithEmailAndPassword(auth, email, password)
  .then((userCredential) => {
    // Signed in 
    const user = userCredential.user;
    // ...
  })
  .catch((error) => {
    const errorCode = error.code;
    const errorMessage = error.message;
    // ..
  });

বিদ্যমান ব্যবহারকারীদের সাইন ইন করুন

এমন একটি ফর্ম তৈরি করুন যা বিদ্যমান ব্যবহারকারীদের তাদের ইমেল ঠিকানা এবং পাসওয়ার্ড ব্যবহার করে সাইন ইন করতে দেয়। একটি ব্যবহারকারী ফর্ম সমাপ্ত হলে, কল signInWithEmailAndPassword পদ্ধতি:

ওয়েব ভি 8

firebase.auth().signInWithEmailAndPassword(email, password)
  .then((userCredential) => {
    // Signed in
    var user = userCredential.user;
    // ...
  })
  .catch((error) => {
    var errorCode = error.code;
    var errorMessage = error.message;
  });

ওয়েব ভি 9

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

const auth = getAuth();
signInWithEmailAndPassword(auth, email, password)
  .then((userCredential) => {
    // Signed in 
    const user = userCredential.user;
    // ...
  })
  .catch((error) => {
    const errorCode = error.code;
    const errorMessage = error.message;
  });

একটি প্রমাণীকরণ রাষ্ট্র পর্যবেক্ষক সেট করুন এবং ব্যবহারকারীর ডেটা পান

আপনার অ্যাপ্লিকেশন এর প্রতিটি পৃষ্ঠার জন্য যা সাইন ইন থাকা ব্যবহারকারী সম্পর্কে তথ্য প্রয়োজন, বৈশ্বিক প্রমাণীকরণ বস্তুর সাথে একটি পর্যবেক্ষক সংযুক্ত করুন। এই পর্যবেক্ষক যখনই ব্যবহারকারীর সাইন ইন অবস্থায় পরিবর্তন হয় তখনই ডেকে আনা হয়।

পর্যবেক্ষক ব্যবহার সংযুক্ত করুন onAuthStateChanged পদ্ধতি। যখন কোনও ব্যবহারকারী সাফল্যের সাথে সাইন ইন করে, আপনি পর্যবেক্ষকের মধ্যে ব্যবহারকারী সম্পর্কে তথ্য পেতে পারেন।

ওয়েব ভি 8

firebase.auth().onAuthStateChanged((user) => {
  if (user) {
    // User is signed in, see docs for a list of available properties
    // https://firebase.google.com/docs/reference/js/firebase.User
    var uid = user.uid;
    // ...
  } else {
    // User is signed out
    // ...
  }
});

ওয়েব ভি 9

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

const auth = getAuth();
onAuthStateChanged(auth, (user) => {
  if (user) {
    // User is signed in, see docs for a list of available properties
    // https://firebase.google.com/docs/reference/js/firebase.User
    const uid = user.uid;
    // ...
  } else {
    // User is signed out
    // ...
  }
});

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

অন্যান্য পরিচয় সরবরাহকারী এবং বেনামে অতিথি অ্যাকাউন্টগুলির জন্য কীভাবে সমর্থন যুক্ত করবেন তা শিখুন: