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

Thomas Steiner

פורסם: 24 באוקטובר 2019

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

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

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

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

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

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

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

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

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

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

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

כדי להתנסות ב-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());
};

ניפוי באגים

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

אירוע של התראה מתוזמנת נרשם בחלונית Notifications (התראות) ב-Chrome DevTools, שנמצאת בחלונית Application (אפליקציה).
התראה מתוזמנת.
אירוע של התראה שמוצגת נרשם בחלונית Notifications (התראות) ב-Chrome DevTools.
התראה שמוצגת.

הדגמה (דמו)

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

אפליקציית האינטרנט להדגמה של הפעלת התראות.

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

צוות Chrome תכנן והטמיע את Notification Triggers API (ממשק API להפעלת התראות) בהתאם לעקרונות הליבה שמוגדרים במאמר שליטה בגישה לתכונות עוצמתיות של פלטפורמת האינטרנט, כולל שליטה של המשתמש, שקיפות וארגונומיה. מכיוון שה-API הזה דורש Service Workers, הוא דורש גם הקשר מאובטח. כדי להשתמש ב-API נדרשת אותה הרשאה כמו לשליחת התראות פוש רגילות.

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

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

שקיפות

בניגוד ל-Push API, ‏ API הזה לא תלוי ברשת, מה שאומר שצריך לספק מראש את כל הנתונים הנדרשים להצגת התראות מתוזמנות, כולל משאבי תמונות שמופנים אליהם באמצעות המאפיינים badge, icon ו-image. כלומר, המפתח לא יכול לראות את ההתראה המתוזמנת, וה-service worker לא מופעל עד שהמשתמש מקיים אינטראקציה עם ההתראה.

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

משוב

צוות Chrome רוצה לשמוע על החוויות שלכם עם Notification Triggers.

מהו עיצוב ה-API?

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

בעיה בהטמעה?

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

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

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

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

תודות

התכונה 'טריגרים של התראות' הוטמעה על ידי Richard Knoll, וההסבר נכתב על ידי Peter Beverloo, עם תרומות של Richard. האנשים הבאים בדקו את המאמר: Joe Medley, ‏ Pete LePage, וגם Richard ו-Peter.