לפני שמוסיפים לאתר את 'כניסה באמצעות חשבון Google', 'הקשה אחת' או 'כניסה אוטומטית', מגדירים את פרוטוקול OAuth (ואפשר גם להגדיר את מדיניות אבטחת התוכן של האתר).
איך מקבלים את מזהה הלקוח ב-Google API
כדי להפעיל את התכונה 'כניסה באמצעות חשבון Google' באתר, קודם צריך להגדיר את מזהה הלקוח ב-Google API. כדי לעשות זאת:
- פותחים את הדף Credentials במסוף Google APIs.
- יוצרים או בוחרים פרויקט ב-Google APIs. אם כבר יש לכם פרויקט ללחצן 'כניסה באמצעות חשבון Google' או ל-Google One Tap, אתם יכולים להשתמש בפרויקט הקיים ובמזהה הלקוח של האתר. כשיוצרים אפליקציות בסביבת ייצור, יכול להיות שתצטרכו כמה פרויקטים. עליכם לחזור על שאר השלבים בקטע הזה בכל פרויקט שאתם מנהלים.
- לוחצים על Create credentials > OAuth client ID ובאפשרות Application type בוחרים באפשרות Web application כדי ליצור מזהה לקוח חדש. כדי להשתמש במזהה לקוח קיים, בוחרים אחד מהסוגים Web application.
מוסיפים את ה-URI של האתר למקורות המורשים של JavaScript. ה-URI כולל רק את הסכימה ואת שם המארח המלא. לדוגמה,
https://www.example.com
.לחלופין, אפשר להחזיר את פרטי הכניסה באמצעות הפניה אוטומטית לנקודת קצה (endpoint) שאתם מארחים, במקום באמצעות קריאה חוזרת (callback) של JavaScript. במקרה כזה, צריך להוסיף את מזהי ה-URI של ההפניות האוטומטיות לקטע מזהי URI מורשים להפניה אוטומטית. מזהי URI להפניה אוטומטית כוללים את הסכימה, שם המארח המלא והנתיב, ועליהם לעמוד בכללי האימות של מזהי URI להפניה אוטומטית. לדוגמה:
https://www.example.com/auth-receiver
.
הגדרת מסך ההסכמה של OAuth
גם הכניסה באמצעות חשבון Google וגם האימות בנגיעה אחת כוללים מסך הסכמה שבו מוצגים למשתמשים פרטי האפליקציה שמבקשת גישה לנתונים שלהם, סוג הנתונים שהם מתבקשים לספק והתנאים החלים.
- פותחים את הדף OAuth consent screen בקטע APIs & Services (API ושירותים) במסוף Google Developer.
- אם מוצגת בקשה, בוחרים את הפרויקט שיצרתם.
בדף 'מסך הסכמה ל-OAuth', ממלאים את הטופס ולוחצים על הלחצן 'שמירה'.
שם האפליקציה: השם של האפליקציה שמבקשת הסכמה. השם צריך לשקף במדויק את האפליקציה שלכם, ולהיות עקבי עם שם האפליקציה שמוצג למשתמשים במקומות אחרים.
לוגו האפליקציה: התמונה הזו מוצגת במסך ההסכמה כדי לעזור למשתמשים לזהות את האפליקציה. הלוגו מוצג במסך ההסכמה של הכניסה באמצעות חשבון Google ובהגדרות החשבון, אבל הוא לא מוצג בתיבת הדו-שיח של One Tap.
כתובת אימייל לתמיכה: מוצגת במסך ההסכמה לתמיכה במשתמשים, וגם לאדמינים של G Suite שמעריכים את הגישה של המשתמשים שלהם לאפליקציה. כתובת האימייל הזו מוצגת למשתמשים במסך ההסכמה של 'כניסה באמצעות חשבון Google', כשהם לוחצים על שם האפליקציה.
היקפים ל-Google APIs: היקפי הרשאות מאפשרים לאפליקציה לגשת לנתונים הפרטיים של המשתמשים. לאימות, היקף ברירת המחדל (email, profile, openid) מספיק, אין צורך להוסיף היקפים רגישים. באופן כללי, השיטה המומלצת היא לבקש היקפים באופן מצטבר, בפעמים שבהן נדרשת גישה, ולא מראש. מידע נוסף
דומיינים מורשים: כדי להגן עליכם ועל המשתמשים שלכם, Google מאפשרת רק לאפליקציות שמבצעים אימות באמצעות OAuth להשתמש בדומיינים מורשים. הקישורים של האפליקציות חייבים להתארח בדומיינים מורשים. מידע נוסף
קישור לדף הבית של האפליקציה: מוצג במסך ההסכמה של Google ועם One-מקישים על כתב הוויתור שתואם ל-GDPR, מתחת ללחצן 'המשך בתור'. האתר חייב להתארח בדומיין מורשה.
קישור למדיניות הפרטיות של האפליקציה: מוצג במסך ההסכמה של 'כניסה באמצעות חשבון Google' ובמידע על כתב הוויתור שעומד בדרישות GDPR בנוגע לאפשרות 'המשך כ'. חייב להתארח בדומיין מורשה.
קישור לתנאים ולהגבלות של האפליקציה (אופציונלי): מוצג במסך ההסכמה של 'כניסה באמצעות חשבון Google' ובמידע על כתב ויתור תואם ל-GDPR בנגיעה אחת, מתחת ללחצן 'המשך כ'. האתר חייב להתארח בדומיין מורשה.
בודקים את 'סטטוס אימות'. אם הבקשה מצריכה אימות, לוחצים על הלחצן 'שליחה לאימות' כדי לשלוח את הבקשה לאימות. פרטים נוספים זמינים במאמר דרישות האימות של OAuth.
הצגת הגדרות OAuth במהלך הכניסה
הקשה אחת באמצעות FedCM
הדומיין Authorized domain ברמה העליונה מוצג במהלך הסכמת המשתמשים ב-Chrome.
הקשה אחת ללא FedCM
שם האפליקציה מוצג במהלך הבעת ההסכמה של המשתמשים.
איור 1. הגדרות ההסכמה ל-OAuth שמוצגות באמצעות One Tap ב-Chrome.
Content Security Policy
השימוש במדיניות אבטחת תוכן הוא אופציונלי, אבל מומלץ להשתמש בו כדי לאבטח את האפליקציה ולמנוע מתקפות XSS (Cross-Site Scripting). למידע נוסף, ראו מבוא ל-CSP וCSP ו-XSS.
מדיניות אבטחת התוכן עשויה לכלול הוראה אחת או יותר, כמו connect-src
, frame-src
, script-src
, style-src
או default-src
.
אם ספק ה-CSP שלכם כולל את:
- להוסיף את ההוראה
https://accounts.google.com/gsi/
כדי לאפשר לדף לטעון את כתובת ה-URL של ההורה של נקודות קצה בצד השרת של Google Identity Services.connect-src
frame-src
, מוסיפים אתhttps://accounts.google.com/gsi/
כדי לאפשר את כתובת ה-URL של האב של iframe של הלחצן 'כניסה באמצעות חשבון Google' ושל הלחצן 'הקשה אחת'.script-src
, מוסיפים את הערךhttps://accounts.google.com/gsi/client
כדי לאפשר את כתובת ה-URL של ספריית JavaScript של Google Identity Services.style-src
, מוסיפים אתhttps://accounts.google.com/gsi/style
כדי לאפשר את כתובת ה-URL של גיליונות הסגנון של Google Identity Services.- אם משתמשים בהוראה
default-src
, היא מהווה חלופה אם אחת מההוראות הקודמות (connect-src
,frame-src
,script-src
אוstyle-src
), מוסיפים אתhttps://accounts.google.com/gsi/
כדי לאפשר לדף לטעון את כתובת ה-URL של ההורה לנקודות הקצה בצד השרת של Google Identity Services.
כשמשתמשים ב-connect-src
, אין לכלול רשימה של כתובות URL בודדות של GIS. כך אפשר למזער כשלים כשמתבצע עדכון של GIS. לדוגמה, במקום להוסיף את https://accounts.google.com/gsi/status
, צריך להשתמש בכתובת ה-URL של ההורה GIS https://accounts.google.com/gsi/
.
כותרת התגובה הזו היא דוגמה לכותרת שמאפשרת ל-Google Identity Services לטעון ולהריץ את הקוד:
Content-Security-Policy-Report-Only: script-src
https://accounts.google.com/gsi/client; frame-src
https://accounts.google.com/gsi/; connect-src https://accounts.google.com/gsi/;
מדיניות פותחן מרובות מקורות
יכול להיות שתצטרכו לבצע שינויים ב-Cross-Origin-Opener-Policy
(COOP) בלחצן הכניסה באמצעות חשבון Google וב-Google One Tap כדי ליצור חלונות קופצים.
כשFedCM מופעל, הדפדפן מבצע עיבוד ישיר של חלונות קופצים ואין צורך לבצע שינויים.
עם זאת, כש-FedCM מושבת, צריך להגדיר את הכותרת COOP:
- אל
same-origin
ו- - כוללים את
same-origin-allow-popups
.
אי-הגדרה של הכותרת המתאימה גורמת לשיבוש בתקשורת בין החלונות, וכתוצאה מכך חלון קופץ ריק או באגים דומים.