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

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

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

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

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

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

একটি প্রমাণীকরণ এমুলেটর স্থানীয় এমুলেটর স্যুটের অংশ, যা আপনার অ্যাপকে এমুলেটেড ডাটাবেস বিষয়বস্তু এবং কনফিগার, সেইসাথে optionচ্ছিকভাবে আপনার অনুকরণকৃত প্রকল্প সম্পদ (ফাংশন, অন্যান্য ডেটাবেস এবং নিরাপত্তা নিয়ম) এর সাথে যোগাযোগ করতে সক্ষম করে।

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

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

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

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

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

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

ওয়েব সংস্করণ 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;
    // ..
  });

ওয়েব সংস্করণ 8

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

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

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

ওয়েব সংস্করণ 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;
  });

ওয়েব সংস্করণ 8

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

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

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

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

ওয়েব সংস্করণ 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
    // ...
  }
});

ওয়েব সংস্করণ 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
    // ...
  }
});

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

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