Google-এর মাধ্যমে সাইন-ইন করুন জাভাস্ক্রিপ্ট API রেফারেন্স

এই রেফারেন্স পৃষ্ঠায় 'Google-এর মাধ্যমে সাইন-ইন করুন' জাভাস্ক্রিপ্ট API-এর বিবরণ দেওয়া হয়েছে, যা ওয়েব পৃষ্ঠায় 'Google-এর মাধ্যমে সাইন-ইন করুন' বোতাম বা One Tap প্রম্পট দেখাতে ব্যবহার করা হয়।

পদ্ধতি: google.accounts.id.initialize

google.accounts.id.initialize পদ্ধতিটি কনফিগারেশন অবজেক্টের উপর ভিত্তি করে 'Google-এর মাধ্যমে সাইন-ইন করুন' ক্লায়েন্টকে ইনিশিয়ালাইজ করে। পদ্ধতির জন্য নিম্নলিখিত কোডের উদাহরণ দেখুন:

google.accounts.id.initialize(IdConfiguration)

নিম্নলিখিত কোডের উদাহরণ onload ফাংশনের সাথে google.accounts.id.initialize পদ্ধতি প্রয়োগ করে:

<script>
  window.onload = function () {
    google.accounts.id.initialize({
      client_id: 'YOUR_GOOGLE_CLIENT_ID',
      callback: handleCredentialResponse
    });
    google.accounts.id.prompt();
  };
</script>

google.accounts.id.initialize পদ্ধতিটি একটি 'Google-এর মাধ্যমে সাইন-ইন করুন' ক্লায়েন্ট ইনস্ট্যান্স তৈরি করে যা একই ওয়েব পৃষ্ঠার সব মডিউল দ্বারা অন্তর্নিহিতভাবে ব্যবহার করা যেতে পারে।

  • একই ওয়েবপেজে একাধিক মডিউল (যেমন, ওয়ান ট্যাপ, পছন্দমতো বোতাম, প্রত্যাহার ইত্যাদি) ব্যবহার করলেও, আপনাকে শুধু একবার google.accounts.id.initialize মেথড কল করতে হবে।
  • আপনি google.accounts.id.initialize পদ্ধতি একাধিকবার কল করলে, শুধুমাত্র শেষ কলের কনফিগারেশন মনে রাখা এবং ব্যবহার করা হয়।

আপনি যখনই google.accounts.id.initialize মেথড কল করেন, তখনই কনফিগারেশন রিসেট করেন এবং একই ওয়েবপেজে পরবর্তী সব মেথড অবিলম্বে নতুন কনফিগারেশন ব্যবহার করে।

ডেটার ধরন: IdConfiguration

নিম্নলিখিত সারণীতে IdConfiguration ডেটার ধরন ও ফিল্ডের তালিকা দেওয়া হয়েছে:

ফিল্ড
client_id আপনার অ্যাপ্লিকেশনের ক্লায়েন্ট আইডি
color_scheme One Tap প্রম্পটে রঙের স্কিম প্রয়োগ করা হয়েছে।
auto_select অটোমেটিক বেছে নেওয়ার সুবিধা চালু করে।
callback জাভাস্ক্রিপ্ট ফাংশন যা আইডি টোকেন ম্যানেজ করে। Google One Tap এবং 'Google-এর মাধ্যমে সাইন-ইন করুন' বোতাম popup UX মোড এই অ্যাট্রিবিউট ব্যবহার করে।
login_uri আপনার লগ-ইন এন্ডপয়েন্টের URL। 'Google-এর মাধ্যমে সাইন-ইন করুন' বোতাম redirect UX মোড এই অ্যাট্রিবিউট ব্যবহার করে।
native_callback জাভাস্ক্রিপ্ট ফাংশন যা পাসওয়ার্ড ক্রেডেনশিয়াল ম্যানেজ করে।
cancel_on_tap_outside ব্যবহারকারী প্রম্পটের বাইরে ক্লিক করলে প্রম্পট বাতিল করে দেয়।
prompt_parent_id One Tap প্রম্পট কন্টেনার এলিমেন্টের DOM আইডি
nonce ID টোকেনের জন্য একটি র‍্যান্ডম স্ট্রিং
essential_claims Google-এর মাধ্যমে ফেরত পাঠানো ID টোকেনে অন্তর্ভুক্ত করার জন্য অতিরিক্ত দাবি।
context 'একবার ট্যাপ করুন' প্রম্পটের শীর্ষক ও শব্দ
state_cookie_domain আপনি যদি পেরেন্ট ডোমেন এবং এর সাবডোমেনে One Tap কল করতে চান, তাহলে এই ফিল্ডে পেরেন্ট ডোমেন পাস করুন যাতে একটি শেয়ার করা কুকি ব্যবহার করা হয়।
ux_mode 'Google-এর মাধ্যমে সাইন-ইন করুন' বোতামের UX ফ্লো
allowed_parent_origin ইন্টারমিডিয়েট iframe এম্বেড করার অনুমতিপ্রাপ্ত অরিজিন। এই ফিল্ড থাকলে, ইন্টারমিডিয়েট iframe মোডে One Tap রান করে।
intermediate_iframe_close_callback ব্যবহারকারী ম্যানুয়ালি One Tap বন্ধ করলে, ডিফল্ট ইন্টারমিডিয়েট iframe আচরণ ওভাররাইড করে।
itp_support ITP ব্রাউজারে আপগ্রেড করা ওয়ান ট্যাপ UX চালু করে।
login_hint ব্যবহারকারীর ইঙ্গিত প্রদান করে অ্যাকাউন্ট বেছে নেওয়ার প্রসেস এড়িয়ে যান।
hd ডোমেন অনুযায়ী অ্যাকাউন্ট বেছে নেওয়ার সীমা।
use_fedcm_for_prompt ব্রাউজারকে ব্যবহারকারীর সাইন-ইন প্রম্পট কন্ট্রোল করতে এবং আপনার ওয়েবসাইট ও Google-এর মধ্যে সাইন-ইন ফ্লো মধ্যস্থতা করার অনুমতি দিন।
use_fedcm_for_button FedCM বোতাম UX Chrome-এ ব্যবহার করা উচিত কিনা তা এই ফিল্ড নির্ধারণ করে (ডেস্কটপ M125+ এবং Android M128+)। ডিফল্ট হিসেবে false-এ সেট করা থাকে।
button_auto_select FedCM বোতাম ফ্লোয়ের জন্য অটোমেটিক বেছে নিন বিকল্প চালু করা হবে কিনা। চালু করা থাকলে, অ্যাক্টিভ Google সেশন সহ ফিরে আসা ব্যবহারকারীরা অ্যাকাউন্ট বাছাইকারী প্রম্পট বাইপাস করে অটোমেটিক সাইন-ইন হয়ে যাবেন। ডিফল্ট ভ্যালু হল false।

client_id

এই ফিল্ডটি হল আপনার অ্যাপ্লিকেশনের ক্লায়েন্ট আইডি, যা Google Cloud কনসোলে খুঁজে পাওয়া এবং তৈরি করা হয়। আরও তথ্যের জন্য নিম্নলিখিত টেবিল দেখুন:

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

color_scheme

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

ধরন প্রয়োজনীয় উদাহরণ
স্ট্রিং ঐচ্ছিক। ব্যবহারকারীর সিস্টেমের ডিফল্ট রঙের স্কিমে সেট করা থাকে। color_scheme: "dark"

নিচের সারণীতে উপলভ্য রঙের স্কিম ও সেগুলির বিবরণ দেওয়া আছে।

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

auto_select

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

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

কলব্যাক

এই ফিল্ডটি হল JavaScript ফাংশন যা One Tap প্রম্পট বা পপ-আপ উইন্ডো থেকে রিটার্ন করা আইডি টোকেন ম্যানেজ করে। Google One Tap বা 'Google-এর মাধ্যমে সাইন-ইন করুন' বোতামের popup UX মোড ব্যবহার করা হলে এই অ্যাট্রিবিউট প্রয়োজন। আরও তথ্যের জন্য নিচের সারণী দেখুন:

ধরন প্রয়োজনীয় উদাহরণ
ফাংশন 'এক ট্যাপ' ও popup UX মোডের জন্য প্রয়োজন callback: handleResponse

login_uri

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

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

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

ব্যবহারকারী 'Google-এর মাধ্যমে সাইন-ইন করুন' বোতামে ক্লিক করলে এবং রিডাইরেক্ট UX মোড ব্যবহার করা হলে, আইডি টোকেন ক্রেডেনশিয়াল রেসপন্স আপনার লগ-ইন এন্ডপয়েন্টে পোস্ট করা হয়।

আরও তথ্যের জন্য নিম্নলিখিত টেবিল দেখুন:

ধরন ঐচ্ছিক উদাহরণ
ইউআরএল ডিফল্ট হিসেবে বর্তমান পৃষ্ঠার URI বা আপনার উল্লেখ করা ভ্যালু ব্যবহার করা হয়।
ux_mode: "redirect" সেট করা থাকলে তবেই ব্যবহার করা হয়।		 login_uri: "https://www.example.com/login"

আপনার লগ-ইন এন্ডপয়েন্ট অবশ্যই POST অনুরোধগুলি পরিচালনা করবে যাতে একটি credential প্যারামিটার থাকে বডিতে একটি আইডি টোকেন মান সহ। select_by, HTTP POST-এ অন্তর্ভুক্ত নয় login_uri বা data-login_uri-এর জন্য অনুরোধ এবং শুধুমাত্র CredentialResponse অবজেক্টে ফেরত পাঠানো হয় যা জাভাস্ক্রিপ্ট callback ফাংশনে পাস করা হয়।

native_callback

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

ধরন প্রয়োজনীয় উদাহরণ
ফাংশন ঐচ্ছিক native_callback: handleResponse

cancel_on_tap_outside

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

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

prompt_parent_id

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

ধরন প্রয়োজনীয় উদাহরণ
স্ট্রিং ঐচ্ছিক prompt_parent_id: 'parent_id'

নন্স

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

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

আপনার এনভায়রনমেন্টে কাজ করে এমন সর্বাধিক JWT সাইজ এবং ব্যক্তিগত ব্রাউজার ও সার্ভার HTTP সাইজের সীমাবদ্ধতা অনুযায়ী ননসের দৈর্ঘ্য সীমিত করা হয়।

essential_claims

এই ফিল্ডটি হল একটি স্ট্রিং যা Google-এর ফেরত দেওয়া ID টোকেনে অতিরিক্ত দাবি অন্তর্ভুক্ত করার জন্য অনুরোধ করতে ব্যবহার করা হয়। Google-এর গ্রহণ করা দাবির সম্পূর্ণ তালিকা দেখতে কাজ করে এমন দাবি দেখুন।

আরও তথ্যের জন্য নিম্নলিখিত টেবিল দেখুন:

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

প্রসঙ্গ

এই ফিল্ডটি One Tap প্রম্পটে দেখানো শীর্ষক ও মেসেজের টেক্সট পরিবর্তন করে, ITP ব্রাউজারের ক্ষেত্রে কোনও প্রভাব পড়ে না। ডিফল্ট হিসেবে signin সেট করা থাকে।

আরও তথ্যের জন্য নিম্নলিখিত টেবিল দেখুন:

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

নিচের সারণীতে উপলভ্য সব প্রসঙ্গ ও সেগুলির বিবরণ তালিকাভুক্ত করা হয়েছে:

প্রসঙ্গ
signin "এতে সাইন-ইন করুন"
signup "এতে সাইন-আপ করুন"
use "ব্যবহার করুন"

আপনি যদি পেরেন্ট ডোমেন এবং এর সাবডোমেনে One Tap দেখাতে চান, তাহলে এই ফিল্ডে পেরেন্ট ডোমেন পাস করুন যাতে একটি শেয়ার করা-স্টেট কুকি ব্যবহার করা হয়। আরও তথ্যের জন্য নিচের সারণী দেখুন:

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

ux_mode

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

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

নিচের সারণীতে উপলভ্য UX মোড ও সেগুলির বিবরণ তালিকাভুক্ত করা হয়েছে।

UX মোড
popup পপ-আপ উইন্ডোতে সাইন-ইন UX ফ্লো পারফর্ম করে।
redirect সম্পূর্ণ পৃষ্ঠা রিডাইরেকশনের মাধ্যমে সাইন-ইন UX ফ্লো পারফর্ম করে।

allowed_parent_origin

ইন্টারমিডিয়েট iframe এম্বেড করার অনুমতিপ্রাপ্ত অরিজিন। এই ফিল্ড থাকলে, ইন্টারমিডিয়েট iframe মোডে One Tap রান করে। আরও তথ্যের জন্য নিম্নলিখিত টেবিল দেখুন:

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

নিচের সারণীতে কাজ করে এমন ভ্যালুর ধরন ও সেগুলির বিবরণ তালিকাভুক্ত করা হয়েছে।

ভ্যালুর ধরন
string একটি ডোমেন URI। "https://example.com"
string array ডোমেন URI-এর অ্যারে। ["https://news.example.com", "https://local.example.com"]

ওয়াইল্ডকার্ড প্রিফিক্সও কাজ করে। যেমন, "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" অবৈধ বলে বিবেচিত হয়।

allowed_parent_origin ফিল্ডের ভ্যালু ভুল হলে, ইন্টারমিডিয়েট iframe মোডের One Tap ইনিশিয়ালাইজেশন ব্যর্থ হবে এবং বন্ধ হয়ে যাবে।

intermediate_iframe_close_callback

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

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

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

itp_support

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

ধরন প্রয়োজনীয় উদাহরণ
বুলিয়ান ঐচ্ছিক itp_support: false

login_hint

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

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

ধরন প্রয়োজনীয় উদাহরণ
স্ট্রিং, একটি ইমেল আইডি বা আইডি টোকেন sub ফিল্ড থেকে পাওয়া ভ্যালু। ঐচ্ছিক login_hint: 'elisa.beckett@gmail.com'

hd

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

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

ধরন প্রয়োজনীয় উদাহরণ
স্ট্রিং। সম্পূর্ণভাবে উপযুক্ত ডোমেনের নাম (FQDN) বা *. ঐচ্ছিক hd: '*'

use_fedcm_for_prompt

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

ধরন প্রয়োজনীয় উদাহরণ
বুলিয়ান বন্ধ করে দেওয়া হয়েছে use_fedcm_for_prompt: true

use_fedcm_for_button

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

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

button_auto_select

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

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

Method: google.accounts.id.prompt

initialize() পদ্ধতি চালু হওয়ার পরে google.accounts.id.prompt পদ্ধতিটি ওয়ান ট্যাপ প্রম্পট বা ব্রাউজারের বিল্ট-ইন ক্রেডেনশিয়াল ম্যানেজার দেখায়। পদ্ধতির নিম্নলিখিত কোড উদাহরণ দেখুন:

 google.accounts.id.prompt(/**
 @type{(function(!PromptMomentNotification):void)=} */ momentListener)

সাধারণত, পৃষ্ঠা লোড হওয়ার সময় prompt() মেথড কল করা হয়। Google-এর দিকে সেশনের স্ট্যাটাস ও ব্যবহারকারীর সেটিংসের কারণে, One Tap প্রম্পট UI দেখানো নাও হতে পারে। বিভিন্ন মুহূর্তের জন্য UI স্ট্যাটাস সম্পর্কে বিজ্ঞপ্তি পেতে, UI স্ট্যাটাস বিজ্ঞপ্তি পাওয়ার জন্য একটি ফাংশন পাস করুন।

নিম্নলিখিত মুহূর্তে বিজ্ঞপ্তি পাঠানো হয়:

  • ডিসপ্লে মোমেন্ট: prompt() মেথড কল করার পরে এটি ঘটে। UI দেখানো হচ্ছে কিনা তা বোঝাতে বিজ্ঞপ্তিতে বুলিয়ান ভ্যালু থাকে।

  • এড়িয়ে যাওয়া মুহূর্ত: এটি তখন ঘটে যখন অটোমেটিক বাতিল, ম্যানুয়ালি বাতিল করার মাধ্যমে 'এক ট্যাপ' প্রম্পট বন্ধ করা হয় অথবা Google ক্রেডেনশিয়াল ইস্যু করতে না পারলে, যেমন বেছে নেওয়া সেশন Google থেকে সাইন-আউট হয়ে গেলে।

    এইসব ক্ষেত্রে, আমরা সাজেস্ট করি যে আপনি পরবর্তী পরিচয় প্রদানকারীর সাথে প্রক্রিয়া চালিয়ে যান, যদি কোনও পরিচয় প্রদানকারী থাকে।

  • বাতিল করা মুহূর্ত: Google কোনও ক্রেডেনশিয়াল সফলভাবে ফিরিয়ে আনলে অথবা কোনও ব্যবহারকারী ক্রেডেনশিয়াল ফিরিয়ে আনার ফ্লো বন্ধ করতে চাইলে এটি ঘটে। যেমন, ব্যবহারকারী আপনার লগ-ইন ডায়ালগে ইউজারনেম ও পাসওয়ার্ড লিখতে শুরু করলে, আপনি google.accounts.id.cancel() মেথড কল করে One Tap প্রম্পট বন্ধ করতে এবং বাতিল করার মুহূর্ত ট্রিগার করতে পারবেন।

নিম্নলিখিত কোডের উদাহরণ এড়িয়ে যাওয়া মুহূর্ত প্রয়োগ করে:

<script>
  window.onload = function () {
    google.accounts.id.initialize(...);
    google.accounts.id.prompt((notification) => {
      if (notification.isNotDisplayed() || notification.isSkippedMoment()) {
        // continue with another identity provider.
      }
    });
  };
</script>

ডেটার ধরন: PromptMomentNotification

নিম্নলিখিত সারণীতে PromptMomentNotification ডেটার ধরন ও পদ্ধতির তালিকা দেওয়া আছে:

পদ্ধতি
isDisplayMoment() 'এক ট্যাপ' প্রম্পট দেখানো হলে true রিটার্ন করে।

মনে রাখবেন: FedCM চালু করা থাকলে, এই বিজ্ঞপ্তি কাজ করে না। আরও তথ্যের জন্য FedCM-এ মাইগ্রেট করুন পৃষ্ঠা দেখুন।
isDisplayed() মুহূর্তের ধরন PromptMoment.DISPLAY হলে এবং ওয়ান ট্যাপ প্রম্পট দেখানো হলে, true রিটার্ন করে।

মনে রাখবেন: FedCM চালু করা থাকলে, এই বিজ্ঞপ্তি কাজ করে না। আরও তথ্যের জন্য FedCM-এ মাইগ্রেট করুন পৃষ্ঠা দেখুন।
isNotDisplayed() মোমেন্টের ধরন PromptMoment.DISPLAY হলে এবং ওয়ান ট্যাপ প্রম্পট দেখানো না হলে, true রিটার্ন করে।

মনে রাখবেন: FedCM চালু করা থাকলে, এই বিজ্ঞপ্তি কাজ করে না। আরও তথ্যের জন্য FedCM-এ মাইগ্রেট করুন পৃষ্ঠা দেখুন।
getNotDisplayedReason()

UI কেন দেখানো হয়নি তার বিস্তারিত কারণ। নিম্নলিখিতগুলি হল সম্ভাব্য ভ্যালু:

  • browser_not_supported
  • invalid_client
  • missing_client_id
  • opt_out_or_no_session
  • secure_http_required
  • suppressed_by_user
  • unregistered_origin
  • unknown_reason
মনে রাখবেন: FedCM চালু করা থাকলে, এই বিজ্ঞপ্তি কাজ করে না। আরও তথ্যের জন্য FedCM-এ মাইগ্রেট করুন পৃষ্ঠা দেখুন।
isSkippedMoment() মোমেন্টের ধরন PromptMoment.SKIPPED

হলে true রিটার্ন করে মনে রাখবেন: FedCM চালু করা থাকলে, এই পদ্ধতি আংশিকভাবে কাজ করে। বিশেষ করে, এটি user_cancel-এর এড়িয়ে যাওয়ার কারণকে সমর্থন করে না। আরও তথ্যের জন্য FedCM-এ মাইগ্রেট করুন পৃষ্ঠা দেখুন।
getSkippedReason()

এড়িয়ে যাওয়া মুহূর্তের বিস্তারিত কারণ। নিম্নলিখিতগুলি হল সম্ভাব্য ভ্যালু:

  • auto_cancel
  • user_cancel
  • tap_outside
  • issuing_failed
মনে রাখবেন: FedCM চালু করা থাকলে, এই পদ্ধতি আংশিকভাবে কাজ করে। বিশেষ করে, এটি user_cancel-এর এড়িয়ে যাওয়ার কারণকে সমর্থন করে না। আরও তথ্যের জন্য FedCM-এ মাইগ্রেট করুন পৃষ্ঠা দেখুন।
isDismissedMoment() মোমেন্টের ধরন PromptMoment.DISMISSED হলে true রিটার্ন করে।

মনে রাখবেন: FedCM চালু থাকলে, এই পদ্ধতি সম্পূর্ণভাবে কাজ করে। আরও তথ্যের জন্য FedCM-এ মাইগ্রেট করুন পৃষ্ঠা দেখুন।
getDismissedReason()

বাতিল করার বিস্তারিত কারণ। নিম্নলিখিতগুলি সম্ভাব্য ভ্যালু:

  • credential_returned
  • cancel_called
  • flow_restarted
মনে রাখবেন: FedCM চালু করা থাকলে, এই পদ্ধতি সম্পূর্ণভাবে কাজ করে। আরও তথ্যের জন্য FedCM-এ মাইগ্রেট করুন পৃষ্ঠা দেখুন।
getMomentType()

মোমেন্টের ধরনের জন্য একটি স্ট্রিং দেখায়। নিম্নলিখিতগুলি সম্ভাব্য ভ্যালু:

  • display
  • skipped
  • dismissed

ডেটার ধরন: CredentialResponse

আপনার callback ফাংশনটি চালু করা হলে, একটি CredentialResponse অবজেক্ট প্যারামিটার হিসেবে পাস করা হয়। নিম্নলিখিত সারণীতে ক্রেডেনশিয়াল রেসপন্স অবজেক্টে থাকা ফিল্ডের তালিকা দেওয়া হল:

ফিল্ড
credential Google-এর ইস্যু করা এনকোড করা JWT আইডি টোকেন।
select_by ব্যবহারকারী কীভাবে সাইন-ইন করেছেন।
state ব্যবহারকারী সাইন-ইন করার জন্য 'Google-এর মাধ্যমে সাইন-ইন করুন' বোতামে ক্লিক করলে এবং বোতামের state অ্যাট্রিবিউট নির্দিষ্ট করা থাকলে, তবেই এই ফিল্ডটি সংজ্ঞায়িত করা হয়।

ক্রেডেনশিয়াল

এই ফিল্ডটি হল base64-এনকোড করা JSON ওয়েব টোকেন (JWT) স্ট্রিং হিসেবে আইডি টোকেন।

ডিকোড করলে, JWT নিম্নলিখিত উদাহরণের মতো দেখায়: 

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": "Elisa",
  "family_name": "Beckett",
  "iat": 1596474000, // Unix timestamp of the assertion creation time
  "exp": 1596477600, // Unix timestamp of the assertion expiration time
  "jti": "abc161803398874def"
}

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

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

যেসব ক্ষেত্রে Google কর্তৃত্বপূর্ণ:

  • email-এর শেষে @gmail.com আছে, এটি একটি Gmail অ্যাকাউন্ট।
  • email_verified সত্য এবং hd সেট করা থাকলে, এটি একটি Google Workspace অ্যাকাউন্ট।

ব্যবহারকারীরা Gmail বা Google Workspace ব্যবহার না করেই Google অ্যাকাউন্টের জন্য রেজিস্টার করতে পারেন। email-এ @gmail.com প্রত্যয় না থাকলে এবং hd অনুপস্থিত থাকলে, Google কর্তৃত্বপূর্ণ নয় এবং ব্যবহারকারীকে যাচাই করার জন্য পাসওয়ার্ড বা অন্যান্য চ্যালেঞ্জ পদ্ধতি সাজেস্ট করা হয়। email_verfied-ও সঠিক হতে পারে, কারণ Google অ্যাকাউন্ট তৈরি করার সময় Google প্রাথমিকভাবে ব্যবহারকারীকে যাচাই করে, তবে থার্ড-পার্টি ইমেল অ্যাকাউন্টের মালিকানা তারপর থেকে পরিবর্তিত হয়ে থাকতে পারে।

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

select_by

নিম্নলিখিত সারণীতে select_by ফিল্ডের সম্ভাব্য মান তালিকাভুক্ত করা হয়েছে। ভ্যালু সেট করার জন্য, সেশন ও সম্মতি সংক্রান্ত স্ট্যাটাসের সাথে যে ধরনের বোতাম ব্যবহার করা হয়, তা ব্যবহার করা হয়,

  • ব্যবহারকারী 'একবার ট্যাপ' বা 'Google-এর মাধ্যমে সাইন-ইন করুন' বোতামে প্রেস করেছেন অথবা টাচলেস অটোমেটিক সাইন-ইন প্রসেস ব্যবহার করেছেন।

  • আগে থেকে থাকা সেশন খুঁজে পাওয়া গেছে অথবা ব্যবহারকারী নতুন সেশন শুরু করার জন্য Google অ্যাকাউন্ট বেছে নিয়েছেন এবং সাইন-ইন করেছেন।

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

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

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

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

রাজ্য

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

একই পৃষ্ঠায় একাধিক Google-এর মাধ্যমে সাইন-ইন বোতাম রেন্ডার করা যেতে পারে, তাই আপনি প্রতিটি বোতামে একটি অনন্য স্ট্রিং অ্যাসাইন করতে পারেন। তাই, সাইন-ইন করার জন্য ব্যবহারকারী কোন বোতামে ক্লিক করেছেন তা শনাক্ত করতে আপনি এই state ফিল্ডটি ব্যবহার করতে পারেন।

পদ্ধতি: google.accounts.id.renderButton

google.accounts.id.renderButton পদ্ধতি আপনার ওয়েব পেজে 'Google-এর মাধ্যমে সাইন-ইন করুন' বোতাম রেন্ডার করে।

পদ্ধতির নিম্নলিখিত কোড উদাহরণ দেখুন:

google.accounts.id.renderButton(
      /** @type{!HTMLElement} */ parent,
      /** @type{!GsiButtonConfiguration} */ options
    )

ডেটার ধরন: GsiButtonConfiguration

নিম্নলিখিত সারণীতে GsiButtonConfiguration ডেটার ধরন ও ফিল্ডের তালিকা দেওয়া হয়েছে:

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

অ্যাট্রিবিউটের ধরন

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

ধরন

বোতামের ধরন। ডিফল্ট ভ্যালু হল standard।

আরও তথ্যের জন্য নিম্নলিখিত টেবিল দেখুন:

ধরন প্রয়োজনীয় উদাহরণ
স্ট্রিং হ্যাঁ type: "icon"

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

ধরন
standard
টেক্সট বা পছন্দমতো তথ্য সহ বোতাম।
icon
টেক্সট ছাড়া আইকন বোতাম।

থিম

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

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

নিচের সারণীতে উপলভ্য থিম এবং সেগুলির বিবরণ দেওয়া হল:

থিম নমুনা স্পেসিফিকেশন
outline
standard-button-white icon-button-white personalized-button-white
স্ট্যান্ডার্ড বোতাম থিম।
Fill: #FFFFFF
Stroke: #747775 | 1px | inside
Font: #1F1F1F | Roboto Medium | 14/20
Personalized: #1F1F1F | Roboto | Medium 12/14 | Regular 11/13
filled_blue
নীল রঙের বোতাম থিম।
Fill: #0B57D0
Stroke: #OB57D0 | 1px | inside
Font: #FFFFFF | Google Sans Medium | 14/20
Personalized: #FFFFFF | Roboto | Medium 12/14 | Regular 11/13
filled_black
কালো রঙের বোতাম থিম ও তার সাথে মানানসই লোগো।
Fill: #202124
Stroke: #OB57D0 | 1px | inside
Font: #FFFFFF | Google Sans Medium | 14/20
Personalized: #FFFFFF | Roboto | Medium 12/14 | Regular 11/13
outline_dark
কালো রঙে ভর্তি বোতামের থিম।
Fill: #131314
Stroke: #8E918F | 1px | inside
Font: #FFFFFF | Google Sans Medium | 14/20
Personalized: #FFFFFF | Roboto | Medium 12/14 | Regular 11/13

সাইজ

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

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

নিচের সারণীতে উপলভ্য বোতামের সাইজ ও সেগুলির বিবরণ তালিকাভুক্ত করা হয়েছে:

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

মেসেজ পাঠান

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

আরও তথ্যের জন্য নিম্নলিখিত টেবিল দেখুন:

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

নিচের সারণীতে উপলভ্য সব বোতামের টেক্সট ও সেগুলির বিবরণ দেওয়া হল:

টেক্সট
signin_with
বোতামের টেক্সট হল "Google-এর মাধ্যমে সাইন-ইন করুন"।
signup_with
বোতামের টেক্সট হল "Google-এর মাধ্যমে সাইন-আপ করুন"।
continue_with
বোতামের টেক্সট হল "Google-এর মাধ্যমে চালিয়ে যান"।
signin
বোতামের টেক্সট হল "সাইন-ইন করুন"।

মাপ

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

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

নিচের সারণীতে উপলভ্য বোতামের আকার এবং তাদের বিবরণ তালিকাভুক্ত করা হয়েছে:

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

logo_alignment

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

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

নিম্নলিখিত সারণীতে উপলভ্য অ্যালাইনমেন্ট ও সেগুলির বিবরণ তালিকাভুক্ত করা হয়েছে:

logo_alignment
left
Google লোগো বাঁদিকে অ্যালাইন করে।
center
Google লোগো মাঝখানে অ্যালাইন করে।

প্রস্থ

পিক্সেলে, বোতামের ন্যূনতম প্রস্থ। প্রস্থ সর্বাধিক ৪০০ পিক্সেল হতে পারে।

আরও তথ্যের জন্য নিম্নলিখিত টেবিল দেখুন:

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

লোকেল

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

এটি সেট করা না থাকলে, ব্রাউজারের ডিফল্ট লোকেল বা Google সেশন ব্যবহারকারীর পছন্দ ব্যবহার করা হয়। তাই, বিভিন্ন ব্যবহারকারী লোকালাইজ করা বোতামের বিভিন্ন ভার্সন দেখতে পেতে পারেন এবং সম্ভবত বিভিন্ন সাইজে।

আরও তথ্যের জন্য নিম্নলিখিত টেবিল দেখুন:

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

click_listener

click_listener অ্যাট্রিবিউট ব্যবহার করে 'Google-এর মাধ্যমে সাইন-ইন করুন' বোতামে ক্লিক করা হলে, কল করার জন্য আপনি একটি জাভাস্ক্রিপ্ট ফাংশন নির্ধারণ করতে পারেন।

  google.accounts.id.renderButton(document.getElementById("signinDiv"), {
      theme: 'outline',
      size: 'large',
      click_listener: onClickHandler
    });

  
  function onClickHandler(){
    console.log("Sign in with Google button clicked...")
  }

এই উদাহরণে, 'Google-এর মাধ্যমে সাইন-ইন করুন' বোতামে ক্লিক করা হলে, 'Google-এর মাধ্যমে সাইন-ইন করুন' বোতামে ক্লিক করা হয়েছে... মেসেজটি কনসোলে লগ করা হয়।

রাজ্য

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

আরও তথ্যের জন্য নিম্নলিখিত টেবিল দেখুন:

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

ডেটার ধরন: ক্রেডেনশিয়াল

আপনার native_callback ফাংশনটি চালু করা হলে, একটি Credential অবজেক্ট প্যারামিটার হিসেবে পাস করা হয়। অবজেক্টে যেসব ফিল্ড আছে তা নিচের সারণীতে তালিকাভুক্ত করা হয়েছে:

ফিল্ড
id ব্যবহারকারীকে শনাক্ত করে।
password পাসওয়ার্ড

পদ্ধতি: google.accounts.id.disableAutoSelect

ব্যবহারকারী আপনার ওয়েবসাইট থেকে সাইন-আউট করলে, কুকিতে স্ট্যাটাস রেকর্ড করার জন্য আপনাকে google.accounts.id.disableAutoSelect মেথড কল করতে হবে। এটি UX ডেড লুপ প্রতিরোধ করে। পদ্ধতির নিম্নলিখিত কোড স্নিপেট দেখুন:

google.accounts.id.disableAutoSelect()

নিম্নলিখিত কোডের উদাহরণ onSignout() ফাংশনের সাথে google.accounts.id.disableAutoSelect পদ্ধতি প্রয়োগ করে:

<script>
  function onSignout() {
    google.accounts.id.disableAutoSelect();
  }
</script>

পদ্ধতি: google.accounts.id.storeCredential

এই পদ্ধতিটি ব্রাউজারের বিল্ট-ইন ক্রেডেনশিয়াল ম্যানেজার API-এর store() পদ্ধতির জন্য একটি র‍্যাপার। তাই, এটি শুধুমাত্র পাসওয়ার্ড ক্রেডেনশিয়াল স্টোর করার জন্য ব্যবহার করা যেতে পারে। পদ্ধতির নিম্নলিখিত কোড উদাহরণ দেখুন:

google.accounts.id.storeCredential(Credential, callback)

নিম্নলিখিত কোডের উদাহরণ onSignIn() ফাংশনের সাথে google.accounts.id.storeCredential পদ্ধতি প্রয়োগ করে:

<script>
  function onSignIn() {
    let cred = {id: '...', password: '...'};
    google.accounts.id.storeCredential(cred);
  }
</script>

Method: google.accounts.id.cancel

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

google.accounts.id.cancel()

নিম্নলিখিত কোডের উদাহরণ onNextButtonClicked() ফাংশনের সাথে google.accounts.id.cancel() পদ্ধতি প্রয়োগ করে:

<script>
  function onNextButtonClicked() {
    google.accounts.id.cancel();
    showPasswordPage();
  }
</script>

লাইব্রেরি লোড কলব্যাক: onGoogleLibraryLoad

আপনি onGoogleLibraryLoad কলব্যাক রেজিস্টার করতে পারবেন। Google-এর মাধ্যমে সাইন-ইন করুন জাভাস্ক্রিপ্ট লাইব্রেরি লোড হওয়ার পরে এটি বিজ্ঞপ্তি দেয়:

window.onGoogleLibraryLoad = () => {
    ...
};

এই কলব্যাকটি window.onload কলব্যাকের জন্য একটি শর্টকাট মাত্র। আচরণে কোনও পার্থক্য নেই।

নিম্নলিখিত কোডের উদাহরণ একটি onGoogleLibraryLoad কলব্যাক প্রয়োগ করে:

<script>
  window.onGoogleLibraryLoad = () => {
   google.accounts.id.initialize({
     ...
   });
   google.accounts.id.prompt();
  };
</script>

পদ্ধতি: google.accounts.id.revoke

google.accounts.id.revoke পদ্ধতিটি নির্দিষ্ট ব্যবহারকারীর জন্য ID টোকেন শেয়ার করতে ব্যবহৃত OAuth অনুদান প্রত্যাহার করে। পদ্ধতির নিম্নলিখিত কোড স্নিপেট দেখুন: javascript google.accounts.id.revoke(login_hint, callback)

প্যারামিটার ধরন বিবরণ
login_hint স্ট্রিং ব্যবহারকারীর Google অ্যাকাউন্টের ইমেল আইডি বা অনন্য আইডি। আইডি হল ক্রেডেনশিয়াল পেলোডের sub প্রপার্টি।
callback ফাংশন ঐচ্ছিক RevocationResponse হ্যান্ডলার।

নিম্নলিখিত কোড স্যাম্পেল থেকে জানা যায় যে কীভাবে একটি আইডির সাথে revoke পদ্ধতি ব্যবহার করতে হয়। 

  google.accounts.id.revoke('1618033988749895', done => {
    console.log(done.error);
  });

ডেটার ধরন: RevocationResponse

আপনার callback ফাংশনটি চালু করা হলে, একটি RevocationResponse অবজেক্ট প্যারামিটার হিসেবে পাস করা হয়। নিম্নলিখিত সারণীতে প্রত্যাহার সংক্রান্ত রেসপন্স অবজেক্টে থাকা ফিল্ডের তালিকা দেওয়া হল:

ফিল্ড
successful এই ফিল্ডটি হল মেথড কলের রিটার্ন ভ্যালু।
error এই ফিল্ডে ঐচ্ছিকভাবে সমস্যার বিস্তারিত উত্তর মেসেজ থাকে।

করা হয়েছে

এই ফিল্ডটি হল একটি বুলিয়ান ভ্যালু যা তুলে নেওয়ার মেথড কল সফল হলে true হিসেবে সেট করা হয় অথবা ব্যর্থ হলে false হিসেবে সেট করা হয়।

সমস্যা

এই ফিল্ডটি একটি স্ট্রিং ভ্যালু এবং এতে একটি বিস্তারিত ত্রুটি মেসেজ থাকে যদি প্রত্যাহার মেথড কল ব্যর্থ হয়, এটি সফল হলে সংজ্ঞায়িত হয় না।