Google HTML API রেফারেন্স দিয়ে সাইন ইন করুন

এই রেফারেন্স পেজটিতে ‘সাইন ইন উইথ গুগল’ এইচটিএমএল ডেটা অ্যাট্রিবিউটস এপিআই (API) সম্পর্কে বর্ণনা করা হয়েছে, যা ওয়েব পেজে ‘সাইন ইন উইথ গুগল’ বাটন অথবা ‘ওয়ান ট্যাপ’ প্রম্পট প্রদর্শন করতে ব্যবহৃত হয়।

"g_id_onload" আইডি সহ উপাদান

আপনি যেকোনো দৃশ্যমান বা অদৃশ্যমান এলিমেন্টে, যেমন <div> এবং <span> এ ‘Sign In With Google’ ডেটা অ্যাট্রিবিউট যোগ করতে পারেন। একমাত্র শর্ত হলো, এলিমেন্ট আইডিটি অবশ্যই g_id_onload এ সেট করতে হবে। এই আইডিটি একাধিক এলিমেন্টে ব্যবহার করবেন না।

ডেটা বৈশিষ্ট্য

নিম্নলিখিত সারণিতে ডেটা অ্যাট্রিবিউটগুলো এবং তাদের বিবরণ তালিকাভুক্ত করা হলো:

বৈশিষ্ট্য
data-client_id আপনার অ্যাপ্লিকেশনের ক্লায়েন্ট আইডি
data-color_scheme ওয়ান ট্যাপ প্রম্পটে যে কালার স্কিমটি প্রয়োগ করা হয়েছে।
data-auto_prompt গুগল ওয়ান ট্যাপ প্রদর্শন করুন।
data-auto_select গুগল ওয়ান ট্যাপ-এ স্বয়ংক্রিয়ভাবে নির্বাচন সক্ষম করে।
data-login_uri আপনার লগইন এন্ডপয়েন্টের ইউআরএল
data-callback জাভাস্ক্রিপ্ট আইডি টোকেন হ্যান্ডলার ফাংশনের নাম
data-native_login_uri আপনার পাসওয়ার্ড ক্রেডেনশিয়াল হ্যান্ডলার এন্ডপয়েন্টের URL
data-native_callback জাভাস্ক্রিপ্ট পাসওয়ার্ড ক্রেডেনশিয়াল হ্যান্ডলার ফাংশনের নাম
data-native_id_param credential.id মানের জন্য প্যারামিটারের নাম
data-native_password_param credential.password মানের জন্য প্যারামিটারের নাম
data-cancel_on_tap_outside ব্যবহারকারী প্রম্পটের বাইরে ক্লিক করলে প্রম্পটটি বাতিল করা হবে কিনা, তা এটি নিয়ন্ত্রণ করে।
data-prompt_parent_id ওয়ান ট্যাপ প্রম্পট কন্টেইনার এলিমেন্টের DOM ID
data-skip_prompt_cookie নির্দিষ্ট কুকিটির মান খালি না হলে ওয়ান ট্যাপ এড়িয়ে যাওয়া হবে।
data-nonce আইডি টোকেনগুলির জন্য একটি এলোমেলো স্ট্রিং
data-essential_claims গুগল কর্তৃক ফেরত দেওয়া আইডি টোকেনে অন্তর্ভুক্ত করার জন্য অতিরিক্ত দাবিসমূহ।
data-context ওয়ান ট্যাপ প্রম্পটে শিরোনাম এবং শব্দগুলো
data-moment_callback প্রম্পট UI স্ট্যাটাস নোটিফিকেশন লিসেনারের ফাংশনের নাম
data-state_cookie_domain যদি আপনাকে প্যারেন্ট ডোমেইন এবং এর সাবডোমেইনগুলোতে ওয়ান ট্যাপ কল করার প্রয়োজন হয়, তাহলে এই অ্যাট্রিবিউটে প্যারেন্ট ডোমেইনটি পাস করুন, যাতে একটিমাত্র শেয়ার্ড কুকি ব্যবহৃত হয়।
data-ux_mode গুগল দিয়ে সাইন ইন করুন বাটনের ইউএক্স ফ্লো
data-allowed_parent_origin যে অরিজিনগুলো ইন্টারমিডিয়েট আইফ্রেম এম্বেড করার অনুমতি পায়। এই অ্যাট্রিবিউটটি উপস্থিত থাকলে ওয়ান ট্যাপ ইন্টারমিডিয়েট আইফ্রেম মোডে চলে।
data-intermediate_iframe_close_callback ব্যবহারকারীরা যখন ম্যানুয়ালি ওয়ান ট্যাপ বন্ধ করেন, তখন এটি ডিফল্ট মধ্যবর্তী আইফ্রেমের আচরণকে অগ্রাহ্য করে।
data-itp_support ITP ব্রাউজারগুলিতে উন্নত ওয়ান ট্যাপ ইউএক্স সক্ষম করা হয়েছে।
data-login_hint ব্যবহারকারীকে একটি ইঙ্গিত দিয়ে অ্যাকাউন্ট নির্বাচন এড়িয়ে যান।
data-hd ডোমেইন অনুযায়ী অ্যাকাউন্ট নির্বাচন সীমিত করুন।
data-use_fedcm_for_prompt ব্রাউজারকে ব্যবহারকারীর সাইন-ইন প্রম্পট নিয়ন্ত্রণ করতে এবং আপনার ওয়েবসাইট ও গুগলের মধ্যে সাইন-ইন প্রবাহে মধ্যস্থতা করার অনুমতি দিন।
data-use_fedcm_for_button এই ফিল্ডটি নির্ধারণ করে যে ক্রোম (ডেস্কটপ M125+ এবং অ্যান্ড্রয়েড M128+)-এ FedCM বাটন UX ব্যবহার করা হবে কি না। এর ডিফল্ট মান হলো false ।
data-button_auto_select FedCM বাটন ফ্লো-এর জন্য অটো সিলেক্ট অপশনটি চালু করা হবে কিনা। এটি চালু করা হলে, সক্রিয় গুগল সেশন থাকা পুরনো ব্যবহারকারীরা অ্যাকাউন্ট চুজারের প্রম্পট এড়িয়ে স্বয়ংক্রিয়ভাবে সাইন ইন হয়ে যাবেন। এর ডিফল্ট মান হলো false ।

অ্যাট্রিবিউটের প্রকারভেদ

নিম্নলিখিত বিভাগগুলিতে প্রতিটি অ্যাট্রিবিউট প্রকার এবং একটি উদাহরণ সম্পর্কে বিশদ বিবরণ রয়েছে।

ডেটা-ক্লায়েন্ট_আইডি

এই অ্যাট্রিবিউটটি হলো আপনার অ্যাপের ক্লায়েন্ট আইডি, যা গুগল ক্লাউড কনসোলে খুঁজে পাওয়া যায় এবং তৈরি করা হয়। আরও তথ্যের জন্য নিচের সারণিটি দেখুন:

প্রকার প্রয়োজনীয় উদাহরণ
স্ট্রিং হ্যাঁ data-client_id="CLIENT_ID.apps.googleusercontent.com"

ডেটা-রঙ_স্কিম

এই ফিল্ডটি হলো ওয়ান ট্যাপ প্রম্পটে প্রয়োগ করা কালার স্কিম। আরও তথ্যের জন্য নিচের সারণিটি দেখুন:

প্রকার প্রয়োজনীয় উদাহরণ
স্ট্রিং ঐচ্ছিক। ডিফল্টরূপে ব্যবহারকারীর সিস্টেমের ডিফল্ট কালার স্কিম ব্যবহৃত হয়। data-color_scheme="dark"

নিচের সারণিতে উপলব্ধ রঙের বিন্যাস এবং সেগুলোর বিবরণ দেওয়া হলো।

রঙের পরিকল্পনা
default ব্যবহারকারীর সিস্টেমের ডিফল্ট কালার স্কিম প্রয়োগ করা হয়, যা ব্যবহারকারীর পছন্দের উপর নির্ভর করে হালকা বা গাঢ় হতে পারে।
light হালকা রঙের ব্যবহার করুন।
dark গাঢ় রঙের ব্যবহার করুন।

ডেটা-অটো_প্রম্পট

এই অ্যাট্রিবিউটটি নির্ধারণ করে যে ওয়ান ট্যাপ প্রদর্শন করা হবে কি না। এর ডিফল্ট মান হলো true । এই মান ' false হলে গুগল ওয়ান ট্যাপ প্রদর্শিত হয় না। আরও তথ্যের জন্য নিচের সারণিটি দেখুন:

প্রকার প্রয়োজনীয় উদাহরণ
বুলিয়ান ঐচ্ছিক data-auto_prompt="true"

ডেটা-অটো_সিলেক্ট

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

প্রকার প্রয়োজনীয় উদাহরণ
বুলিয়ান ঐচ্ছিক data-auto_select="true"

ডেটা-লগইন_ইউআরআই

এই অ্যাট্রিবিউটটি হলো আপনার লগইন এন্ডপয়েন্টের URI।

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

বর্তমান পৃষ্ঠাটি যদি আপনার লগইন পৃষ্ঠা হয়, তাহলে এই অ্যাট্রিবিউটটি বাদ দেওয়া যেতে পারে, সেক্ষেত্রে ক্রেডেনশিয়ালটি ডিফল্টরূপে এই পৃষ্ঠায় পোস্ট করা হয়।

যখন কোনো কলব্যাক ফাংশন সংজ্ঞায়িত করা থাকে না এবং ব্যবহারকারী 'Sign In With Google' বা 'One Tap' বোতামে ক্লিক করেন, অথবা স্বয়ংক্রিয় সাইন-আপ সম্পন্ন হয়, তখন আইডি টোকেন ক্রেডেনশিয়াল রেসপন্সটি আপনার লগইন এন্ডপয়েন্টে পোস্ট করা হয়।

আপনার লগইন এন্ডপয়েন্টকে অবশ্যই এমন POST রিকোয়েস্ট হ্যান্ডেল করতে হবে, যেগুলোর বডিতে একটি credential প্যারামিটার এবং একটি ID টোকেন ভ্যালু থাকে।

আরও তথ্যের জন্য নিচের সারণিটি দেখুন:

প্রকার ঐচ্ছিক উদাহরণ
ইউআরএল ডিফল্টরূপে বর্তমান পৃষ্ঠার URI অথবা আপনার নির্দিষ্ট করা মান ব্যবহৃত হয়।
যখন data-ux_mode="popup" এবং data-callback সেট করা থাকে তখন এটি উপেক্ষা করা হয়।		 data-login_uri="https://www.example.com/login"

ডেটা-কলব্যাক

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

প্রকার প্রয়োজনীয় উদাহরণ
স্ট্রিং data-login_uri সেট করা না থাকলে এটি আবশ্যক। data-callback="handleToken"

data-login_uri এবং data-callback অ্যাট্রিবিউটগুলোর মধ্যে যেকোনো একটি ব্যবহৃত হতে পারে। এটি নিম্নলিখিত কম্পোনেন্ট এবং UX মোড কনফিগারেশনের উপর নির্ভর করে:

  • 'Sign In With Google' বাটনের redirect ইউএক্স মোডের জন্য data-login_uri অ্যাট্রিবিউটটি আবশ্যক, যা data-callback অ্যাট্রিবিউটকে উপেক্ষা করে।

  • Google One Tap এবং Google Sign-In বাটন popup UX মোডের জন্য এই দুটি অ্যাট্রিবিউটের মধ্যে একটি অবশ্যই সেট করতে হবে। যদি উভয়ই সেট করা থাকে, তাহলে data-callback অ্যাট্রিবিউটের অগ্রাধিকার বেশি হবে।

নেমস্পেসের ভেতরের জাভাস্ক্রিপ্ট ফাংশনগুলো HTML API দ্বারা সমর্থিত নয়। এর পরিবর্তে, নেমস্পেস ছাড়া একটি গ্লোবাল জাভাস্ক্রিপ্ট ফাংশন ব্যবহার করুন। উদাহরণস্বরূপ, mylib.callback এর বদলে mylibCallback ব্যবহার করুন।

ডেটা-নেটিভ_লগইন_ইউআরআই

এই অ্যাট্রিবিউটটি হলো আপনার পাসওয়ার্ড ক্রেডেনশিয়াল হ্যান্ডলার এন্ডপয়েন্টের URL। আপনি যদি data-native_login_uri অ্যাট্রিবিউট অথবা data-native_callback অ্যাট্রিবিউট সেট করেন, তাহলে কোনো গুগল সেশন না থাকলে জাভাস্ক্রিপ্ট লাইব্রেরিটি বিল্ট-ইন ক্রেডেনশিয়াল ম্যানেজারে ফিরে যায়। আপনি data-native_callback এবং data-native_login_uri উভয় অ্যাট্রিবিউট একসাথে সেট করতে পারবেন না। আরও তথ্যের জন্য নিচের টেবিলটি দেখুন:

প্রকার প্রয়োজনীয় উদাহরণ
স্ট্রিং ঐচ্ছিক data-login_uri="https://www.example.com/password_login"

ডেটা-নেটিভ_কলব্যাক

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

প্রকার প্রয়োজনীয় উদাহরণ
স্ট্রিং ঐচ্ছিক data-native_callback="handlePasswordCredential"

নেমস্পেসের ভেতরের জাভাস্ক্রিপ্ট ফাংশনগুলো HTML API দ্বারা সমর্থিত নয়। এর পরিবর্তে, নেমস্পেস ছাড়া একটি গ্লোবাল জাভাস্ক্রিপ্ট ফাংশন ব্যবহার করুন। উদাহরণস্বরূপ, mylib.callback এর বদলে mylibCallback ব্যবহার করুন।

ডেটা-নেটিভ_আইডি_প্যারাম

যখন আপনি পাসওয়ার্ড ক্রেডেনশিয়াল হ্যান্ডলার এন্ডপয়েন্টে পাসওয়ার্ড ক্রেডেনশিয়াল জমা দেন, তখন আপনি credential.id ফিল্ডের জন্য প্যারামিটারের নাম নির্দিষ্ট করে দিতে পারেন। ডিফল্ট নামটি হলো email । আরও তথ্যের জন্য নিচের সারণিটি দেখুন:

প্রকার প্রয়োজনীয় উদাহরণ
ইউআরএল ঐচ্ছিক data-native_id_param="user_id"

ডেটা-নেটিভ_পাসওয়ার্ড_প্যারাম

যখন আপনি পাসওয়ার্ড ক্রেডেনশিয়াল হ্যান্ডলার এন্ডপয়েন্টে পাসওয়ার্ড ক্রেডেনশিয়াল জমা দেন, তখন আপনি credential.password ভ্যালুর জন্য প্যারামিটারের নাম নির্দিষ্ট করে দিতে পারেন। ডিফল্ট নামটি হলো password । আরও তথ্যের জন্য নিচের সারণিটি দেখুন:

প্রকার প্রয়োজনীয় উদাহরণ
ইউআরএল ঐচ্ছিক data-native_password_param="pwd"

বাইরে ট্যাপ করলে ডেটা বাতিল করুন

এই অ্যাট্রিবিউটটি নির্ধারণ করে যে, ব্যবহারকারী প্রম্পটের বাইরে ক্লিক করলে ওয়ান ট্যাপ অনুরোধটি বাতিল করা হবে কি না। এর ডিফল্ট মান হলো true । এটিকে নিষ্ক্রিয় করতে, মানটি ' false সেট করুন। আরও তথ্যের জন্য নিম্নলিখিত সারণিটি দেখুন:

প্রকার প্রয়োজনীয় উদাহরণ
বুলিয়ান ঐচ্ছিক data-cancel_on_tap_outside="false"

ডেটা-প্রম্পট_প্যারেন্ট_আইডি

এই অ্যাট্রিবিউটটি কন্টেইনার এলিমেন্টের DOM ID নির্ধারণ করে। এটি সেট করা না থাকলে, উইন্ডোর উপরের ডান কোণায় ওয়ান ট্যাপ প্রম্পটটি প্রদর্শিত হয়। আরও তথ্যের জন্য নিচের সারণিটি দেখুন:

প্রকার প্রয়োজনীয় উদাহরণ
স্ট্রিং ঐচ্ছিক data-prompt_parent_id="parent_id"

ওয়ান ট্যাপ প্রম্পটের প্রদর্শন নিয়ন্ত্রণ করতে একটি কুকি ব্যবহার করা হয়। এই অ্যাট্রিবিউট দ্বারা নির্দিষ্ট কুকিটির মান যদি খালি না হয়, তবে প্রম্পটটি প্রদর্শিত হয় না। আরও তথ্যের জন্য নিম্নলিখিত সারণিটি দেখুন:

প্রকার প্রয়োজনীয় উদাহরণ
স্ট্রিং ঐচ্ছিক data-skip_prompt_cookie="SID"

ডেটা-নন্স

এই অ্যাট্রিবিউটটি হলো একটি র‍্যান্ডম স্ট্রিং, যা আইডি টোকেন রিপ্লে অ্যাটাক প্রতিরোধ করতে ব্যবহার করে। আরও তথ্যের জন্য নিচের সারণিটি দেখুন:

প্রকার প্রয়োজনীয় উদাহরণ
স্ট্রিং ঐচ্ছিক data-nonce="biaqbm70g23"

ননসের দৈর্ঘ্য আপনার পরিবেশ দ্বারা সমর্থিত সর্বোচ্চ JWT আকার এবং স্বতন্ত্র ব্রাউজার ও সার্ভারের HTTP আকারের সীমাবদ্ধতা দ্বারা সীমিত।

ডেটা-অত্যাবশ্যকীয়_দাবি

এই অ্যাট্রিবিউটটি একটি স্ট্রিং, যা গুগল কর্তৃক ফেরত দেওয়া আইডি টোকেনে অতিরিক্ত ক্লেইম অন্তর্ভুক্ত করার অনুরোধ জানাতে ব্যবহৃত হয়। গুগল কর্তৃক গৃহীত ক্লেইমগুলোর সম্পূর্ণ তালিকার জন্য ‘সমর্থিত ক্লেইম’ দেখুন।

আরও তথ্যের জন্য নিচের সারণিটি দেখুন:

প্রকার প্রয়োজনীয় উদাহরণ
স্ট্রিং ঐচ্ছিক data-essential_claims="auth_time, amr"

ডেটা-প্রসঙ্গ

এই ফিল্ডটি ওয়ান ট্যাপ প্রম্পটে প্রদর্শিত শিরোনাম এবং বার্তাগুলির টেক্সট পরিবর্তন করে, আইটিপি ব্রাউজারগুলির ক্ষেত্রে এর কোনো প্রভাব নেই। ডিফল্ট হিসেবে signin ।

আরও তথ্যের জন্য নিচের সারণিটি দেখুন:

প্রকার প্রয়োজনীয় উদাহরণ
স্ট্রিং ঐচ্ছিক data-context="use"

নিম্নলিখিত সারণিতে সমস্ত উপলব্ধ প্রেক্ষাপট এবং তাদের বিবরণ তালিকাভুক্ত করা হয়েছে:

প্রেক্ষাপট
signin সাইন ইন করুন
signup সাইন আপ করুন
use "ব্যবহার"

ডেটা-মোমেন্ট_কলব্যাক

এই অ্যাট্রিবিউটটি হলো প্রম্পট UI স্ট্যাটাস নোটিফিকেশন লিসেনারের ফাংশন নেম। আরও তথ্যের জন্য, PromptMomentNotification ডেটা টাইপটি দেখুন।

আরও তথ্যের জন্য নিচের সারণিটি দেখুন:

প্রকার প্রয়োজনীয় উদাহরণ
স্ট্রিং ঐচ্ছিক data-moment_callback="logMomentNotification"

নেমস্পেসের ভেতরের জাভাস্ক্রিপ্ট ফাংশনগুলো HTML API দ্বারা সমর্থিত নয়। এর পরিবর্তে, নেমস্পেস ছাড়া একটি গ্লোবাল জাভাস্ক্রিপ্ট ফাংশন ব্যবহার করুন। উদাহরণস্বরূপ, mylib.callback এর বদলে mylibCallback ব্যবহার করুন।

যদি আপনাকে একটি প্যারেন্ট ডোমেইন এবং তার সাবডোমেইনগুলিতে ওয়ান ট্যাপ প্রদর্শন করতে হয়, তাহলে এই অ্যাট্রিবিউটে প্যারেন্ট ডোমেইনটি পাস করুন, যাতে একটিমাত্র শেয়ার্ড-স্টেট কুকি ব্যবহৃত হয়। আরও তথ্যের জন্য নিম্নলিখিত সারণিটি দেখুন:

প্রকার প্রয়োজনীয় উদাহরণ
স্ট্রিং ঐচ্ছিক data-state_cookie_domain="example.com"

ডেটা-ইউএক্স_মোড

এই অ্যাট্রিবিউটটি 'Sign In With Google' বাটনের জন্য ব্যবহৃত ইউএক্স ফ্লো নির্ধারণ করে। এর ডিফল্ট মান হলো popup । এই অ্যাট্রিবিউটটি 'One Tap' ইউএক্স-এর উপর কোনো প্রভাব ফেলে না। আরও তথ্যের জন্য নিচের সারণিটি দেখুন:

প্রকার প্রয়োজনীয় উদাহরণ
স্ট্রিং ঐচ্ছিক data-ux_mode="redirect"

নিচের সারণিতে উপলব্ধ ইউএক্স মোডগুলো এবং তাদের বিবরণ দেওয়া হলো।

ইউএক্স মোড
popup একটি পপ-আপ উইন্ডোতে সাইন-ইন ইউএক্স ফ্লো সম্পাদন করে।
redirect সম্পূর্ণ পৃষ্ঠায় পুনঃনির্দেশনার মাধ্যমে সাইন-ইন ইউএক্স প্রবাহ সম্পন্ন করে।

ডেটা-অনুমোদিত_প্যারেন্ট_অরিজিন

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

প্রকার প্রয়োজনীয় উদাহরণ
স্ট্রিং বা স্ট্রিং অ্যারে ঐচ্ছিক data-allowed_parent_origin="https://example.com"

নিম্নলিখিত সারণিতে সমর্থিত ভ্যালু টাইপ এবং তাদের বিবরণ তালিকাভুক্ত করা হয়েছে।

মানের প্রকারভেদ
string একটি একক ডোমেইন ইউআরআই। "https://example.com"
string array কমা দ্বারা পৃথক করা ডোমেইন ইউআরআই-গুলোর একটি তালিকা। "https://news.example.com,https://local.example.com"

যদি data-allowed_parent_origin অ্যাট্রিবিউটের মান অবৈধ হয়, তাহলে ইন্টারমিডিয়েট আইফ্রেম মোডের ওয়ান ট্যাপ ইনিশিয়ালাইজেশন ব্যর্থ হবে এবং থেমে যাবে।

ওয়াইল্ডকার্ড প্রিফিক্সও সমর্থিত। উদাহরণস্বরূপ, "https://*.example.com" example.com এবং এর সকল স্তরের সাবডোমেনকে (যেমন news.example.com , login.news.example.com ) ম্যাচ করে। ওয়াইল্ডকার্ড ব্যবহার করার সময় কিছু বিষয় মনে রাখতে হবে:

  • প্যাটার্ন স্ট্রিং শুধুমাত্র একটি ওয়াইল্ডকার্ড এবং একটি টপ লেভেল ডোমেইন দিয়ে গঠিত হতে পারে না। উদাহরণস্বরূপ https:// .com এবং https:// .co.uk অবৈধ, কারণ "https:// .example.com" example.com এবং এর সমস্ত সাবডোমেইনকে ম্যাচ করে। দুটি ভিন্ন ডোমেইন বোঝাতে কমা দ্বারা পৃথক করা একটি তালিকা ব্যবহার করুন। উদাহরণস্বরূপ, "https://example1.com,https:// .example2.com" example1.com , example2.com এবং example2.com এর সাবডোমেইনগুলোকে ম্যাচ করে।
  • ওয়াইল্ডকার্ড ডোমেইন অবশ্যই একটি সুরক্ষিত https:// স্কিম দিয়ে শুরু হতে হবে, তাই "*.example.com" অবৈধ বলে বিবেচিত হয়।

ডেটা-ইন্টারমিডিয়েট_আইফ্রেম_ক্লোজ_কলব্যাক

যখন ব্যবহারকারীরা ওয়ান ট্যাপ UI-তে থাকা 'X' বোতামে ট্যাপ করে ম্যানুয়ালি ওয়ান ট্যাপ বন্ধ করেন, তখন এটি ডিফল্ট মধ্যবর্তী আইফ্রেমের আচরণকে পরিবর্তন করে। ডিফল্ট আচরণ হলো মধ্যবর্তী আইফ্রেমটিকে অবিলম্বে DOM থেকে সরিয়ে দেওয়া।

data-intermediate_iframe_close_callback ফিল্ডটি শুধুমাত্র ইন্টারমিডিয়েট আইফ্রেম মোডে কার্যকর হয়। এবং এটি ওয়ান ট্যাপ আইফ্রেমের পরিবর্তে শুধুমাত্র ইন্টারমিডিয়েট আইফ্রেমের উপর প্রভাব ফেলে। কলব্যাকটি কল করার আগে ওয়ান ট্যাপ UI সরিয়ে ফেলা হয়।

প্রকার প্রয়োজনীয় উদাহরণ
ফাংশন ঐচ্ছিক data-intermediate_iframe_close_callback="logBeforeClose"

নেমস্পেসের ভেতরের জাভাস্ক্রিপ্ট ফাংশনগুলো HTML API দ্বারা সমর্থিত নয়। এর পরিবর্তে, নেমস্পেস ছাড়া একটি গ্লোবাল জাভাস্ক্রিপ্ট ফাংশন ব্যবহার করুন। উদাহরণস্বরূপ, mylib.callback এর বদলে mylibCallback ব্যবহার করুন।

ডেটা-আইটিপি_সাপোর্ট

এই ফিল্ডটি নির্ধারণ করে যে ইন্টেলিজেন্ট ট্র্যাকিং প্রিভেনশন (ITP) সমর্থনকারী ব্রাউজারগুলিতে আপগ্রেড করা ওয়ান ট্যাপ ইউএক্স (One Tap UX) সক্রিয় করা হবে কি না। এর ডিফল্ট মান হলো 'ফলস' ( false )। আরও তথ্যের জন্য নিম্নলিখিত সারণিটি দেখুন:

প্রকার প্রয়োজনীয় উদাহরণ
বুলিয়ান ঐচ্ছিক data-itp_support="true"

ডেটা-লগইন_ইঙ্গিত

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

আরও তথ্যের জন্য, login_hint বিষয়ে OpenID Connect ডকুমেন্টেশন দেখুন।

প্রকার প্রয়োজনীয় উদাহরণ
স্ট্রিং। এটি একটি ইমেল ঠিকানা অথবা আইডি টোকেন থেকে প্রাপ্ত sub ফিল্ডের মান হতে পারে। ঐচ্ছিক data-login_hint="elisa.beckett@gmail.com"

ডেটা-এইচডি

যখন কোনো ব্যবহারকারীর একাধিক অ্যাকাউন্ট থাকে এবং শুধুমাত্র তার ওয়ার্কস্পেস অ্যাকাউন্ট দিয়ে সাইন-ইন করার প্রয়োজন হয়, তখন গুগলকে একটি ডোমেইন নামের ইঙ্গিত দিতে এটি ব্যবহার করুন। সফল হলে, অ্যাকাউন্ট নির্বাচনের সময় প্রদর্শিত ব্যবহারকারী অ্যাকাউন্টগুলো প্রদত্ত ডোমেইনের মধ্যে সীমাবদ্ধ থাকবে। একটি ওয়াইল্ডকার্ড ভ্যালু: * ব্যবহারকারীকে শুধুমাত্র ওয়ার্কস্পেস অ্যাকাউন্টগুলো অফার করে এবং অ্যাকাউন্ট নির্বাচনের সময় কনজিউমার অ্যাকাউন্ট (user@gmail.com) বাদ দেয়।

আরও তথ্যের জন্য, hd এর বিষয়ে OpenID Connect ডকুমেন্টেশন দেখুন।

প্রকার প্রয়োজনীয় উদাহরণ
স্ট্রিং। একটি পূর্ণাঙ্গ ডোমেইন নাম অথবা *। ঐচ্ছিক data-hd="*"

data-use_fedcm_for_prompt

ব্রাউজারকে ব্যবহারকারীর সাইন-ইন প্রম্পট নিয়ন্ত্রণ করতে এবং আপনার ওয়েবসাইট ও গুগলের মধ্যে সাইন-ইন প্রবাহে মধ্যস্থতা করার অনুমতি দিন। ডিফল্টরূপে এটি 'ফলস' থাকে। আরও তথ্যের জন্য 'মাইগ্রেট টু ফেডসিএম' পৃষ্ঠাটি দেখুন।

প্রকার প্রয়োজনীয় উদাহরণ
বুলিয়ান অপ্রচলিত data-use_fedcm_for_prompt="true"

বোতামের জন্য ডেটা-ব্যবহার_ফেডসিএম_

এই ফিল্ডটি নির্ধারণ করে যে Chrome (ডেস্কটপ M125+ এবং Android M128+)-এ FedCM বাটন UX ব্যবহার করা হবে কি না। ডিফল্ট মান হলো false । আরও তথ্যের জন্য নিচের সারণিটি দেখুন:

প্রকার প্রয়োজনীয় উদাহরণ
বুলিয়ান ঐচ্ছিক data-use_fedcm_for_button="true"

ডেটা-বোতাম_স্বয়ংক্রিয়_নির্বাচন

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

প্রকার প্রয়োজনীয় উদাহরণ
বুলিয়ান ঐচ্ছিক data-button_auto_select="true"

"g_id_signin" ক্লাসযুক্ত এলিমেন্ট

যদি আপনি কোনো এলিমেন্টের class অ্যাট্রিবিউটে g_id_signin যোগ করেন, তাহলে এলিমেন্টটি একটি 'Sign In With Google' বাটন হিসেবে রেন্ডার হয়।

আপনি একই পৃষ্ঠায় একাধিক ‘সাইন ইন উইথ গুগল’ বাটন প্রদর্শন করতে পারেন। প্রতিটি বাটনের নিজস্ব ভিজ্যুয়াল সেটিংস থাকতে পারে। এই সেটিংসগুলো নিম্নলিখিত ডেটা অ্যাট্রিবিউট দ্বারা সংজ্ঞায়িত করা হয়।

ভিজ্যুয়াল ডেটা অ্যাট্রিবিউট

নিম্নলিখিত সারণিতে ভিজ্যুয়াল ডেটার অ্যাট্রিবিউট এবং তাদের বিবরণ তালিকাভুক্ত করা হয়েছে:

বৈশিষ্ট্য
data-type বাটনের ধরণ: আইকন, অথবা সাধারণ বাটন।
data-theme বাটনের থিম। যেমন, filled_blue বা filled_black।
data-size বোতামের আকার। যেমন, ছোট বা বড়।
data-text বাটনের লেখা। যেমন, "গুগল দিয়ে সাইন ইন করুন" বা "গুগল দিয়ে সাইন আপ করুন"।
data-shape বোতামের আকৃতি। যেমন, আয়তাকার বা বৃত্তাকার।
data-logo_alignment গুগল লোগোর বিন্যাস: বামে অথবা কেন্দ্রে।
data-width বাটনটির প্রস্থ, পিক্সেলে।
data-locale বাটনের লেখাটি এই অ্যাট্রিবিউটে সেট করা ভাষায় প্রদর্শিত হয়।
data-click_listener সেট করা থাকলে, ‘Sign In With Google’ বোতামে ক্লিক করা হলে এই ফাংশনটি কল করা হয়।
data-state সেট করা থাকলে, এই স্ট্রিংটি আইডি টোকেনের সাথে ফেরত আসে।

অ্যাট্রিবিউটের প্রকারভেদ

নিম্নলিখিত বিভাগগুলিতে প্রতিটি অ্যাট্রিবিউটের প্রকার এবং একটি উদাহরণ সম্পর্কে বিস্তারিত তথ্য রয়েছে।

ডেটা-টাইপ

বাটনের ধরণ। এর ডিফল্ট মান হলো standard । আরও তথ্যের জন্য নিচের সারণিটি দেখুন:

প্রকার প্রয়োজনীয় উদাহরণ
স্ট্রিং হ্যাঁ data-type="icon"

নিম্নলিখিত সারণিতে উপলব্ধ সকল বাটনের প্রকারভেদ এবং তাদের বিবরণ তালিকাভুক্ত করা হলো:

প্রকার
standard
লেখা বা ব্যক্তিগত তথ্যসহ একটি বাটন।
icon
লেখা ছাড়া একটি আইকন বাটন।

ডেটা-থিম

বাটনের থিম। এর ডিফল্ট মান হলো outline । আরও তথ্যের জন্য নিচের সারণিটি দেখুন:

প্রকার প্রয়োজনীয় উদাহরণ
স্ট্রিং ঐচ্ছিক data-theme="filled_blue"

নিম্নলিখিত সারণিতে উপলব্ধ থিম এবং তাদের বিবরণ তালিকাভুক্ত করা হলো:

থিম
outline
সাদা পটভূমি সহ একটি সাধারণ বোতামসাদা পটভূমি সহ একটি আইকন বোতামসাদা পটভূমি সহ একটি ব্যক্তিগতকৃত বোতাম
স্ট্যান্ডার্ড বাটন থিম।
filled_blue
নীল পটভূমি সহ একটি সাধারণ বোতামনীল পটভূমি সহ একটি আইকন বোতামনীল পটভূমি সহ একটি ব্যক্তিগতকৃত বোতাম
নীল রঙে ভরা বোতামের থিম।
filled_black
কালো পটভূমি সহ একটি সাধারণ বোতামকালো পটভূমি সহ একটি আইকন বোতামকালো পটভূমি সহ একটি ব্যক্তিগতকৃত বোতাম
কালো রঙে ভরা বোতামের থিম।

ডেটা-আকার

বাটনের আকার। এর ডিফল্ট মান হলো large । আরও তথ্যের জন্য নিচের সারণিটি দেখুন:

প্রকার প্রয়োজনীয় উদাহরণ
স্ট্রিং ঐচ্ছিক data-size="small"

নিচের সারণিতে উপলব্ধ বোতামের আকার এবং সেগুলোর বিবরণ দেওয়া হলো।

আকার
large
একটি বড় স্ট্যান্ডার্ড বোতামএকটি বড় আইকন বোতামএকটি বড়, ব্যক্তিগতকৃত বোতাম
একটি বড় বোতাম।
medium
একটি মাঝারি মানের বোতামএকটি মাঝারি আইকন বোতাম
একটি মাঝারি আকারের বোতাম।
small
একটি ছোট সাইন-ইন বোতামএকটি ছোট আইকন বোতাম
একটি ছোট বোতাম।

ডেটা-টেক্সট

বাটনের টেক্সট। এর ডিফল্ট মান হলো signin_with । যেসব আইকন বাটনের data-text অ্যাট্রিবিউট ভিন্ন, তাদের টেক্সটের মধ্যে কোনো দৃশ্যমান পার্থক্য নেই। একমাত্র ব্যতিক্রম হলো যখন স্ক্রিন অ্যাক্সেসিবিলিটির জন্য টেক্সটটি পড়া হয়।

আরও তথ্যের জন্য নিচের সারণিটি দেখুন:

প্রকার প্রয়োজনীয় উদাহরণ
স্ট্রিং ঐচ্ছিক data-text="signup_with"

নিম্নলিখিত সারণিতে উপলব্ধ বাটনের লেখা এবং তাদের বিবরণ তালিকাভুক্ত করা হলো:

পাঠ্য
signin_with
'গুগল দিয়ে সাইন ইন করুন' লেবেলযুক্ত একটি সাধারণ বোতামএকটি আইকন বোতাম, যাতে কোনো দৃশ্যমান লেখা নেই
বাটনটির লেখাটি হলো "গুগল দিয়ে সাইন ইন করুন"।
signup_with
'গুগল দিয়ে সাইন আপ করুন' লেবেলযুক্ত একটি সাধারণ বোতাম।একটি আইকন বোতাম, যাতে কোনো দৃশ্যমান লেখা নেই
বাটনটির লেখাটি হলো "গুগল দিয়ে সাইন আপ করুন"।
continue_with
'Continue with Google' লেবেলযুক্ত একটি স্ট্যান্ডার্ড বাটনএকটি আইকন বোতাম, যাতে কোনো দৃশ্যমান লেখা নেই
বাটনটির লেখাটি হলো "Google-এর সাথে চালিয়ে যান"।
signin
'সাইন ইন' লেবেলযুক্ত একটি সাধারণ বোতামএকটি আইকন বোতাম, যাতে কোনো দৃশ্যমান লেখা নেই
বাটনটির লেখা হলো "সাইন ইন"।

ডেটা-আকৃতি

বাটনের আকৃতি। এর ডিফল্ট মান হলো rectangular । আরও তথ্যের জন্য নিচের সারণিটি দেখুন:

প্রকার প্রয়োজনীয় উদাহরণ
স্ট্রিং ঐচ্ছিক data-shape="rectangular"

নিম্নলিখিত সারণিতে উপলব্ধ বোতামের আকার এবং তাদের বিবরণ তালিকাভুক্ত করা হলো:

আকৃতি
rectangular
একটি আয়তাকার স্ট্যান্ডার্ড বোতামএকটি আয়তক্ষেত্রাকার আইকন বোতামএকটি আয়তাকার ব্যক্তিগতকৃত বোতাম
আয়তাকার বাটন। icon বাটন টাইপের জন্য ব্যবহার করা হলে, এটি square মতোই।
pill
একটি পিল-আকৃতির স্ট্যান্ডার্ড বোতামএকটি পিল-আকৃতির আইকন বোতামএকটি পিল-আকৃতির ব্যক্তিগতকৃত বোতাম
বড়ি-আকৃতির বাটন। যদি icon বাটন টাইপের জন্য ব্যবহার করা হয়, তাহলে এটি circle মতোই।
circle
একটি বৃত্তাকার স্ট্যান্ডার্ড বোতামএকটি বৃত্তাকার আইকন বোতামএকটি গোলাকার ব্যক্তিগতকৃত বোতাম
বৃত্তাকার বোতাম। যদি এটি standard বোতামের ধরন হিসেবে ব্যবহৃত হয়, তাহলে এটি pill মতোই।
square
একটি বর্গাকার স্ট্যান্ডার্ড বোতামএকটি বর্গাকার আইকন বোতামএকটি বর্গাকার ব্যক্তিগতকৃত বোতাম
বর্গাকার বোতাম। যদি এটি standard বোতামের ক্ষেত্রে ব্যবহৃত হয়, তবে এটি rectangular মতোই।

ডেটা-লোগো_অ্যালাইনমেন্ট

গুগল লোগোর অ্যালাইনমেন্ট। এর ডিফল্ট মান হলো left । এই অ্যাট্রিবিউটটি শুধুমাত্র standard বাটন টাইপের ক্ষেত্রে প্রযোজ্য। আরও তথ্যের জন্য নিচের সারণিটি দেখুন:

প্রকার প্রয়োজনীয় উদাহরণ
স্ট্রিং ঐচ্ছিক data-logo_alignment="center"

নিম্নলিখিত সারণিতে উপলব্ধ অ্যালাইনমেন্টসমূহ এবং তাদের বিবরণ তালিকাভুক্ত করা হলো:

লোগো_অ্যালাইনমেন্ট
left
বাম দিকে G লোগো সহ একটি সাধারণ বোতাম
গুগল লোগোটিকে বাম দিকে সারিবদ্ধ করে।
center
মাঝখানে G লোগো সহ একটি সাধারণ বোতাম
গুগল লোগোটিকে কেন্দ্রে সারিবদ্ধ করে।

ডেটা-প্রস্থ

বাটনের সর্বনিম্ন প্রস্থ, পিক্সেলে। সর্বোচ্চ উপলব্ধ প্রস্থ হলো ৪০০ পিক্সেল।

আরও তথ্যের জন্য নিচের সারণিটি দেখুন:

প্রকার প্রয়োজনীয় উদাহরণ
স্ট্রিং ঐচ্ছিক data-width=400

ডেটা-লোকেল

ঐচ্ছিক। নির্দিষ্ট লোকেল ব্যবহার করে বাটনের টেক্সট প্রদর্শন করুন, অন্যথায় এটি ব্যবহারকারীর গুগল অ্যাকাউন্ট বা ব্রাউজার সেটিংসে ডিফল্ট হবে। লাইব্রেরি লোড করার সময় src ডিরেক্টিভে hl প্যারামিটার এবং ল্যাঙ্গুয়েজ কোড যোগ করুন, উদাহরণস্বরূপ: gsi/client?hl=<iso-639-code> ।

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

আরও তথ্যের জন্য নিচের সারণিটি দেখুন:

প্রকার প্রয়োজনীয় উদাহরণ
স্ট্রিং ঐচ্ছিক data-locale="zh_CN"

ডেটা-ক্লিক_লিসেনার

data-click_listener অ্যাট্রিবিউট ব্যবহার করে আপনি একটি জাভাস্ক্রিপ্ট ফাংশন নির্ধারণ করতে পারেন, যা `Sign in with Google` বাটনটি ক্লিক করা হলে কল করা হবে।

  <script>
    function onClickHandler(){
      console.log("Sign in with Google button clicked...")
    }
  </script>
  .....
  <div class="g_id_signin"
      data-size="large"
      data-theme="outline"
      data-click_listener="onClickHandler">
  </div>

এই উদাহরণে, যখন 'Sign in with Google' বোতামটি ক্লিক করা হয়, তখন 'Sign in with Google button clicked...' বার্তাটি কনসোলে লগ করা হয়।

ডেটা-অবস্থা

এটি ঐচ্ছিক, যেহেতু একই পৃষ্ঠায় একাধিক ‘গুগল দিয়ে সাইন ইন করুন’ বাটন দেখানো যেতে পারে, তাই আপনি প্রতিটি বাটনকে একটি অনন্য স্ট্রিং দিয়ে দিতে পারেন। আইডি টোকেনের সাথে একই স্ট্রিংটি ফেরত আসবে, ফলে আপনি শনাক্ত করতে পারবেন যে ব্যবহারকারী সাইন ইন করার জন্য কোন বাটনটি ক্লিক করেছেন।

আরও তথ্যের জন্য নিচের সারণিটি দেখুন:

প্রকার প্রয়োজনীয় উদাহরণ
স্ট্রিং ঐচ্ছিক data-state="button 1"

সার্ভার-সাইড ইন্টিগ্রেশন

আপনার সার্ভার-সাইড এন্ডপয়েন্টগুলোকে অবশ্যই নিম্নলিখিত HTTP POST অনুরোধগুলো পরিচালনা করতে হবে।

আইডি টোকেন হ্যান্ডলার এন্ডপয়েন্ট

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

আপনার লগইন এন্ডপয়েন্টে একটি অনুরোধের উদাহরণ:

POST /login HTTP/1.1
Content-Type: application/x-www-form-urlencoded
Cookie: g_csrf_token=<RANDOM_STRING>
Host: www.example.com

credential=<JWT_ENCODED_ID_TOKEN>&g_csrf_token=<RANDOM_STRING>

HTTP POST অনুরোধটিতে নিম্নলিখিত তথ্য থাকে:

ফর্ম্যাট নাম বর্ণনা
কুকি g_csrf_token data-login_uri দ্বারা নির্দিষ্ট লগইন এন্ডপয়েন্টে করা প্রতিটি অনুরোধের সাথে পরিবর্তিত হওয়া একটি র‍্যান্ডম স্ট্রিং, অবশ্যই g_csrf_token রিকোয়েস্ট প্যারামিটারের মানের সাথে মিলতে হবে।
অনুরোধ প্যারামিটার g_csrf_token data-login_uri দ্বারা নির্দিষ্ট লগইন এন্ডপয়েন্টে প্রতিটি অনুরোধের সাথে পরিবর্তিত হওয়া একটি র‍্যান্ডম স্ট্রিং অবশ্যই g_csrf_token কুকির মানের সাথে মিলতে হবে।
অনুরোধ প্যারামিটার credential গুগল কর্তৃক ইস্যুকৃত এনকোডেড JWT আইডি টোকেন।
অনুরোধ প্যারামিটার select_by ব্যবহারকারী যেভাবে সাইন ইন করেছেন।
অনুরোধ প্যারামিটার state এই প্যারামিটারটি শুধুমাত্র তখনই সংজ্ঞায়িত হয়, যখন ব্যবহারকারী সাইন ইন করার জন্য 'Sign in with Google' বোতামে ক্লিক করেন এবং বোতামটির ' state অ্যাট্রিবিউটটি নির্দিষ্ট করা থাকে।

শংসাপত্র

ডিকোড করা হলে, আইডি টোকেনটি নিচের উদাহরণের মতো দেখায়:

header
{
  "alg": "RS256",
  "kid": "f05415b13acb9590f70df862765c655f5a7a019e", // JWT signature
  "typ": "JWT"
}
payload
{
  "iss": "https://accounts.google.com", // The JWT's issuer
  "nbf":  161803398874,
  "aud": "314159265-pi.apps.googleusercontent.com", // Your server's client ID
  "sub": "3141592653589793238", // The unique ID of the user's Google Account
  "hd": "gmail.com", // If present, the host domain of the user's Google Workspace email address
  "auth_time": 1748875426,
  "amr": ["mfa", "pwd", "tel"],
  "email": "elisa.g.beckett@gmail.com", // The user's email address
  "email_verified": true, // true, if Google has verified the email address
  "azp": "314159265-pi.apps.googleusercontent.com",
  "name": "Elisa Beckett",
                            // If present, a URL to user's profile picture
  "picture": "https://lh3.googleusercontent.com/a-/e2718281828459045235360uler",
  "given_name": "Eliza",
  "family_name": "Beckett",
  "iat": 1596474000, // Unix timestamp of the assertion creation time
  "exp": 1596477600, // Unix timestamp of the assertion expiration time
  "jti": "abc161803398874def"
}

ক্লায়েন্টদের অবশ্যই অস্বীকৃত JWT দাবি উপেক্ষা করতে হবে।

sub ফিল্ডটি গুগল অ্যাকাউন্টের জন্য একটি বিশ্বব্যাপী অনন্য শনাক্তকারী। ব্যবহারকারীর শনাক্তকারী হিসেবে শুধুমাত্র sub ফিল্ড ব্যবহার করুন, কারণ এটি সমস্ত গুগল অ্যাকাউন্টের মধ্যে অনন্য এবং কখনও পুনরায় ব্যবহার করা হয় না।

email , email_verified এবং hd ফিল্ডগুলো ব্যবহার করে আপনি নির্ধারণ করতে পারেন যে কোনো ইমেল অ্যাড্রেস গুগল দ্বারা হোস্ট করা হয় এবং এর জন্য গুগল নির্ভরযোগ্য কিনা। যেসব ক্ষেত্রে গুগল নির্ভরযোগ্য হয়, সেসব ক্ষেত্রে ব্যবহারকারীই যে অ্যাকাউন্টের বৈধ মালিক, তা নিশ্চিত করা হয়।

যেসব ক্ষেত্রে গুগল নির্ভরযোগ্য:

  • email শেষে @gmail.com সাফিক্স আছে, এটি একটি জিমেইল অ্যাকাউন্ট।
  • email_verified true এবং hd সেট করা আছে, এটি একটি গুগল ওয়ার্কস্পেস অ্যাকাউন্ট।

ব্যবহারকারীরা জিমেইল বা গুগল ওয়ার্কস্পেস ব্যবহার না করেও গুগল অ্যাকাউন্টের জন্য নিবন্ধন করতে পারেন। যখন email @gmail.com সাফিক্স থাকে না এবং hd অনুপস্থিত থাকে, তখন গুগল নির্ভরযোগ্য বলে বিবেচিত হয় না এবং ব্যবহারকারীকে যাচাই করার জন্য পাসওয়ার্ড বা অন্যান্য যাচাইকরণ পদ্ধতি ব্যবহার করার পরামর্শ দেওয়া হয়। email_verified মানও true হতে পারে, কারণ গুগল অ্যাকাউন্ট তৈরি করার সময় গুগল প্রাথমিকভাবে ব্যবহারকারীকে যাচাই করেছিল, তবে এর মধ্যে তৃতীয় পক্ষের ইমেল অ্যাকাউন্টের মালিকানা পরিবর্তিত হয়ে থাকতে পারে।

` exp ফিল্ডটি আপনার সার্ভার সাইডে টোকেনটি যাচাই করার জন্য মেয়াদ শেষ হওয়ার সময় দেখায়। `Sign In With Google` থেকে প্রাপ্ত আইডি টোকেনের জন্য এই মেয়াদ এক ঘণ্টা। মেয়াদ শেষ হওয়ার আগেই আপনাকে টোকেনটি যাচাই করতে হবে। সেশন ম্যানেজমেন্টের জন্য exp ব্যবহার করবেন না। একটি মেয়াদোত্তীর্ণ আইডি টোকেনের অর্থ এই নয় যে ব্যবহারকারী সাইন আউট হয়ে গেছেন। আপনার ব্যবহারকারীদের সেশন ম্যানেজমেন্টের দায়িত্ব আপনার অ্যাপের।

g_csrf_token

একটি জালিয়াতি-রোধী স্টেট টোকেন। এটি gsi/client লাইব্রেরি দ্বারা তৈরি একটি ক্রস-সাইট রিকোয়েস্ট ফোরজারি (CSRF) টোকেন। POST পেলোড বডিতে কুকি এবং রিকোয়েস্ট প্যারামিটার উভয় হিসেবেই একটি র‍্যান্ডম ভ্যালু অন্তর্ভুক্ত থাকে। আপনার সার্ভারে রিকোয়েস্টটি প্রসেস করার সময় যদি এই দুটি ভ্যালু না মেলে, তাহলে রিকোয়েস্টটিকে অবৈধ বলে গণ্য করা উচিত।

নির্বাচন_দ্বারা

নিম্নলিখিত সারণিতে select_by ফিল্ডের সম্ভাব্য মানগুলি তালিকাভুক্ত করা হয়েছে। ব্যবহৃত বাটনের ধরন, সেশন এবং সম্মতির অবস্থা মানটি নির্ধারণ করতে ব্যবহৃত হয়।

  • ব্যবহারকারী হয় ‘ওয়ান ট্যাপ’ বা ‘সাইন ইন উইথ গুগল’ বোতামটি টিপেছেন অথবা স্পর্শবিহীন স্বয়ংক্রিয় সাইন-ইন প্রক্রিয়াটি ব্যবহার করেছেন।

  • একটি বিদ্যমান সেশন পাওয়া গেছে, অথবা ব্যবহারকারী একটি নতুন সেশন তৈরি করার জন্য একটি গুগল অ্যাকাউন্ট নির্বাচন করে তাতে সাইন-ইন করেছেন।

  • আপনার অ্যাপের সাথে আইডি টোকেন ক্রেডেনশিয়াল শেয়ার করার আগে ব্যবহারকারী হয়

    • পরিচয়পত্র শেয়ার করার সম্মতি জানাতে 'নিশ্চিত করুন' বোতামটি টিপেছেন, অথবা
    • পূর্বে সম্মতি দিয়েছিলাম এবং একটি গুগল অ্যাকাউন্ট বেছে নেওয়ার জন্য 'একটি অ্যাকাউন্ট নির্বাচন করুন' বিকল্পটি ব্যবহার করেছিলাম।

এই ফিল্ডের মান নিম্নলিখিত প্রকারগুলির মধ্যে একটিতে সেট করা হয়,

মূল্য বর্ণনা
auto বিদ্যমান সেশনসহ এমন একজন ব্যবহারকারীর স্বয়ংক্রিয় সাইন-ইন, যিনি পূর্বে ক্রেডেনশিয়াল শেয়ার করার জন্য সম্মতি দিয়েছিলেন। এটি শুধুমাত্র ফেডসিএম (FedCM) সমর্থিত নয় এমন ব্রাউজারগুলোর ক্ষেত্রে প্রযোজ্য।
user বিদ্যমান সেশন থাকা একজন ব্যবহারকারী, যিনি পূর্বে সম্মতি দিয়েছিলেন, ক্রেডেনশিয়াল শেয়ার করার জন্য ওয়ান ট্যাপ 'Continue as' বোতামটি চাপেন। এটি শুধুমাত্র ফেডসিএম (FedCM) সমর্থিত নয় এমন ব্রাউজারগুলির জন্য প্রযোজ্য।
fedcm একজন ব্যবহারকারী FedCM ব্যবহার করে ক্রেডেনশিয়াল শেয়ার করার জন্য ওয়ান ট্যাপ 'Continue as' বোতামটি চাপ দিয়েছেন। এটি শুধুমাত্র FedCM সমর্থিত ব্রাউজারগুলির জন্য প্রযোজ্য।
fedcm_auto বিদ্যমান সেশনসহ এমন একজন ব্যবহারকারীর স্বয়ংক্রিয় সাইন-ইন, যিনি পূর্বে FedCM One Tap ব্যবহার করে ক্রেডেনশিয়াল শেয়ার করার জন্য সম্মতি দিয়েছিলেন। এটি শুধুমাত্র FedCM সমর্থিত ব্রাউজারগুলোর জন্য প্রযোজ্য।
user_1tap বিদ্যমান সেশন থাকা একজন ব্যবহারকারী সম্মতি প্রদান করতে এবং ক্রেডেনশিয়াল শেয়ার করতে ওয়ান ট্যাপ 'Continue as' বোতামটি চাপ দিয়েছেন। এটি শুধুমাত্র Chrome v75 এবং তার পরবর্তী সংস্করণগুলিতে প্রযোজ্য।
user_2tap যে ব্যবহারকারীর কোনো সেশন আগে থেকে ছিল না, তিনি একটি অ্যাকাউন্ট বেছে নেওয়ার জন্য ‘ওয়ান ট্যাপ কন্টিনিউ অ্যাজ’ বোতামটি চাপেন এবং তারপর সম্মতি প্রদান ও ক্রেডেনশিয়াল শেয়ার করার জন্য একটি পপ-আপ উইন্ডোতে থাকা ‘কনফার্ম’ বোতামটি চাপেন। এটি নন-ক্রোমিয়াম ভিত্তিক ব্রাউজারগুলোর ক্ষেত্রে প্রযোজ্য।
itp একজন ব্যবহারকারী, যিনি পূর্বে সম্মতি দিয়েছিলেন, তিনি আইটিপি ব্রাউজারগুলিতে ওয়ান ট্যাপ চাপলেন।
itp_confirm যে ব্যবহারকারী সম্মতি দেননি, তিনি আইটিপি ব্রাউজারে থাকা 'ওয়ান ট্যাপ' বোতামটি চেপে সম্মতি প্রদান করেন এবং ক্রেডেনশিয়াল শেয়ার করেন।
btn একজন ব্যবহারকারী, যিনি পূর্বে সম্মতি দিয়েছিলেন, তিনি ক্রেডেনশিয়াল শেয়ার করার জন্য 'Sign In With Google' বোতামটি চাপেন এবং 'Choose an Account' থেকে একটি গুগল অ্যাকাউন্ট বেছে নেন।
btn_confirm যে ব্যবহারকারী সম্মতি দেননি, তিনি ‘Sign In With Google’ বোতামটি চাপেন এবং সম্মতি প্রদান ও ক্রেডেনশিয়াল শেয়ার করার জন্য ‘Continue’ বোতামটি চাপেন।

রাজ্য

এই প্যারামিটারটি শুধুমাত্র তখনই সংজ্ঞায়িত হয় যখন ব্যবহারকারী সাইন ইন করার জন্য 'Sign in with Google' বোতামে ক্লিক করেন এবং ক্লিক করা বোতামটির ' data-state অ্যাট্রিবিউটটি নির্দিষ্ট করা থাকে। এই ফিল্ডের মান হলো সেই একই মান যা আপনি বোতামটির ' data-state অ্যাট্রিবিউটে নির্দিষ্ট করেছেন।

যেহেতু একই পেজে একাধিক 'সাইন ইন উইথ গুগল' বাটন দেখানো যায়, তাই আপনি প্রতিটি বাটনকে একটি অনন্য স্ট্রিং দিয়ে দিতে পারেন। ফলে, ব্যবহারকারী সাইন ইন করার জন্য কোন বাটনটি ক্লিক করেছেন তা শনাক্ত করতে আপনি এই state প্যারামিটারটি ব্যবহার করতে পারেন।

পাসওয়ার্ড ক্রেডেনশিয়াল হ্যান্ডলার এন্ডপয়েন্ট

পাসওয়ার্ড ক্রেডেনশিয়াল হ্যান্ডলার এন্ডপয়েন্টটি বিল্ট-ইন ক্রেডেনশিয়াল ম্যানেজার দ্বারা সংগৃহীত পাসওয়ার্ড ক্রেডেনশিয়ালগুলো প্রসেস করে।

HTTP POST অনুরোধটিতে নিম্নলিখিত তথ্য থাকে:

ফর্ম্যাট নাম বর্ণনা
কুকি g_csrf_token data-native_login_uri দ্বারা নির্দিষ্ট লগইন এন্ডপয়েন্টে প্রতিটি অনুরোধের সাথে পরিবর্তিত হওয়া একটি র‍্যান্ডম স্ট্রিং, অবশ্যই g_csrf_token অনুরোধ প্যারামিটারের মানের সাথে মিলতে হবে।
অনুরোধ প্যারামিটার g_csrf_token data-native_login_uri দ্বারা নির্দিষ্ট লগইন এন্ডপয়েন্টে প্রতিটি অনুরোধের সাথে পরিবর্তিত হওয়া একটি র‍্যান্ডম স্ট্রিং অবশ্যই g_csrf_token কুকির মানের সাথে মিলতে হবে।
অনুরোধ প্যারামিটার email এই আইডি টোকেনটি গুগল ইস্যু করে।
অনুরোধ প্যারামিটার password কীভাবে শংসাপত্রটি নির্বাচন করা হয়।