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

সেভ করা পৃষ্ঠা গুছিয়ে রাখতে 'সংগ্রহ' ব্যবহার করুন আপনার পছন্দ অনুযায়ী কন্টেন্ট সেভ করুন ও সঠিক বিভাগে রাখুন।

এই রেফারেন্স পৃষ্ঠাটি Google HTML ডেটা অ্যাট্রিবিউট API এর সাথে সাইন ইনের বর্ণনা দেয়৷ আপনি আপনার ওয়েব পৃষ্ঠাগুলিতে ওয়ান ট্যাপ প্রম্পট বা Google বোতাম দিয়ে সাইন ইন করার জন্য API ব্যবহার করতে পারেন।

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

আপনি <div> এবং <span> এর মতো যেকোন দৃশ্যমান বা অদৃশ্য উপাদানগুলিতে Google ডেটা বৈশিষ্ট্যের সাথে সাইন ইন রাখতে পারেন। শুধুমাত্র প্রয়োজন হল উপাদান আইডি g_id_onload এ সেট করা আছে। এই আইডিটি একাধিক উপাদানে রাখবেন না।

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

নিম্নলিখিত সারণীতে তাদের বিবরণ সহ ডেটা বৈশিষ্ট্যগুলি তালিকাভুক্ত করা হয়েছে:

বৈশিষ্ট্য
data-client_id আপনার আবেদনের ক্লায়েন্ট আইডি
data-auto_prompt Google One ট্যাপ দেখান।
data-auto_select Google One Tap-এ অটোমেটিক সিলেকশন চালু করে।
data-login_uri আপনার লগইন এন্ডপয়েন্টের URL
data-callback JavaScript ID টোকেন হ্যান্ডলার ফাংশনের নাম
data-native_login_uri আপনার পাসওয়ার্ড ক্রেডেনশিয়াল হ্যান্ডলার এন্ডপয়েন্টের URL
data-native_callback JavaScript পাসওয়ার্ড ক্রেডেনশিয়াল হ্যান্ডলার ফাংশনের নাম
data-native_id_param credential.id মানের প্যারামিটারের নাম
data-native_password_param credential.password মানের জন্য প্যারামিটারের নাম
data-cancel_on_tap_outside ব্যবহারকারী প্রম্পটের বাইরে ক্লিক করলে প্রম্পটটি বাতিল করতে হবে কিনা তা নিয়ন্ত্রণ করে।
data-prompt_parent_id ওয়ান ট্যাপ প্রম্পট কন্টেইনার উপাদানের DOM আইডি
data-skip_prompt_cookie নির্দিষ্ট করা কুকির একটি অ-খালি মান থাকলে ওয়ান ট্যাপ এড়িয়ে যায়।
data-nonce আইডি টোকেনগুলির জন্য একটি র্যান্ডম স্ট্রিং৷
data-context ওয়ান ট্যাপ প্রম্পটে শিরোনাম এবং শব্দ
data-moment_callback প্রম্পট UI স্থিতি বিজ্ঞপ্তি শ্রোতার ফাংশনের নাম
data-state_cookie_domain আপনি যদি প্যারেন্ট ডোমেন এবং এর সাবডোমেনে ওয়ান ট্যাপ কল করতে চান, তাহলে এই অ্যাট্রিবিউটে প্যারেন্ট ডোমেনটি পাস করুন যাতে একটি একক শেয়ার করা কুকি ব্যবহার করা হয়।
data-ux_mode Google বোতাম দিয়ে সাইন ইন করুন UX ফ্লো
data-allowed_parent_origin মধ্যবর্তী iframe এম্বেড করার অনুমতি দেওয়া উত্সগুলি৷ এই অ্যাট্রিবিউটটি উপস্থাপন করলে ওয়ান ট্যাপ ইন্টারমিডিয়েট আইফ্রেম মোডে চলবে।
data-intermediate_iframe_close_callback ব্যবহারকারীরা ম্যানুয়ালি ওয়ান ট্যাপ বন্ধ করলে ডিফল্ট মধ্যবর্তী iframe আচরণ ওভাররাইড করে।
data-itp_support ITP ব্রাউজারগুলিতে আপগ্রেড করা One Tap UX সক্ষম করে৷

বৈশিষ্ট্যের ধরন

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

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

এই অ্যাট্রিবিউটটি হল আপনার অ্যাপের ক্লায়েন্ট আইডি, যা Google Developers Console-এ পাওয়া যায় এবং তৈরি করা হয়। আরও তথ্যের জন্য নিম্নলিখিত টেবিল দেখুন:

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

data-auto_prompt

এই বৈশিষ্ট্যটি এক ট্যাপ প্রদর্শন করবে কিনা তা নির্ধারণ করে। ডিফল্ট মান true । এই মান false হলে Google One ট্যাপ প্রদর্শিত হবে না। আরও তথ্যের জন্য নিম্নলিখিত টেবিল দেখুন:

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

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

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

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

data-login_uri

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

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

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

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

আপনার লগইন এন্ডপয়েন্টকে অবশ্যই একটি আইডি টোকেন মান সহ একটি credential কী ধারণকারী POST অনুরোধগুলি পরিচালনা করতে হবে৷

নিম্নলিখিত আপনার লগইন শেষ বিন্দুতে একটি উদাহরণ অনুরোধ:

POST /login HTTP/1.1
Host: www.example.com
Content-Type: application/x-www-form-urlencoded

credential=ID_TOKEN

ডেটা কলব্যাক

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

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

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

  • data-login_uri অ্যাট্রিবিউটের প্রয়োজন হয় সাইন ইন উইথ Google বোতাম redirect ইউএক্স মোডের জন্য, যা data-callback অ্যাট্রিবিউটকে উপেক্ষা করে।

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

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

data-native_login_uri

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

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

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

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

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

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

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

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

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

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

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

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

ডাটা-বাতিল_অন_ট্যাপ_বাইরে

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

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

data-prompt_parent_id

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

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

নির্দিষ্ট করা কুকির একটি অ-খালি মান থাকলে এই বৈশিষ্ট্যটি ওয়ান ট্যাপ এড়িয়ে যায়। আরও তথ্যের জন্য নিম্নলিখিত টেবিল দেখুন:

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

ডাটা-নন্স

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

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

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

তথ্য-প্রসঙ্গ

এই বৈশিষ্ট্যটি এক ট্যাপ প্রম্পটে দেখানো শিরোনাম এবং বার্তাগুলির পাঠ্য পরিবর্তন করে। আরও তথ্যের জন্য নিম্নলিখিত টেবিল দেখুন:

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

নিম্নলিখিত সারণী উপলব্ধ প্রসঙ্গ এবং তাদের বিবরণ তালিকাভুক্ত করে:

প্রসঙ্গ
signin "গুগল দিয়ে সাইন ইন করুন"
signup "গুগলের সাথে সাইন আপ করুন"
use "Google এর সাথে ব্যবহার করুন"

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

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

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

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

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

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

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

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

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

নিম্নলিখিত সারণী উপলব্ধ UX মোড এবং তাদের বিবরণ তালিকাভুক্ত করে।

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

ডেটা-অনুমতিপ্রাপ্ত_অভিভাবক_অরিজিন

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

টাইপ প্রয়োজন উদাহরণ
স্ট্রিং বা স্ট্রিং অ্যারে ঐচ্ছিক 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 অ্যাট্রিবিউটের মান অবৈধ হলে, মধ্যবর্তী iframe মোডের ওয়ান ট্যাপ ইনিশিয়ালাইজেশন ব্যর্থ হবে এবং বন্ধ হয়ে যাবে।

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

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

data-intermediate_iframe_close_callback

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

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

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

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

data-itp_support

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

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

"g_id_signin" ক্লাস সহ উপাদান

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

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

ভিজ্যুয়াল ডেটা বৈশিষ্ট্য

নিম্নলিখিত সারণী ভিজ্যুয়াল ডেটা বৈশিষ্ট্য এবং তাদের বিবরণ তালিকাভুক্ত করে:

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

বৈশিষ্ট্যের ধরন

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

ডেটা-টাইপ

বোতামের ধরন। ডিফল্ট মান 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 বোতামের টেক্সট হল "Google দিয়ে সাইন ইন করুন":
'Google দিয়ে সাইন ইন করুন' লেবেলযুক্ত একটি আদর্শ বোতামকোনো দৃশ্যমান পাঠ্য ছাড়া একটি আইকন বোতাম
signup_with বোতামের পাঠ্য হল "Google এর সাথে সাইন আপ করুন":
'Google এর সাথে সাইন আপ করুন' লেবেলযুক্ত একটি আদর্শ বোতামকোনো দৃশ্যমান পাঠ্য ছাড়া একটি আইকন বোতাম
continue_with বোতামের পাঠ্য হল "Google এর সাথে চালিয়ে যান":
'Google এর সাথে চালিয়ে যান' লেবেলযুক্ত একটি আদর্শ বোতামকোনো দৃশ্যমান পাঠ্য ছাড়া একটি আইকন বোতাম
signin বোতামের পাঠ্য হল "সাইন ইন":
'সাইন ইন' লেবেলযুক্ত একটি আদর্শ বোতামকোনো দৃশ্যমান পাঠ্য ছাড়া একটি আইকন বোতাম

তথ্য-আকৃতি

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

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

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

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

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

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

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

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

logo_alignment
left Google লোগোকে বাম-সারিবদ্ধ করে:
বাম দিকে G লোগো সহ একটি আদর্শ বোতাম৷
center Google লোগোকে কেন্দ্রে সারিবদ্ধ করে:
কেন্দ্রে G লোগো সহ একটি আদর্শ বোতাম

ডেটা-প্রস্থ

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

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

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

ডেটা-লোকেল

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

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

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

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

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

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

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

HTTP POST অনুরোধে নিম্নলিখিত তথ্য রয়েছে:

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

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

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 GSuite email address
  "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's creation time
  "exp": 1596477600, // Unix timestamp of the assertion's expiration time
  "jti": "abc161803398874def"
}

নিম্নলিখিত সারণী নির্বাচন_দ্বারা ক্ষেত্রের সম্ভাব্য মান select_by করে। মান সেট করতে সেশন এবং সম্মতি স্থিতি সহ ব্যবহৃত বোতামের ধরন ব্যবহার করা হয়,

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

  • একটি বিদ্যমান সেশন পাওয়া গেছে, অথবা ব্যবহারকারী একটি নতুন সেশন প্রতিষ্ঠা করতে একটি Google অ্যাকাউন্টে নির্বাচন করেছেন এবং সাইন-ইন করেছেন৷

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

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

এই ক্ষেত্রের মান এই ধরনের একটিতে সেট করা আছে,

মান বর্ণনা
auto একটি বিদ্যমান সেশনের সাথে একজন ব্যবহারকারীর স্বয়ংক্রিয় সাইন-ইন যিনি পূর্বে শংসাপত্রগুলি ভাগ করার জন্য সম্মতি দিয়েছেন৷
user একটি বিদ্যমান সেশন সহ একজন ব্যবহারকারী যিনি পূর্বে সম্মতি দিয়েছিলেন তিনি শংসাপত্রগুলি ভাগ করতে এক ট্যাপ 'এভাবে চালিয়ে যান' বোতাম টিপুন৷
user_1tap একটি বিদ্যমান সেশন সহ একজন ব্যবহারকারী সম্মতি দিতে এবং শংসাপত্রগুলি ভাগ করতে এক ট্যাপ 'এভাবে চালিয়ে যান' বোতাম টিপে৷ শুধুমাত্র Chrome v75 এবং উচ্চতর ক্ষেত্রে প্রযোজ্য।
user_2tap একটি বিদ্যমান অধিবেশন ছাড়াই একজন ব্যবহারকারী একটি অ্যাকাউন্ট নির্বাচন করতে একটি ট্যাপ 'এভাবে চালিয়ে যান' বোতাম টিপে এবং তারপরে সম্মতি প্রদান এবং শংসাপত্রগুলি ভাগ করার জন্য একটি পপ-আপ উইন্ডোতে নিশ্চিত করুন বোতাম টিপুন৷ অ-ক্রোমিয়াম ভিত্তিক ব্রাউজারগুলিতে প্রযোজ্য।
btn একটি বিদ্যমান অধিবেশন সহ একজন ব্যবহারকারী যিনি পূর্বে সম্মতি প্রদান করেছেন Google এর সাথে সাইন ইন বোতাম টিপুন এবং শংসাপত্রগুলি ভাগ করার জন্য 'একটি অ্যাকাউন্ট চয়ন করুন' থেকে একটি Google অ্যাকাউন্ট নির্বাচন করেছেন৷
btn_confirm একটি বিদ্যমান সেশন সহ একজন ব্যবহারকারী Google এর সাথে সাইন ইন বোতাম টিপে এবং সম্মতি প্রদান এবং শংসাপত্রগুলি ভাগ করার জন্য নিশ্চিতকরণ বোতাম টিপুন৷
btn_add_session একটি বিদ্যমান সেশন ছাড়াই একজন ব্যবহারকারী যিনি আগে সম্মতি দিয়েছিলেন একটি Google অ্যাকাউন্ট নির্বাচন করতে এবং শংসাপত্রগুলি ভাগ করতে Google এর সাথে সাইন ইন বোতাম টিপুন৷
btn_confirm_add_session একটি বিদ্যমান সেশন ছাড়াই একজন ব্যবহারকারী প্রথমে একটি Google অ্যাকাউন্ট নির্বাচন করতে Google এর সাথে সাইন ইন বোতাম টিপে এবং তারপরে সম্মতি দিতে এবং শংসাপত্রগুলি ভাগ করতে নিশ্চিতকরণ বোতাম টিপুন৷

পাসওয়ার্ড শংসাপত্র হ্যান্ডলার শেষ পয়েন্ট

পাসওয়ার্ড ক্রেডেনশিয়াল হ্যান্ডলার এন্ডপয়েন্ট পাসওয়ার্ড শংসাপত্রগুলি প্রক্রিয়া করে যা নেটিভ শংসাপত্র ম্যানেজার পুনরুদ্ধার করে।

HTTP POST অনুরোধে নিম্নলিখিত তথ্য রয়েছে:

বিন্যাস নাম বর্ণনা
কুকি g_csrf_token একটি র্যান্ডম স্ট্রিং যা হ্যান্ডলার এন্ডপয়েন্টে প্রতিটি অনুরোধের সাথে পরিবর্তিত হয়।
পরামিতি অনুরোধ করুন g_csrf_token একটি স্ট্রিং যা আগের কুকি মানের সমান, g_csrf_token
পরামিতি অনুরোধ করুন email এই আইডি টোকেন যা গুগল ইস্যু করে।
পরামিতি অনুরোধ করুন password কিভাবে শংসাপত্র নির্বাচন করা হয়.