בתחילת 2015 השקנו את התכונות 'הודעות דחיפה' ו'התראות' ב-Chrome ל-Android ולמחשב. זה היה צעד משמעותי קדימה באינטרנט. המשתמשים יכלו להתחיל להתנסות בצורה מעמיקה יותר בחוויית השימוש באינטרנט גם כשהדפדפן היה סגור.
נהדר שאפשר לשלוח את ההודעות האלה, אבל הדבר היחיד שאפשר לעשות עם אחת מהן הוא ללחוץ עליה ולפתוח דף או לסגור אותה לגמרי.
אם תבחנו את ההתראות שמוצגות באופן מקורי באפליקציות בפלטפורמות לנייד כמו iOS ו-Android, תראו שבכל אחת מהן המפתח יכול להגדיר פעולות לפי הקשר שהמשתמש יכול להפעיל ולנהל איתן אינטראקציה. ב-Chrome 48 הוספנו יכולת דומה להתראות אינטרנט במחשב וב-Chrome ל-Android.
ההוספה ל-API היא די פשוטה. פשוט יוצרים מערך של פעולות ומוסיפים אותן לאובייקט NotificationOptions כשקוראים ל-showNotification מרישום של ServiceWorker (באופן ישיר ב-ServiceWorker או בדף דרך navigator.serviceWorker.ready).
נכון לעכשיו, ב-Chrome אפשר לבצע רק שתי פעולות בכל התראה.
יכול להיות שחלק מהפלטפורמות תומכות בפורמטים נוספים, וחלק מהפלטפורמות תומכות בפחות פורמטים או לא תומכות בכלל. אפשר לבדוק את התמיכה בפלטפורמה ב-Notification.maxActions. בדוגמאות הבאות נניח שהפלטפורמה תומכת בשתי פעולות.
self.registration.showNotification('New message from Alice', {
actions: [
{action: 'like', title: 'Like'},
{action: 'reply', title: 'Reply'}]
});
כך תיווצר התראה פשוטה עם שני לחצנים. לתשומת ליבכם: אי אפשר להוסיף סמלים ישירות לפעולה (עדיין), אבל אפשר להשתמש בסמלי Emote ובקבוצת התווים המורחבת של Unicode כדי להוסיף הקשר נוסף ללחצני ההתראות.
לדוגמה:
self.registration.showNotification("New message from Alice", {
actions: [
{action: 'like', title: '👍Like'},
{action: 'reply', title: '⤻ Reply'}]
});
עכשיו, אחרי שיצרתם התראה והפכתם אותה ל😻, יכול להיות שהמשתמש יתקשר עם ההתראה מתישהו בעתיד. כל האינטראקציות עם ההתראה (נכון ל-Chrome 48) מתבצעות דרך האירוע notificationclick שמירת ב-service worker, והן יכולות להיות לחיצה כללית על ההתראה או הקשה ספציפית על אחד מכפתורי הפעולה. הערה: בעתיד תוכלו גם להשיב לnotificationcloseevent.
כדי להבין איזו פעולה המשתמש ביצע, צריך לבדוק את המאפיין action באירוע. לאחר מכן, תוכלו לבחור אם לפתוח דף חדש כדי שהמשתמש יוכל להשלים פעולה או לבצע את המשימה ברקע.
self.addEventListener('notificationclick', function(event) {
var messageId = event.notification.data;
event.notification.close();
if (event.action === 'like') {
silentlyLikeItem();
}
else if (event.action === 'reply') {
clients.openWindow("/messages?reply=" + messageId);
}
else {
clients.openWindow("/messages?reply=" + messageId);
}
}, false);
העניין המעניין הוא שהפעולות לא חייבות לפתוח חלון חדש, הן יכולות לבצע אינטראקציות כלליות באפליקציה בלי ליצור ממשק משתמש. לדוגמה, משתמש יכול להביע 'לייק' או 'מחיקה' לפרסום ברשתות החברתיות, והפעולה תתבצע בנתונים המקומיים של המשתמש ולאחר מכן תתבצע סנכרון עם הענן בלי לפתוח ממשק משתמש (למרות שמומלץ לשלוח הודעה על שינוי הנתונים לכל החלונות הפתוחים כדי לעדכן את ממשק המשתמש). אם מדובר בפעולה שדורשת אינטראקציה של המשתמש, צריך לפתוח חלון כדי שהמשתמש יוכל להשיב.
הפלטפורמות לא תומכות באותו מספר פעולות, ובמקרים מסוימים הן לא תומכות בלחצני פעולה של התראות בכלל. לכן, תמיד צריך לספק חלופה הגיונית למשימות שהמשתמשים צפויים לבצע אם הם ילחצו על ההתראה.
כדי לראות את התכונה הזו בפעולה כבר היום, אפשר לעיין בהדוגמה של Peter Beverloo לבדיקה של התראות ולקרוא את המפרט של ההתראות או לעקוב אחרי המפרט בזמן שהוא מתעדכן.