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

Natalia Markoborodova

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

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

• אחסון שמחולק לפי מי שפתח את הקובץ
• ממשק משתמש שדומה לחלון קופץ

למה אנחנו צריכים חלונות קופצים עם חלוקה למחיצות?

חלונות קופצים מחולקים מיועדים לשמירה על מאפייני הפרטיות של iframe מחולק ועל מאפייני האבטחה של חלונות קופצים.

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

איך פועלות מודעות פופ-אפ מחולקות?

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

נניח שיש אתר opener.example שמטמיע תוכן מהאתר third-party.example. כדי להציג תוכן בהתאמה אישית ב-opener.example, המשתמש צריך להיכנס ל-third-party.example. כשקובצי Cookie של צד שלישי חסומים בדפדפן של המשתמש, תהליך הצגת החלון הקופץ הנוכחי הוא כזה:

1. המשתמש לוחץ על לחצן כניסה.
2. תיפתח תיבת דו-שיח.
3. המשתמש מתחבר מההקשר ברמה העליונה של third-party.example, וקובץ Cookie לאימות שלא מחולק למחיצות נכתב.
4. לתוכן third-party.example שמוטמע ב-opener.example אין גישה לקובצי ה-cookie שלו ברמה העליונה שנכתבו ב-third-party.example כשהוא הוצג בהקשר של אינטראקציה ישירה. הסיבה לכך היא שקובץ ה-Cookie לאימות לא מחולק למחיצות, ולכן הוא קובץ Cookie של צד שלישי.

האחסון של חלון קופץ מחולק למחיצות לפי החלון הראשי. השינוי הזה משפיע על שלבים 3-4 בתהליכים:

1. המשתמש מתחבר מההקשר ברמה העליונה של third-party.example. החלון הקופץ מחולק למחיצות, ולכן האחסון מחולק למחיצות לפי opener.example.

2. לתוכן third-party.example שמוטמע ב-opener.example יש גישה לקובץ Cookie משלו שהוגדר בחלון הקופץ, כי הם חולקים את אותו אחסון מחולק.

ממשק משתמש דמוי חלון קופץ ביחס לכרטיסייה שממנה הוא נפתח

מטרת החלונות הקופצים המופרדים היא לעזור למשתמש להבין שהחלון הפותח והחלון הקופץ קשורים:

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

רוצה לנסות?

ב-Chrome 132 אנחנו משיקים תקופת ניסיון למפתחים לתכונה Partitioned Popins. המשמעות היא שהתכונה תהיה זמינה מאחורי דגל. כך אפשר לנסות חלונות קופצים מחולקים:

1. מוודאים שמשתמשים ב-Chrome 132 ואילך.
2. עוברים אל chrome://flags#partitioned-popins ומפעילים את ה-feature flag.
3. מפעילים מחדש את Chrome.
4. כדאי לנסות את ההדגמה שלנו.

שימוש בחלונות קופצים מחולקים באתר

כדי להשתמש בחלון קופץ עם חלוקה למחיצות באתר, קוראים לשיטה window.open() עם הפרמטר popin:

window.open("third-party-popin.example", "_blank", "popin");

שיתוף משוב

אנחנו בודקים את האפשרות להשתמש בחלונות קופצים מחולקים ומחפשים משוב ממפתחים. הנה כמה תרחישים לדוגמה:

• תהליך אימות משתמשים. אם הטמעתם תהליך אימות מותאם אישית, והאימות מתבצע בדומיין אחר מהדומיין של האתר שלכם (לדוגמה, site.example משתמשים נכנסים לחשבון ב-auth-site.example), נסו לפתוח את דף האימות בחלון קופץ כדי להשתמש בקובץ ה-Cookie של הסשן בדף הפותח.
• תוכן מוטמע. אפשר לנסות חלונות קופצים מחולקים כדי להציג תוכן נוסף מווידג'ט של צד שלישי, כמו תיבת דו-שיח של הגדרות, תמונה או PDF (או תוכן אחר שבדרך כלל נטען בחלון קופץ), שמוצג בחלון גדול יותר. במקרה הזה, מטרת החלונות הקופצים עם חלוקה למחיצות היא לשמור על מצב הסשן של המשתמש בין הווידג'ט של הצד השלישי לבין האתר שלכם.

אם אתם נתקלים באחד מהתרחישים האלה בפתרונות שלכם, אם יש לכם תרחישי שימוש אחרים או אם אתם רוצים לעזור לנו לעצב את העתיד של התכונה הזו, אתם יכולים לנסות אותה ולספר לנו:

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

כדי לשתף את דעתכם, אתם יכולים להגיש issue ב-GitHub.