מקורות מידע בנושא Sign in with Google JavaScript API

בדף העיון הזה מתואר JavaScript API של 'כניסה באמצעות חשבון Google', שמשמש להצגת הלחצן 'כניסה באמצעות חשבון Google' או ההנחיה 'הקשה אחת' בדפי אינטרנט.

‫Method: google.accounts.id.initialize

השיטה google.accounts.id.initialize מאתחלת את הלקוח של 'כניסה באמצעות חשבון Google' על סמך אובייקט ההגדרה. דוגמת קוד של השיטה:

google.accounts.id.initialize(IdConfiguration)

בדוגמת הקוד הבאה מוטמעת המתודה google.accounts.id.initialize עם הפונקציה onload:

<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 ערכת הצבעים שמוחלת על ההנחיה בלחיצה אחת.
auto_select הפעלת הבחירה האוטומטית.
callback פונקציית JavaScript שמטפלת באסימונים מזהים. מאפיין זה משמש את מנגנון "לחיצה אחת" של Google ואת מצב חוויית המשתמש של הכפתור popup "כניסה באמצעות חשבון Google".
login_uri כתובת ה-URL של נקודת הקצה של הכניסה. כפתור הכניסה באמצעות חשבון Google redirect מצב חוויית המשתמש משתמש במאפיין הזה.
native_callback פונקציית ה-JavaScript שמטפלת בפרטי הכניסה של הסיסמה.
cancel_on_tap_outside אם המשתמש לוחץ מחוץ להנחיה, היא מבוטלת.
prompt_parent_id מזהה ה-DOM של רכיב מאגר ההנחיה של התכונה 'הצטרפות בלחיצה אחת'
nonce מחרוזת אקראית לאסימוני מזהה
essential_claims הצהרות נוספות שייכללו באסימון המזהה שמוחזר על ידי Google.
context הכותרת והמילים בהודעה של הכניסה בלחיצה אחת
state_cookie_domain אם צריך להפעיל את One Tap בדומיין הראשי ובתת-הדומיינים שלו, מעבירים את הדומיין הראשי לשדה הזה כדי להשתמש בקובץ Cookie משותף יחיד.
ux_mode תהליך חוויית המשתמש של הכפתור לכניסה באמצעות חשבון Google
allowed_parent_origin המקורות שמותר להם להטמיע את ה-iframe של הביניים. אם השדה הזה קיים, התהליך של לחיצה אחת מופעל במצב הביניים של iframe.
intermediate_iframe_close_callback המדיניות הזו מבטלת את התנהגות ברירת המחדל של ה-iframe הביניים כשמשתמשים סוגרים ידנית את לחיצה אחת.
itp_support ההגדרה מאפשרת שימוש בממשק משתמש משודרג של לחיצה אחת בדפדפני ITP.
login_hint דילוג על בחירת החשבון על ידי מתן רמז למשתמש.
hd הגבלת בחירת החשבון לפי דומיין.
use_fedcm_for_prompt מאפשר לדפדפן לשלוט בהנחיות לכניסה לחשבון ולנהל את תהליך הכניסה בין האתר שלכם לבין Google.
use_fedcm_for_button השדה הזה קובע אם צריך להשתמש בממשק משתמש של לחצן FedCM ב-Chrome (במחשב M125 ומעלה וב-Android M128 ומעלה). ברירת המחדל היא false.
button_auto_select האם להפעיל את האפשרות בחירה אוטומטית בתהליך של לחצן FedCM. אם ההגדרה הזו מופעלת, משתמשים חוזרים עם סשן פעיל ב-Google ייכנסו אוטומטית לחשבון, בלי שתופיע ההנחיה של Account Chooser.ערך ברירת המחדל הוא false.

client_id

בשדה הזה צריך להזין את מזהה הלקוח של האפליקציה, שאפשר למצוא וליצור במסוף Google Cloud. מידע נוסף מופיע בטבלה הבאה:

סוג חובה דוגמה
מחרוזת כן client_id: "CLIENT_ID.apps.googleusercontent.com"

color_scheme

השדה הזה מייצג את ערכת הצבעים שמוחלת על ההנחיה 'הצטרפות בלחיצה אחת'. מידע נוסף זמין בטבלה הבאה:

סוג חובה דוגמה
מחרוזת אופציונלי. ברירת המחדל היא ערכת הצבעים שמוגדרת כברירת מחדל במערכת של המשתמשים. color_scheme: "dark"

בטבלה הבאה מפורטות ערכות הצבעים הזמינות והתיאורים שלהן.

ערכת צבעים
default החלת ערכת הצבעים שמוגדרת כברירת מחדל במערכת של המשתמש, בהתאם להעדפות המשתמש. ערכת הצבעים יכולה להיות בהירה או כהה.
light החלת ערכת צבעים בהירה.
dark החלפת ערכת הצבעים לכהה.

auto_select

השדה הזה קובע אם טוקן מזהה יוחזר באופן אוטומטי ללא אינטראקציה של המשתמש, אם יש רק סשן אחד ב-Google שבו האפליקציה אושרה בעבר. ערך ברירת המחדל הוא false. מידע נוסף מופיע בטבלה הבאה:

סוג חובה דוגמה
בוליאני אופציונלי auto_select: true

callback

השדה הזה הוא פונקציית JavaScript שמטפלת באסימון המזהה שמוחזר מההנחיה של 'הצטרפות בלחיצה אחת' או מהחלון הקופץ. חובה להשתמש במאפיין הזה אם משתמשים במצב חוויית המשתמש של 'הצטרפות בלחיצה אחת' של Google או בלחצן 'כניסה באמצעות חשבון Google' popup. מידע נוסף מופיע בטבלה הבאה:

סוג חובה דוגמה
פונקציה נדרש לשימוש בתכונה 'הצטרפות בלחיצה אחת' ולמצב חוויית המשתמש popup callback: handleResponse

login_uri

המאפיין הזה הוא ה-URI של נקודת הקצה של הכניסה.

הערך צריך להיות זהה לאחד מכתובות ה-URI המורשות להפניה אוטומטית של לקוח OAuth 2.0, שהגדרתם ב-מסוף Google Cloud, והוא צריך לעמוד בדרישות הכללים לאימות כתובות URI להפניה אוטומטית.

אפשר להשמיט את המאפיין הזה אם הדף הנוכחי הוא דף הכניסה שלכם. במקרה כזה, פרטי הכניסה נשלחים לדף הזה כברירת מחדל.

תגובת פרטי הכניסה של טוקן ה-ID נשלחת לנקודת הקצה של הכניסה כשמשתמש לוחץ על הלחצן 'כניסה באמצעות חשבון Google' ומשתמשים במצב חוויית המשתמש של הפניה אוטומטית.

מידע נוסף מופיע בטבלה הבאה:

סוג אופציונלי דוגמה
כתובת URL ברירת המחדל היא ה-URI של הדף הנוכחי, או הערך שאתם מציינים.
הפרמטר הזה נמצא בשימוש רק כשמוגדר ux_mode: "redirect".
login_uri: "https://www.example.com/login"

נקודת הקצה של הכניסה צריכה לטפל בבקשות POST שמכילות פרמטר credential עם ערך של טוקן מזהה בגוף הבקשה.

כדאי לנסות את HTML API.

native_callback

השדה הזה הוא השם של פונקציית JavaScript שמטפלת בפרטי הכניסה של הסיסמה שמוחזרים ממנהל פרטי הכניסה המובנה של הדפדפן. מידע נוסף זמין בטבלה הבאה:

סוג חובה דוגמה
פונקציה אופציונלי native_callback: handleResponse

cancel_on_tap_outside

השדה הזה מגדיר אם לבטל את בקשת האישור בלחיצה אחת אם המשתמש לוחץ מחוץ להנחיה. ערך ברירת המחדל הוא true. אפשר להשבית את ההורדה אם מגדירים את הערך ל-false. מידע נוסף מופיע בטבלה הבאה:

סוג חובה דוגמה
בוליאני אופציונלי cancel_on_tap_outside: false

prompt_parent_id

המאפיין הזה מגדיר את מזהה ה-DOM של רכיב מאגר התגים. אם הוא לא מוגדר, ההנחיה 'אישור מהיר' מוצגת בפינה השמאלית העליונה של החלון. מידע נוסף מופיע בטבלה הבאה:

סוג חובה דוגמה
מחרוזת אופציונלי prompt_parent_id: 'parent_id'

צופן חד-פעמי (nonce)

השדה הזה הוא מחרוזת רנדומלית שמשמשת באסימון המזהה כדי למנוע התקפות שליחה מחדש. מידע נוסף מופיע בטבלה הבאה:

סוג חובה דוגמה
מחרוזת אופציונלי nonce: "biaqbm70g23"

האורך של ה-nonce מוגבל לגודל המקסימלי של JWT שנתמך בסביבה שלכם, ולמגבלות הגודל של HTTP בדפדפן ובשרת.

essential_claims

השדה הזה הוא מחרוזת שמשמשת לבקשת טענות נוספות שייכללו באסימון המזהה שמוחזר על ידי Google. לרשימה מלאה של הטענות שמתקבלות על ידי Google, אפשר לעיין בטענות נתמכות.

מידע נוסף מופיע בטבלה הבאה:

סוג חובה דוגמה
מחרוזת אופציונלי essential_claims: "auth_time, amr"

הקשר

השדה הזה משנה את הטקסט של הכותרת וההודעות שמוצגות בהנחיה של לחיצה אחת, ללא השפעה על דפדפני ITP. ברירת המחדל היא signin.

מידע נוסף מופיע בטבלה הבאה:

סוג חובה דוגמה
מחרוזת אופציונלי context: "use"

בטבלה הבאה מפורטים כל ההקשרים הזמינים והתיאורים שלהם:

הקשר
signin ‫"Sign in to"‏ (כניסה לחשבון)
signup "הרשמה אל"
use "שימוש"

אם אתם צריכים להציג את התכונה 'הצטרפות בלחיצה אחת' בדומיין הראשי ובתת-הדומיינים שלו, צריך להעביר את הדומיין הראשי לשדה הזה כדי להשתמש בקובץ cookie יחיד של מצב משותף. מידע נוסף מופיע בטבלה הבאה:

סוג חובה דוגמה
מחרוזת אופציונלי state_cookie_domain: "example.com"

ux_mode

בשדה הזה מגדירים את תהליך חוויית המשתמש שמופעל כשלוחצים על הלחצן 'כניסה באמצעות חשבון Google'. ערך ברירת המחדל הוא popup. לתכונה הזו אין השפעה על חוויית המשתמש של One Tap. מידע נוסף זמין בטבלה הבאה:

סוג חובה דוגמה
מחרוזת אופציונלי ux_mode: "redirect"

בטבלה הבאה מפורטים מצבי חוויית המשתמש שזמינים ותיאורים שלהם.

מצב UX
popup מבצע תהליך UX לכניסה לחשבון בחלון קופץ.
redirect מבצע תהליך UX לכניסה באמצעות הפניה לדף מלא.

allowed_parent_origin

המקורות שמותר להם להטמיע את ה-iframe של הביניים. אם השדה הזה קיים, התכונה 'הצטרפות בלחיצה אחת' פועלת במצב iframe ביניים. מידע נוסף מופיע בטבלה הבאה:

סוג חובה דוגמה
מחרוזת או מערך מחרוזות אופציונלי 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 בתהליך ההרשמה בלחיצה אחת ייכשל וייפסק.

intermediate_iframe_close_callback

המדיניות הזו מבטלת את התנהגות ברירת המחדל של ה-iframe הביניים כשמשתמשים סוגרים ידנית את לחיצה אחת על ידי הקשה על הלחצן X בממשק המשתמש של לחיצה אחת. התנהגות ברירת המחדל היא להסיר את ה-iframe הביניים מ-DOM באופן מיידי.

השדה intermediate_iframe_close_callback תקף רק במצב ביניים של iframe. היא משפיעה רק על ה-iframe הביניים, ולא על ה-iframe של לחיצה אחת. ממשק המשתמש של One Tap מוסר לפני הפעלת הקריאה החוזרת.

סוג חובה דוגמה
פונקציה אופציונלי intermediate_iframe_close_callback: logBeforeClose

itp_support

השדה הזה קובע אם להפעיל בדפדפנים שתומכים במניעת מעקב חכמה (ITP) את ממשק המשתמש המשודרג של לחיצה אחת. ערך ברירת המחדל הוא false. מידע נוסף מופיע בטבלה הבאה:

סוג חובה דוגמה
בוליאני אופציונלי itp_support: true

login_hint

אם האפליקציה יודעת מראש איזה משתמש צריך להיכנס, היא יכולה לספק ל-Google רמז לכניסה. אם הפעולה מצליחה, דילוג על בחירת החשבון. הערכים המקובלים הם: כתובת אימייל או ערך של שדה sub של טוקן מזהה.

מידע נוסף זמין בשדה login_hint במסמכי התיעוד של OpenID Connect.

סוג חובה דוגמה
מחרוזת, כתובת אימייל או הערך מהשדה sub של אסימון מזהה. אופציונלי login_hint: 'elisa.beckett@gmail.com'

hd

אם למשתמש יש כמה חשבונות והוא צריך להיכנס רק לחשבון Workspace שלו, אפשר להשתמש בהגדרה הזו כדי לספק ל-Google רמז לגבי שם הדומיין. אם הפעולה מצליחה, חשבונות המשתמשים שמוצגים במהלך בחירת החשבון מוגבלים לדומיין שצוין. ערך של wildcard: * מציע למשתמש רק חשבונות Workspace ומוציא מכלל אפשרות חשבונות לצרכן (user@gmail.com) במהלך בחירת החשבון.

מידע נוסף מופיע בשדה hd במסמכי התיעוד של OpenID Connect.

סוג חובה דוגמה
מחרוזת. שם דומיין שמוגדר במלואו או *. אופציונלי hd: '*'

use_fedcm_for_prompt

מאפשרים לדפדפן לשלוט בהנחיות למשתמשים להיכנס לחשבון ולנהל את תהליך הכניסה בין האתר שלכם לבין Google. ברירת המחדל היא False. מידע נוסף זמין בדף מעבר ל-FedCM.

סוג חובה דוגמה
בוליאני הוצא משימוש use_fedcm_for_prompt: true

use_fedcm_for_button

השדה הזה קובע אם צריך להשתמש בממשק משתמש של לחצן FedCM ב-Chrome (במחשב M125+ וב-Android M128+). ברירת המחדל היא false. מידע נוסף מופיע בטבלה הבאה:

סוג חובה דוגמה
בוליאני אופציונלי use_fedcm_for_button: true

button_auto_select

השדה הזה קובע אם להפעיל את האפשרות בחירה אוטומטית בתהליך של לחצן FedCM. אם האפשרות הזו מופעלת, משתמשים חוזרים עם סשן פעיל ב-Google יתחברו אוטומטית, בלי שתופיע ההנחיה של Account Chooser. ברירת המחדל היא false. צריך להפעיל באופן מפורש את הכניסה האוטומטית באמצעות לחצן במהלך ההשקה של ההצטרפות. מידע נוסף מופיע בטבלה הבאה:

סוג חובה דוגמה
בוליאני אופציונלי button_auto_select: true

שיטה: google.accounts.id.prompt

השיטה google.accounts.id.prompt מציגה את ההנחיה לאימות בלחיצה אחת או את מנהל האישורים המובנה בדפדפן אחרי שמפעילים את השיטה initialize(). דוגמה לשיטה מופיעה בקוד הבא:

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

בדרך כלל, קריאה לשיטה prompt() מתבצעת בטעינת הדף. יכול להיות שממשק המשתמש של ההנחיה לאישור בלחיצה אחת לא יוצג בגלל סטטוס הסשן והגדרות המשתמש בצד של Google. כדי לקבל התראות על סטטוס ממשק המשתמש ברגעים שונים, צריך להעביר פונקציה לקבלת התראות על סטטוס ממשק המשתמש.

ההתראות מופעלות ברגעים הבאים:

  • רגע התצוגה: הרגע הזה מתרחש אחרי שקוראים למתודה prompt(). ההתראה מכילה ערך בוליאני שמציין אם ממשק המשתמש מוצג או לא.
  • רגע שנדלג עליו: המצב הזה מתרחש כשחלון ההודעה 'כניסה בלחיצה אחת' נסגר בגלל ביטול אוטומטי, ביטול ידני או כש-Google לא מצליחה להנפיק אישור גישה, למשל כשהמשתמש התנתק מ-Google במהלך הסשן שנבחר.

    במקרים כאלה, מומלץ להמשיך לספקי הזהויות הבאים, אם יש כאלה.

  • רגע שבו נסגר החלון: מתרחש כש-Google מאחזרת בהצלחה פרטי כניסה או כשמשתמש רוצה להפסיק את תהליך אחזור פרטי הכניסה. לדוגמה, כשהמשתמש מתחיל להזין את שם המשתמש והסיסמה שלו בתיבת הדו-שיח לכניסה, אפשר לקרוא לשיטה google.accounts.id.cancel() כדי לסגור את ההנחיה 'הצטרפות בלחיצה אחת' ולהפעיל רגע של ביטול.

בדוגמה הבאה של קוד מוטמע רגע שדילגו עליו:

<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() הפונקציה מחזירה true אם סוג הרגע הוא PromptMoment.DISPLAY וההנחיה להצטרפות בלחיצה אחת מוצגת.

הערה: כש-FedCM מופעל, ההתראה הזו לא נתמכת. מידע נוסף זמין בדף בנושא מעבר ל-FedCM.
isNotDisplayed() הפונקציה מחזירה true אם סוג הרגע הוא PromptMoment.DISPLAY וההנחיה להצטרפות בלחיצה אחת לא מוצגת.

הערה: כש-FedCM מופעל, ההתראה הזו לא נתמכת. מידע נוסף זמין בדף בנושא מעבר ל-FedCM.
getNotDisplayedReason()

הסיבה המפורטת לכך שממשק המשתמש לא מוצג. אלה הערכים האפשריים:

  • 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() מחזירה true אם סוג הרגע הוא PromptMoment.SKIPPED

הערה: כש-FedCM מופעל, יש תמיכה חלקית בשיטה הזו. בפרט, הוא לא תומך בסיבת הדילוג user_cancel. מידע נוסף זמין בדף מעבר ל-FedCM.
getSkippedReason()

הסיבה המפורטת לכך שרגע מסוים לא נכלל. אלה הערכים האפשריים:

  • auto_cancel
  • user_cancel
  • tap_outside
  • issuing_failed
הערה: כשהתכונה FedCM מופעלת, יש תמיכה חלקית בשיטה הזו. באופן ספציפי, הוא לא תומך בסיבת הדילוג user_cancel. מידע נוסף זמין בדף מעבר ל-FedCM.
isDismissedMoment() מחזירה true אם סוג הרגע הוא PromptMoment.DISMISSED.

הערה: השיטה הזו נתמכת באופן מלא כש-FedCM מופעל. מידע נוסף זמין בדף מעבר ל-FedCM.
getDismissedReason()

הסיבה המפורטת לסגירת ההזדמנות. אלה הערכים האפשריים:

  • credential_returned
  • cancel_called
  • flow_restarted
הערה: השיטה הזו נתמכת באופן מלא כש-FedCM מופעל. מידע נוסף זמין בדף מעבר ל-FedCM.
getMomentType()

מחזירה מחרוזת של סוג הרגע. אלה הערכים האפשריים:

  • display
  • skipped
  • dismissed

סוג הנתונים: CredentialResponse

כשמפעילים את הפונקציה callback, מועבר אובייקט CredentialResponse כפרמטר. בטבלה הבאה מפורטים השדות שכלולים באובייקט התגובה של פרטי הכניסה:

שדה
credential אסימון מזהה JWT מקודד ש-Google מנפיקה.
select_by איך המשתמש נכנס לחשבון.
state השדה הזה מוגדר רק כשהמשתמש לוחץ על לחצן 'כניסה באמצעות חשבון Google' כדי להיכנס, והמאפיין state של הלחצן מצוין.

מסמך לאימות

השדה הזה הוא אסימון מזהה כמחרוזת של JSON Web Token ‏ (JWT) בקידוד Base64.

כשמבצעים פענוח, ה-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.

משתמשים יכולים להירשם לחשבונות Google בלי להשתמש ב-Gmail או ב-Google Workspace. אם email לא מכיל את הסיומת @gmail.com ו-hd לא קיים, Google לא מהימנה ומומלץ להשתמש בסיסמה או בשיטות אחרות לאימות המשתמש. email_verfied יכול להיות שזה נכון כי Google אימתה את המשתמש בהתחלה כשנוצר חשבון Google, אבל יכול להיות שמאז השתנתה הבעלות על חשבון האימייל של הצד השלישי.

בשדה exp מוצג תאריך התפוגה של האסימון, שעד אליו צריך לאמת את האסימון בצד השרת. שעה אחת לאסימון מזהה שהתקבל באמצעות 'כניסה באמצעות חשבון Google'. צריך לאמת את הטוקן לפני מועד התפוגה. אין להשתמש ב-exp לניהול סשנים. תוקף של אסימון מזהה שפג לא אומר שהמשתמש יצא מהחשבון. האפליקציה אחראית לניהול הסשנים של המשתמשים.

select_by

בטבלה הבאה מפורטים הערכים האפשריים של השדה select_by. הערך נקבע לפי סוג הלחצן שבו נעשה שימוש, יחד עם מצב ההסכמה והסשן.

  • המשתמש לחץ על הלחצן 'כניסה באמצעות Google One Tap' או על הלחצן 'כניסה באמצעות חשבון Google', או השתמש בתהליך הכניסה האוטומטי ללא מגע.

  • נמצאה סשן קיים, או שהמשתמש בחר חשבון Google ונכנס אליו כדי ליצור סשן חדש.

  • לפני שמשתפים את פרטי הכניסה של טוקן ה-ID עם האפליקציה, המשתמש צריך

    • לחצו על כפתור האישור כדי להביע את הסכמתם לשיתוף פרטי הכניסה, או
    • הענקתם בעבר הסכמה והשתמשתם באפשרות 'בחירת חשבון' כדי לבחור חשבון Google.

הערך של השדה הזה מוגדר לאחד מהסוגים הבאים:

ערך תיאור
auto כניסה אוטומטית של משתמש עם סשן קיים שנתן בעבר הסכמה לשיתוף פרטי הכניסה. האפשרות הזו רלוונטית רק לדפדפנים שלא תומכים ב-FedCM.
user משתמש עם סשן קיים שנתן בעבר הסכמה, לחץ על הלחצן 'המשך בתור' של אישור בלחיצה אחת כדי לשתף את פרטי הכניסה. ההגדרה רלוונטית רק לדפדפנים שלא תומכים ב-FedCM.
fedcm משתמש לחץ על הלחצן 'המשך בתור' של One Tap כדי לשתף פרטי כניסה באמצעות FedCM. ההגדרה חלה רק על דפדפנים שנתמכים על ידי FedCM.
fedcm_auto כניסה אוטומטית של משתמש עם סשן קיים שבעבר הסכים לשיתוף פרטי הכניסה באמצעות FedCM One Tap. ההגדרה חלה רק על דפדפנים עם תמיכה ב-FedCM.
user_1tap משתמש עם סשן קיים לחץ על הלחצן 'המשך בתור' של לחיצה אחת כדי לתת הסכמה ולשתף פרטי כניסה. חל רק על Chrome בגרסה 75 ומעלה.
user_2tap משתמש בלי סשן קיים לחץ על הלחצן 'המשך בתור' של One Tap כדי לבחור חשבון, ואז לחץ על הלחצן 'אישור' בחלון קופץ כדי לתת הסכמה ולשתף את פרטי הכניסה. ההגדרה חלה על דפדפנים שלא מבוססים על 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 הטקסט שמופיע בלחצן. לדוגמה, Sign in with Google (כניסה באמצעות חשבון Google) או Sign up with Google (הרשמה באמצעות חשבון Google).
shape הצורה של הלחצן. לדוגמה, מלבני או עגול.
logo_alignment היישור של הלוגו של Google: לשמאל או למרכז.
width רוחב הכפתור, בפיקסלים.
locale אם ההגדרה מוגדרת, שפת הלחצן מוצגת.
click_listener אם מגדירים את הפונקציה הזו, המערכת קוראת לה כשלוחצים על הלחצן 'כניסה באמצעות חשבון Google'.
state אם ההגדרה הזו מוגדרת, המחרוזת הזו מוחזרת עם טוקן המזהה.

סוגי מאפיינים

בקטעים הבאים מפורטים כל סוגי המאפיינים, ומוצגת דוגמה לכל אחד מהם.

סוג

סוג הכפתור. ערך ברירת המחדל הוא standard.

מידע נוסף מופיע בטבלה הבאה:

סוג חובה דוגמה
מחרוזת כן type: "icon"

בטבלה הבאה מפורטים סוגי הלחצנים הזמינים והתיאורים שלהם:

סוג
standard
כפתור עם טקסט או מידע בהתאמה אישית.
icon
כפתור עם סמל בלי טקסט.

עיצוב

העיצוב של הלחצן. ערך ברירת המחדל הוא outline. מידע נוסף מופיע בטבלה הבאה:

סוג חובה דוגמה
מחרוזת אופציונלי theme: "filled_blue"

בטבלה הבאה מפורטים העיצובים שזמינים ותיאור שלהם:

עיצוב
outline
עיצוב כפתור רגיל.
filled_blue
עיצוב כפתורים עם מילוי כחול.
filled_black
עיצוב כפתורים עם מילוי שחור.

size

גודל הכפתור. ערך ברירת המחדל הוא large. מידע נוסף מופיע בטבלה הבאה:

סוג חובה דוגמה
מחרוזת אופציונלי size: "small"

בטבלה הבאה מפורטים הגדלים הזמינים של הלחצנים והתיאורים שלהם:

גודל
large
כפתור רגיל גדול לחצן עם סמל גדול כפתור גדול בהתאמה אישית
כפתור גדול.
medium
כפתור רגיל בגודל בינוני לחצן עם סמל בגודל בינוני
כפתור בגודל בינוני.
small
כפתור קטן לכניסה כפתור קטן לכניסה
כפתור קטן.

text

הטקסט של הכפתור. ערך ברירת המחדל הוא 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.

רוחב

הרוחב המינימלי של הלחצן, בפיקסלים. הרוחב המקסימלי הוא 400 פיקסלים.

מידע נוסף מופיע בטבלה הבאה:

סוג חובה דוגמה
מחרוזת אופציונלי width: "400"

לוקאל

אופציונלי. הצגת טקסט הלחצן באמצעות הלוקאל שצוין, אחרת ברירת המחדל היא הגדרות חשבון Google או הגדרות הדפדפן של המשתמשים. כשמעמיסים את הספרייה, מוסיפים את הפרמטר hl ואת קוד השפה להוראת המקור (src), למשל: gsi/client?hl=<iso-639-code>.

אם לא מוגדרת שפה, נעשה שימוש בלוקאל ברירת המחדל של הדפדפן או בהעדפה של המשתמש בסשן Google. לכן, משתמשים שונים עשויים לראות גרסאות שונות של לחצנים מותאמים לשפה, ואולי גם בגדלים שונים.

מידע נוסף מופיע בטבלה הבאה:

סוג חובה דוגמה
מחרוזת אופציונלי locale: "zh_CN"

click_listener

אפשר להגדיר פונקציית JavaScript שתופעל כשלוחצים על הלחצן 'כניסה באמצעות חשבון Google' באמצעות המאפיין click_listener.

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

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

בדוגמה הזו, ההודעה Sign in with Google button clicked...‎ מתועדת במסוף כשלוחצים על הכפתור 'כניסה באמצעות חשבון Google'.

הסמוי הסופי

אופציונלי. אפשר להציג כמה לחצנים של 'כניסה באמצעות חשבון Google' באותו דף, ולכן אפשר להקצות לכל לחצן מחרוזת ייחודית. אותו מחרוזת תוחזר יחד עם אסימון המזהה, כך שתוכלו לזהות על איזה לחצן המשתמש לחץ כדי להיכנס.

מידע נוסף מופיע בטבלה הבאה:

סוג חובה דוגמה
מחרוזת אופציונלי data-state: "button 1"

סוג הנתונים: פרטי כניסה

כשמפעילים את הפונקציה native_callback, אובייקט Credential מועבר כפרמטר. בטבלה הבאה מפורטים השדות שכלולים באובייקט:

שדה
id מזהה את המשתמש.
password הסיסמה

שיטה: google.accounts.id.disableAutoSelect

כשמשתמש יוצא מהאתר שלכם, אתם צריכים להפעיל את השיטה google.accounts.id.disableAutoSelect כדי לתעד את הסטטוס בקובצי Cookie. כך נמנעת לולאה אינסופית בממשק המשתמש. קטע הקוד הבא מציג את השיטה:

google.accounts.id.disableAutoSelect()

בדוגמת הקוד הבאה מוטמעת המתודה google.accounts.id.disableAutoSelect עם הפונקציה onSignout():

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

Method: google.accounts.id.storeCredential

השיטה הזו היא wrapper לשיטת store() של API מנהל האישורים המובנה בדפדפן. לכן, אפשר להשתמש בה רק כדי לאחסן אישור סיסמה. אפשר לראות את דוגמת הקוד הבאה של השיטה:

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

בדוגמת הקוד הבאה מוטמעת המתודה google.accounts.id.storeCredential עם הפונקציה onSignIn():

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

‫Method: google.accounts.id.cancel

אפשר לבטל את התהליך של לחיצה אחת אם מסירים את ההנחיה מ-DOM של הצד המסתמך. פעולת הביטול מתעלמת מההנחיה אם כבר נבחרו פרטי כניסה. אפשר לראות את דוגמת הקוד הבאה של השיטה:

google.accounts.id.cancel()

בדוגמת הקוד הבאה מוטמעת המתודה google.accounts.id.cancel() עם הפונקציה onNextButtonClicked():

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

קריאה חוזרת לטעינת הספרייה: onGoogleLibraryLoad

אפשר לרשום קריאה חוזרת (callback) של onGoogleLibraryLoad. היא מקבלת הודעה אחרי שטוענים את ספריית JavaScript של הכניסה באמצעות חשבון Google:

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

הקריאה החוזרת הזו היא רק קיצור דרך לקריאה החוזרת window.onload. אין הבדלים בהתנהגות.

בדוגמה הבאה מוצגת הטמעה של קריאה חוזרת (callback) של onGoogleLibraryLoad:

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

שיטה: google.accounts.id.revoke

השיטה google.accounts.id.revoke מבטלת את הרשאת ה-OAuth שמשמשת לשיתוף טוקן ה-ID של המשתמש שצוין. אפשר לראות את קטע הקוד הבא של השיטה: javascript google.accounts.id.revoke(login_hint, callback)

פרמטר סוג תיאור
login_hint מחרוזת כתובת האימייל או המזהה הייחודי של חשבון Google של המשתמש. המזהה הוא מאפיין sub של מטען הייעודי (payload) של האישורים.
callback פונקציה אופציונלי: רכיב handler של RevocationResponse.

בדוגמת הקוד הבאה אפשר לראות איך משתמשים במתודה revoke עם מזהה.

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

סוג הנתונים: RevocationResponse

כשמפעילים את הפונקציה callback, מועבר אובייקט RevocationResponse כפרמטר. בטבלה הבאה מפורטים השדות שכלולים באובייקט התגובה של ביטול ההרשאה:

שדה
successful השדה הזה הוא ערך ההחזרה של הפעלת method.
error השדה הזה יכול להכיל הודעת תגובה מפורטת לשגיאה.

הפעולה בוצעה בהצלחה

השדה הזה הוא ערך בוליאני שמוגדר כ-True אם הפעלת ה-method של הביטול הצליחה, או כ-False אם היא נכשלה.

error

השדה הזה הוא ערך מחרוזת והוא מכיל הודעת שגיאה מפורטת אם הפעלת method revoke נכשלה. אם הקריאה הצליחה, הערך של השדה לא מוגדר.