কোড মডেল ব্যবহার করুন

গুগল আইডেন্টিটি সার্ভিসেস লাইব্রেরি ব্যবহারকারীদের ব্রাউজার ভিত্তিক পপআপ অথবা রিডাইরেক্ট ইউএক্স ফ্লো ব্যবহার করে গুগলের কাছ থেকে একটি অনুমোদন কোডের অনুরোধ করতে সক্ষম করে। এটি একটি নিরাপদ OAuth 2.0 ফ্লো শুরু করে এবং ব্যবহারকারীর পক্ষ থেকে গুগল এপিআই কল করার জন্য একটি অ্যাক্সেস টোকেন ব্যবহার করে।

OAuth 2.0 authorization code flow summary:

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

মূল বিষয়: আপনার ব্যাকএন্ড সার্ভারে, আপনি গুগলের টোকেন এন্ডপয়েন্টে কল করে রিফ্রেশ টোকেন এবং অ্যাক্সেস টোকেনের জন্য একটি অনুমোদন কোড বিনিময় করেন।

পূর্বশর্ত

আপনার OAuth কনসেন্ট স্ক্রিন কনফিগার করতে, একটি ক্লায়েন্ট আইডি পেতে এবং ক্লায়েন্ট লাইব্রেরি লোড করতে সেটআপে বর্ণিত ধাপগুলি অনুসরণ করুন।

Initialize a Code Client

google.accounts.oauth2.initCodeClient() পদ্ধতিটি একটি কোড ক্লায়েন্টকে আরম্ভ করে।

Popup or Redirect mode

আপনি রিডাইরেক্ট অথবা পপআপ মোড ইউজার ফ্লো ব্যবহার করে একটি অথেন্টমেন্ট কোড শেয়ার করতে পারেন। রিডাইরেক্ট মোডের মাধ্যমে আপনি আপনার সার্ভারে একটি OAuth2 অথেন্টেশন এন্ডপয়েন্ট হোস্ট করেন এবং গুগল ইউজার-এজেন্টকে এই এন্ডপয়েন্টে রিডাইরেক্ট করে, অথেন্টমেন্ট কোডটি একটি URL প্যারামিটার হিসেবে শেয়ার করে। পপআপ মোডের জন্য আপনি একটি জাভাস্ক্রিপ্ট কলব্যাক হ্যান্ডলার সংজ্ঞায়িত করেন, যা আপনার সার্ভারে অথেন্টেশন কোড পাঠায়। আপনি পপআপ মোড ব্যবহার করে দর্শকদের আপনার সাইট ছেড়ে না গিয়ে একটি নির্বিঘ্ন ব্যবহারকারীর অভিজ্ঞতা প্রদান করতে পারেন।

To initialize a client for the:

• UX ফ্লো রিডাইরেক্ট করুন, ux_mode কে redirect সেট করুন এবং redirect_uri এর মান আপনার প্ল্যাটফর্মের অথোরাইজেশন কোড এন্ডপয়েন্টে সেট করুন। মানটি অবশ্যই OAuth 2.0 ক্লায়েন্টের জন্য অনুমোদিত রিডাইরেক্ট URI গুলির মধ্যে একটির সাথে হুবহু মিলবে যা আপনি Google Cloud Console-এ কনফিগার করেছেন। এটি অবশ্যই রিডাইরেক্ট URI যাচাইকরণ নিয়ম মেনে চলতে হবে।

• পপআপ UX ফ্লো, ux_mode কে popup এ সেট করুন, এবং callback মান আপনার প্ল্যাটফর্মে অনুমোদন কোড পাঠানোর জন্য যে ফাংশনটি ব্যবহার করবেন তার নামে দিন। redirect_uri এর মান ডিফল্টভাবে initCodeClient কল করা পৃষ্ঠার অরিজিনে থাকে। পরবর্তীতে যখন আপনি auth কোডটি অ্যাক্সেস বা রিফ্রেশ টোকেনের জন্য বিনিময় করেন তখন ফ্লো এই মানটি ব্যবহার করে। উদাহরণস্বরূপ, https://www.example.com/index.html initCodeClient কল করে এবং origin: https://www.example.com হল redirect_url এর মান।

মূল বিষয়: ব্যবহারযোগ্যতা এবং নিরাপত্তার সর্বোত্তম ভারসাম্যের জন্য, আমরা অনুমোদন কোড মডেল সহ পপআপ মোড UX প্রবাহ ব্যবহার করার পরামর্শ দিচ্ছি।

Protect against CSRF attacks

রিডাইরেক্ট এবং পপআপ মোড UX ফ্লোগুলি ক্রস-সাইট-রিকোয়েস্ট-ফরজেরি (CSRF) আক্রমণ প্রতিরোধে সামান্য ভিন্ন কৌশল ব্যবহার করে। রিডাইরেক্ট মোডের জন্য, OAuth 2.0 স্টেট প্যারামিটার ব্যবহার করুন। স্টেট প্যারামিটার তৈরি এবং যাচাই করার বিষয়ে আরও জানতে RFC6749 বিভাগ 10.12 ক্রস-সাইট রিকোয়েস্ট ফোরজেরি দেখুন। পপআপ মোডের সাহায্যে, আপনি আপনার অনুরোধগুলিতে একটি কাস্টম HTTP হেডার যোগ করেন এবং তারপরে আপনার সার্ভারে নিশ্চিত করেন যে এটি প্রত্যাশিত মান এবং উৎপত্তির সাথে মেলে।

প্রমাণীকরণ কোড এবং CSRF হ্যান্ডলিং দেখানো একটি কোড স্নিপেট দেখতে একটি UX মোড বেছে নিন:

Redirect mode

এমন একটি ক্লায়েন্ট চালু করুন যেখানে Google ব্যবহারকারীর ব্রাউজারকে আপনার প্রমাণীকরণের শেষ বিন্দুতে পুনঃনির্দেশিত করে, URL প্যারামিটার হিসেবে প্রমাণীকরণ কোড ভাগ করে।

const client = google.accounts.oauth2.initCodeClient({
  client_id: 'YOUR_CLIENT_ID',
  scope: 'https://www.googleapis.com/auth/calendar.readonly',
  ux_mode: 'redirect',
  redirect_uri: 'https://oauth2.example.com/code',
  state: 'YOUR_BINDING_VALUE'
});

মূল বিষয়: আপনার ব্যাকএন্ড সার্ভারের একটি এন্ডপয়েন্ট প্রমাণীকরণ কোড গ্রহণ করে এবং যাচাই করে , অ্যাক্সেস এবং রিফ্রেশ টোকেনের জন্য এটি বিনিময় করে।

Popup mode

একটি ক্লায়েন্ট চালু করুন যেখানে ব্যবহারকারী একটি পপআপ ডায়ালগে অনুমোদন প্রবাহ শুরু করে। সম্মতির পর, Google একটি কলব্যাক ফাংশন ব্যবহার করে ব্যবহারকারীর ব্রাউজারে অনুমোদন কোডটি ফেরত পাঠায়। JS কলব্যাক হ্যান্ডলারের একটি POST অনুরোধ ব্যাকএন্ড সার্ভারের একটি এন্ডপয়েন্টে প্রমাণীকরণ কোড সরবরাহ করে, যেখানে আপনি প্রথমে এটি যাচাই করেন এবং তারপর OAuth প্রবাহের বাকি অংশটি সম্পূর্ণ করেন।

const client = google.accounts.oauth2.initCodeClient({
  client_id: 'YOUR_CLIENT_ID',
  scope: 'https://www.googleapis.com/auth/calendar.readonly',
  ux_mode: 'popup',
  callback: (response) => {
    const xhr = new XMLHttpRequest();
    xhr.open('POST', "https://oauth2.example.com/code", true);
    xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
    // Set custom header for CRSF
    xhr.setRequestHeader('X-Requested-With', 'XmlHttpRequest');
    xhr.onload = function() {
      console.log('Auth code response: ' + xhr.responseText);
    };
    xhr.send('code=' + response.code);
  },
});

মূল বিষয়: আপনার ব্যাকএন্ড সার্ভারের একটি এন্ডপয়েন্ট প্রমাণীকরণ কোড গ্রহণ করে এবং যাচাই করে , অ্যাক্সেস এবং রিফ্রেশ টোকেনের জন্য এটি বিনিময় করে।

Trigger OAuth 2.0 Code Flow

ব্যবহারকারী প্রবাহ ট্রিগার করতে কোড ক্লায়েন্টের requestCode() পদ্ধতিটি কল করুন:

<button onclick="client.requestCode();">Authorize with Google</button>

এর জন্য ব্যবহারকারীকে একটি Google অ্যাকাউন্টে সাইন-ইন করতে হবে এবং আপনার রিডাইরেক্ট এন্ডপয়েন্টে অথবা আপনার কলব্যাক হ্যান্ডলারে একটি অনুমোদন কোড ফেরত পাঠানোর আগে পৃথক স্কোপ শেয়ার করার জন্য সম্মতি দিতে হবে।

Auth code handling

গুগল প্রতি ব্যবহারকারীর জন্য একটি অনন্য অনুমোদন কোড তৈরি করে যা আপনি আপনার ব্যাকএন্ড সার্ভারে পান এবং যাচাই করেন।

পপআপ মোডের জন্য, ব্যবহারকারীর ব্রাউজারে চলমান callback দ্বারা নির্দিষ্ট হ্যান্ডলারটি অনুমোদন কোডটিকে আপনার প্ল্যাটফর্ম দ্বারা হোস্ট করা একটি এন্ডপয়েন্টে রিলে করে।

রিডাইরেক্ট মোডের জন্য, গুগল redirect_uri দ্বারা নির্দিষ্ট করা এন্ডপয়েন্টে একটি GET অনুরোধ পাঠায়, URL কোড প্যারামিটারে অনুমোদন কোড ভাগ করে। অনুমোদন কোড পেতে:

• যদি আপনার কোন বিদ্যমান বাস্তবায়ন না থাকে, তাহলে একটি নতুন অনুমোদনের শেষ বিন্দু তৈরি করুন , অথবা

• GET অনুরোধ এবং URL প্যারামিটার গ্রহণ করতে আপনার বিদ্যমান এন্ডপয়েন্ট আপডেট করুন । পূর্বে, Google পেলোডে অনুমোদন কোড মান সহ একটি PUT অনুরোধ পাঠিয়েছিল।

Authorization endpoint

আপনার অনুমোদন কোড এন্ডপয়েন্টকে অবশ্যই এই URL কোয়েরি স্ট্রিং প্যারামিটারগুলির সাথে GET অনুরোধগুলি পরিচালনা করতে হবে:

নাম	মূল্য
authuser	Request for user sign-in authentication
কোড	An OAuth2 authorization code generated by Google
এইচডি	ব্যবহারকারীর অ্যাকাউন্টের হোস্ট করা ডোমেন
প্রম্পট	ব্যবহারকারীর সম্মতির ডায়ালগ
সুযোগ	অনুমোদিত হতে যাওয়া এক বা একাধিক OAuth2 স্কোপের স্থান পৃথক তালিকা
অবস্থা	CRSF state variable

RFC 6749 অনুসারে, ক্লায়েন্টদের অবশ্যই অচেনা প্রতিক্রিয়া পরামিতিগুলি উপেক্ষা করতে হবে, সেগুলি পূর্ববর্তী সারণীতে তালিকাভুক্ত হোক বা না হোক।

উদাহরণ: auth-code নামক একটি এন্ডপয়েন্টে URL প্যারামিটার সহ GET অনুরোধ এবং example.com দ্বারা হোস্ট করা:

Request URL: https://www.example.com/auth-code?state=42a7bd822fe32cc56&code=4/0AX4XfWiAvnXLqxlckFUVao8j0zvZUJ06AMgr-n0vSPotHWcn9p-zHCjqwr47KHS_vDvu8w&scope=email%20profile%20https://www.googleapis.com/auth/calendar.readonly%20https://www.googleapis.com/auth/photoslibrary.readonly%20https://www.googleapis.com/auth/contacts.readonly%20openid%20https://www.googleapis.com/auth/userinfo.email%20https://www.googleapis.com/auth/userinfo.profile&authuser=0&hd=example.com&prompt=consent

যখন আপনি পূর্ববর্তী জাভাস্ক্রিপ্ট লাইব্রেরি ব্যবহার করে অনুমোদন কোড প্রবাহ শুরু করেন, অথবা Google OAuth 2.0 এন্ডপয়েন্টে সরাসরি কল করেন, তখন Google একটি POST অনুরোধ পাঠায়।

HTTP অনুরোধের বডিতে পেলোড হিসেবে অনুমোদন কোড ধারণকারী POST অনুরোধের উদাহরণ:

Request URL: https://www.example.com/auth-code
Request Payload: 4/0AX4XfWhll-BMV82wi4YwbrSaTPaRpUGpKqJ4zBxQldU\_70cnIdh-GJOBZlyHU3MNcz4qaw

গুরুত্বপূর্ণ: পূর্বে, অনুরোধের জন্য POST ব্যবহার করা হত। GET এবং POST উভয় অনুরোধ গ্রহণ করার জন্য আপনার হ্যান্ডলার আপডেট করুন অথবা যদি আপনি পুরানো JS লাইব্রেরি ব্যবহার চালিয়ে যাওয়ার পরিকল্পনা করেন অথবা Google Identity Services লাইব্রেরি ব্যবহার করার সময় সরাসরি Google OAuth 2.0 এন্ডপয়েন্টে কল করার পরিকল্পনা করেন তবে দুটি ভিন্ন এন্ডপয়েন্ট হোস্ট করার কথা বিবেচনা করুন।

অনুরোধটি যাচাই করুন

আপনার সার্ভারে CSRF আক্রমণ এড়াতে নিম্নলিখিতগুলি করুন।

রিডাইরেক্ট মোডের জন্য স্টেট প্যারামিটারের মান পরীক্ষা করুন ।

নিশ্চিত করুন যে পপআপ মোডের জন্য X-Requested-With: XmlHttpRequest হেডারটি উপস্থিত রয়েছে।

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

অ্যাক্সেস পান এবং টোকেন রিফ্রেশ করুন

আপনার ব্যাকএন্ড প্ল্যাটফর্মটি Google থেকে একটি অনুমোদন কোড পাওয়ার পরে এবং অনুরোধটি যাচাই করার পরে, API কল করার জন্য Google থেকে অ্যাক্সেস পেতে এবং টোকেনগুলি রিফ্রেশ করতে অনুমোদন কোডটি ব্যবহার করুন।

ধাপ ৫ থেকে শুরু করে নির্দেশাবলী অনুসরণ করুন : Using OAuth 2.0 for Web Server Applications নির্দেশিকার রিফ্রেশ এবং অ্যাক্সেস টোকেনের জন্য অনুমোদন কোড বিনিময় করুন ।

দ্রষ্টব্য: যখন আপনি পপআপ মোড ব্যবহার করেন, তখন ধাপ ৫ এবং তার পরে ব্যবহৃত redirect_uri মানটি কলিং পৃষ্ঠার উৎপত্তিস্থল। উদাহরণস্বরূপ, https://www.example.com/index.html initCodeClient কল করে এবং origin: https://www.example.com হল redirect_url এর মান।

Manage tokens

আপনার প্ল্যাটফর্মটি নিরাপদে রিফ্রেশ টোকেন সংরক্ষণ করে। আপনি যখন ব্যবহারকারীর অ্যাকাউন্টগুলি সরিয়ে দেন, অথবা কোনও ব্যবহারকারী google.accounts.oauth2.revoke অথবা সরাসরি https://myaccount.google.com/permissions থেকে সম্মতি প্রত্যাহার করেন, তখন সঞ্চিত রিফ্রেশ টোকেনগুলি মুছে ফেলুন।

ঐচ্ছিকভাবে, আপনি ক্রস-অ্যাকাউন্ট সুরক্ষা দিয়ে ব্যবহারকারীর অ্যাকাউন্টগুলিকে সুরক্ষিত করার জন্য RISC বিবেচনা করতে পারেন।

সাধারণত, আপনার ব্যাকএন্ড প্ল্যাটফর্মটি একটি অ্যাক্সেস টোকেন ব্যবহার করে গুগল এপিআই কল করবে। যদি আপনার ওয়েব অ্যাপটি ব্যবহারকারীর ব্রাউজার থেকে সরাসরি গুগল এপিআই কল করে তবে আপনাকে অবশ্যই আপনার ওয়েব অ্যাপ্লিকেশনের সাথে অ্যাক্সেস টোকেন ভাগ করে নেওয়ার একটি উপায় বাস্তবায়ন করতে হবে, এটি করা এই নির্দেশিকার আওতার বাইরে। এই পদ্ধতি অনুসরণ করার সময় এবং জাভাস্ক্রিপ্টের জন্য গুগল এপিআই ক্লায়েন্ট লাইব্রেরি ব্যবহার করার সময়, ব্রাউজার মেমরিতে অ্যাক্সেস টোকেনটি অস্থায়ীভাবে সংরক্ষণ করতে gapi.client.SetToken() ব্যবহার করুন এবং লাইব্রেরিটি গুগল এপিআই কল করতে সক্ষম করুন।