ממשק API להפעלת התראות

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

מהם טריגרים של התראות?

מפתחי אתרים יכולים להציג התראות באמצעות Web Notifications API. הרבה פעמים משתמשים בתכונה הזו יחד עם Push API כדי ליידע את המשתמשים על מידע רגיש מבחינת זמן, כמו מבזקי חדשות או הודעות שהתקבלו. התראות מוצגות על ידי הרצת JavaScript במכשיר של המשתמש.

הבעיה ב-Push API היא שהוא לא מהימן להפעלת התראות שחייבות להופיע כשמתקיים תנאי מסוים, כמו שעה או מיקום. דוגמה לתנאי מבוסס זמן היא התראה ביומן שמזכירה לכם פגישה חשובה עם הבוס בשעה 14:00. דוגמה לתנאי שמבוסס על מיקום היא התראה שמזכירה לקנות חלב כשאתם נכנסים לקרבת המצרכים. קישוריות רשת או תכונות לשימור סוללה, כמו מצב 'נמנום', יכולות לעכב את השליחה של התראות שמבוססות על דחיפה.

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

תרחישים לדוגמה

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

רשת טלוויזיה עשויה להזכיר למשתמשים שתוכנית הטלוויזיה האהובה עליהם עומדת להתחיל או ששידור חי של שיחת ועידה עומד להתחיל.

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

הסטטוס הנוכחי

שלב סטטוס
‫1. יצירת הסבר הושלם
‫2. יצירת טיוטה ראשונית של מפרט לא התחיל
3. אוספים משוב וחוזרים על העיצוב. בטיפול
‫4. גרסת מקור לניסיון התשובה מלאה
5. השקה לא התחיל

איך משתמשים בטריגרים של התראות

מפעיל דרך about://flags

כדי להתנסות ב-Notification Triggers API באופן מקומי, ללא אסימון מקור לניסיון, מפעילים את הדגל #enable-experimental-web-platform-features ב-about://flags.

זיהוי תכונות

כדי לבדוק אם הדפדפן תומך בטריגרים של התראות, אפשר לבדוק אם הנכס showTrigger קיים:

if ('showTrigger' in Notification.prototype) {
  /* Notification Triggers supported */
}

תזמון התראה

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

const createScheduledNotification = async (tag, title, timestamp) => {
  const registration = await navigator.serviceWorker.getRegistration();
  registration.showNotification(title, {
    tag: tag,
    body: 'This notification was scheduled 30 seconds ago',
    showTrigger: new TimestampTrigger(timestamp + 30 * 1000),
  });
};

ביטול של התראה מתוזמנת

כדי לבטל התראות מתוזמנות, צריך קודם לבקש עד ServiceWorkerRegistration.getNotifications() רשימה של כל ההתראות שתואמות לתג מסוים. שימו לב שצריך להעביר את הדגל includeTriggered כדי שההתראות המתוזמנות ייכללו ברשימה:

const cancelScheduledNotification = async (tag) => {
  const registration = await navigator.serviceWorker.getRegistration();
  const notifications = await registration.getNotifications({
    tag: tag,
    includeTriggered: true,
  });
  notifications.forEach((notification) => notification.close());
};

ניפוי באגים

כדי לנפות באגים בהתראות, אפשר להשתמש בחלונית ההתראות של כלי הפיתוח ל-Chrome. כדי להתחיל בניפוי באגים, לוחצים על התחלת ההקלטה של אירועים התחלת ההקלטה של אירועים או על Control+E (Command+E ב-Mac). כלי הפיתוח ל-Chrome מתעדים את כל אירועי ההתראות, כולל התראות מתוזמנות, התראות מוצגות והתראות במצב סגור, למשך שלושה ימים, גם כשכלי הפיתוח סגורים.

אירוע של התראה מתוזמנת נרשם בחלונית 'התראות' בכלי הפיתוח ל-Chrome, שנמצאת בחלונית האפליקציה.
התראה מתוזמנת.
אירוע התראה שמוצג נרשם בחלונית 'התראות' ב'כלי פיתוח ל-Chrome'.
מוצגת התראה.

הדגמה (דמו)

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

צילום מסך של אפליקציית האינטרנט להדגמה של 'טריגרים של התראות'.
ההדגמה של התראות טריגרים.

אבטחה והרשאות

צוות Chrome תכנן והטמיע את Notification Triggers API לפי עקרונות הליבה שהוגדרו ב-Controlling Access to Powerful Web Platform Features, כולל בקרת משתמשים, שקיפות וארגונומיה. מכיוון של-API הזה נדרשים Service Worker, נדרש גם הקשר מאובטח. כדי להשתמש ב-API, צריכה להיות לכם הרשאה זהה לזו של התראות רגילות.

שליטת משתמשים

ה-API הזה זמין רק בהקשר של ServiceWorkerRegistration. כלומר, כל הנתונים שנדרשים מאוחסנים באותו הקשר ונמחקים באופן אוטומטי כשמוחקים את Service Worker או כשהמשתמש מוחק את כל נתוני האתר מהמקור. חסימת קובצי cookie מונעת גם התקנה של עובדי שירות ב-Chrome, ולכן לא ניתן להשתמש ב-API הזה. המשתמשים תמיד יכולים להשבית את ההתראות באתר בהגדרות האתר.

שקיפות

בניגוד ל-Push API, ה-API הזה לא תלוי ברשת, ולכן ההתראות המתוזמנות צריכות את כל הנתונים הנדרשים מראש, כולל משאבי תמונות שמוזכרים במאפיינים badge, icon ו-image. כלומר, המפתח לא יכול לראות את ההתראה המתוזמנת, והיא לא מוציאה את קובץ השירות (Service Worker) ממצב שינה עד שהמשתמש יוצר אינטראקציה עם ההתראה. כתוצאה מכך, אין כרגע דרך ידועה שבה המפתח יכול להשיג מידע על המשתמש באמצעות גישות שעלולות לפרוץ לפרטיות, כמו חיפוש מיקום גיאוגרפי של כתובת ה-IP. העיצוב הזה גם מאפשר לתכונה להשתמש במנגנונים לתזמון שמספק מערכת ההפעלה, כמו AlarmManager של Android, כדי להאריך את חיי הסוללה.

משוב

הצוות של Chrome רוצה לשמוע על חוויית השימוש שלך בטריגרים של התראות.

מתארים את עיצוב ה-API

האם יש משהו ב-API שלא פועל כצפוי? או שיש שיטות או מאפיינים חסרים שאתם צריכים ליישם את הרעיון שלכם? יש לכם שאלה או הערה לגבי מודל האבטחה? דווחו על בעיית מפרט במאגר ההתראות של Triggers GitHub או הוסיפו את דעתכם לגבי בעיה קיימת.

נתקלתם בבעיה בהטמעה?

מצאת באג בהטמעה של Chrome? או שההטמעה שונה מהמפרט? דווחו על באג בכתובת new.crbug.com. הקפידו לכלול כמה שיותר פרטים, הוראות פשוטות לשחזור הרכיבים והגדרתם את הרכיבים ל-UI>Notifications. Glitch עובדת נהדרת עם שיתוף מהיר וקל של שחזורים של באגים.

אתם מתכננים להשתמש ב-API?

אתם מתכננים להשתמש בטריגרים של התראות באתר? התמיכה הציבורית שלכם עוזרת לנו לתעדף תכונות ומראה לספקי דפדפנים אחרים עד כמה חשוב לתמוך בהם. שלחו ציוץ אל @ChromiumDev בעזרת ה-hashtag #NotificationTriggers, וספרו לנו איפה אתם משתמשים בו ואיך אתם משתמשים בו.

קישורים מועילים

אישורים

טריגרים של התראות הוטמעו על ידי ריצ'רד קנול, והסבר ההסבר נכתב על ידי פיטר בוורלו, עם תרומות של ריצ'רד. האנשים הבאים בדקו את המאמר: ג'ו מדלי, Pete LePage, וגם ריצ'רד ופיטר. תמונה ראשית (Hero) מאת Lukas Blazek ב-Un בדיקה.