আপনার ওয়েব অ্যাপে Google সাইন-ইন সংহত করা হচ্ছে

Google সাইন-ইন OAuth 2.0 ফ্লো এবং টোকেন লাইফসাইকেল পরিচালনা করে, Google API-এর সাথে আপনার একীকরণকে সহজ করে। একজন ব্যবহারকারীর কাছে সর্বদা যেকোন সময় একটি অ্যাপ্লিকেশনে অ্যাক্সেস প্রত্যাহার করার বিকল্প থাকে।

এই দস্তাবেজটি বর্ণনা করে কিভাবে একটি মৌলিক Google সাইন-ইন ইন্টিগ্রেশন সম্পূর্ণ করতে হয়।

অনুমোদনের শংসাপত্র তৈরি করুন

Google APIগুলি অ্যাক্সেস করতে OAuth 2.0 ব্যবহার করে এমন যেকোনো অ্যাপ্লিকেশনের অনুমোদনের শংসাপত্র থাকতে হবে যা Google-এর OAuth 2.0 সার্ভারে অ্যাপ্লিকেশনটিকে সনাক্ত করে৷ নিম্নলিখিত ধাপগুলি ব্যাখ্যা করে কিভাবে আপনার প্রকল্পের জন্য শংসাপত্র তৈরি করতে হয়। আপনার অ্যাপ্লিকেশনগুলি তারপরে সেই প্রকল্পের জন্য সক্ষম করা APIগুলি অ্যাক্সেস করতে শংসাপত্রগুলি ব্যবহার করতে পারে৷

  1. Go to the Credentials page.
  2. ক্রেডেনশিয়াল তৈরি করুন > OAuth ক্লায়েন্ট আইডি ক্লিক করুন।
  3. ওয়েব অ্যাপ্লিকেশন অ্যাপ্লিকেশন প্রকার নির্বাচন করুন.
  4. আপনার OAuth 2.0 ক্লায়েন্টের নাম দিন এবং তৈরি করুন ক্লিক করুন

কনফিগারেশন সম্পূর্ণ হওয়ার পরে, তৈরি করা ক্লায়েন্ট আইডিটি নোট করুন। পরবর্তী পদক্ষেপগুলি সম্পূর্ণ করতে আপনার ক্লায়েন্ট আইডির প্রয়োজন হবে। (একটি ক্লায়েন্ট সিক্রেটও তৈরি করা হয়েছে, তবে আপনার এটি শুধুমাত্র সার্ভার-সাইড অপারেশনের জন্য প্রয়োজন।)

গুগল প্ল্যাটফর্ম লাইব্রেরি লোড করুন

আপনাকে অবশ্যই আপনার ওয়েব পৃষ্ঠাগুলিতে Google প্ল্যাটফর্ম লাইব্রেরি অন্তর্ভুক্ত করতে হবে যা Google সাইন-ইনকে একীভূত করে৷

<script src="https://apis.google.com/js/platform.js" async defer></script>

আপনার অ্যাপের ক্লায়েন্ট আইডি উল্লেখ করুন

google-signin-client_id মেটা এলিমেন্ট সহ Google Developers Console-এ আপনার অ্যাপের জন্য তৈরি করা ক্লায়েন্ট আইডি নির্দিষ্ট করুন।

<meta name="google-signin-client_id" content="YOUR_CLIENT_ID.apps.googleusercontent.com">

একটি Google সাইন-ইন বোতাম যোগ করুন

আপনার সাইটে একটি Google সাইন-ইন বোতাম যোগ করার সবচেয়ে সহজ উপায় হল একটি স্বয়ংক্রিয়ভাবে রেন্ডার করা সাইন-ইন বোতাম ব্যবহার করা৷ কোডের মাত্র কয়েকটি লাইনের সাথে, আপনি একটি বোতাম যোগ করতে পারেন যা স্বয়ংক্রিয়ভাবে ব্যবহারকারীর সাইন-ইন অবস্থা এবং আপনার অনুরোধের সুযোগের জন্য উপযুক্ত পাঠ্য, লোগো এবং রঙ থাকতে কনফিগার করে।

একটি Google সাইন-ইন বোতাম তৈরি করতে যা ডিফল্ট সেটিংস ব্যবহার করে, আপনার সাইন-ইন পৃষ্ঠাতে ক্লাস g-signin2 সহ একটি div উপাদান যোগ করুন:

<div class="g-signin2" data-onsuccess="onSignIn"></div>

প্রোফাইল তথ্য পান

আপনি ডিফল্ট স্কোপগুলি ব্যবহার করে Google-এর সাথে কোনও ব্যবহারকারীকে সাইন ইন করার পরে, আপনি ব্যবহারকারীর Google ID, নাম, প্রোফাইল URL এবং ইমেল ঠিকানা অ্যাক্সেস করতে পারেন৷

ব্যবহারকারীর জন্য প্রোফাইল তথ্য পুনরুদ্ধার করতে, getBasicProfile() পদ্ধতি ব্যবহার করুন।

function onSignIn(googleUser) {
  var profile = googleUser.getBasicProfile();
  console.log('ID: ' + profile.getId()); // Do not send to your backend! Use an ID token instead.
  console.log('Name: ' + profile.getName());
  console.log('Image URL: ' + profile.getImageUrl());
  console.log('Email: ' + profile.getEmail()); // This is null if the 'email' scope is not present.
}

একটি ব্যবহারকারী সাইন আউট করুন

আপনি একটি সাইন-আউট বোতাম বা আপনার সাইটে লিঙ্ক যোগ করে Google থেকে সাইন আউট না করেই ব্যবহারকারীদের আপনার অ্যাপ থেকে সাইন আউট করতে সক্ষম করতে পারেন৷ একটি সাইন-আউট লিঙ্ক তৈরি করতে, লিঙ্কের onclick ইভেন্টে GoogleAuth.signOut() পদ্ধতি কল করে এমন একটি ফাংশন সংযুক্ত করুন৷

<a href="#" onclick="signOut();">Sign out</a>
<script>
  function signOut() {
    var auth2 = gapi.auth2.getAuthInstance();
    auth2.signOut().then(function () {
      console.log('User signed out.');
    });
  }
</script>