Pemicu Notifikasi memungkinkan Anda menjadwalkan notifikasi lokal yang tidak memerlukan koneksi jaringan, sehingga cocok untuk kasus penggunaan seperti aplikasi kalender.
Apa yang dimaksud dengan Pemicu Notifikasi?
Developer web dapat menampilkan notifikasi menggunakan Web Notifications API. Fitur ini sering digunakan dengan Push API untuk memberi tahu pengguna tentang informasi yang sensitif terhadap waktu, seperti peristiwa berita terbaru atau pesan yang diterima. Notifikasi ditampilkan dengan menjalankan JavaScript di perangkat pengguna.
Masalah dengan Push API adalah tidak dapat diandalkan untuk memicu notifikasi yang harus ditampilkan saat kondisi tertentu, seperti waktu atau lokasi, terpenuhi. Contoh kondisi berbasis waktu adalah notifikasi kalender yang mengingatkan Anda tentang rapat penting dengan bos pada pukul 14.00. Contoh kondisi berbasis lokasi adalah notifikasi yang mengingatkan Anda untuk membeli susu saat Anda memasuki sekitar toko bahan makanan. Konektivitas jaringan atau fitur menghemat baterai seperti mode istirahat dapat menunda pengiriman notifikasi berbasis push.
Pemicu notifikasi mengatasi masalah ini dengan memungkinkan Anda menjadwalkan notifikasi dengan kondisi pemicunya terlebih dahulu, sehingga sistem operasi akan mengirimkan notifikasi di waktu yang tepat meskipun tidak ada konektivitas jaringan atau perangkat dalam mode penghemat baterai.
Kasus penggunaan
Aplikasi kalender dapat menggunakan pemicu notifikasi berbasis waktu untuk mengingatkan pengguna tentang rapat mendatang. Skema notifikasi default untuk aplikasi kalender dapat berupa menampilkan notifikasi pemberitahuan pertama satu jam sebelum rapat, lalu notifikasi lain yang lebih mendesak lima menit sebelumnya.
Jaringan TV mungkin mengingatkan pengguna bahwa acara TV favorit mereka akan segera dimulai atau live stream konferensi akan segera dimulai.
Situs konversi zona waktu dapat menggunakan pemicu notifikasi berbasis waktu untuk memungkinkan pengguna menjadwalkan alarm untuk konferensi telepon atau panggilan video.
Status saat ini
Langkah | Status |
---|---|
1. Membuat penjelasan | Selesai |
2. Membuat draf awal spesifikasi | Belum dimulai |
3. Kumpulkan masukan dan lakukan iterasi pada desain. | Dalam proses |
4. Uji coba origin | Selesai |
5. Luncurkan | Belum dimulai |
Cara menggunakan pemicu notifikasi
Mengaktifkan melalui about://flags
Untuk bereksperimen dengan Notification Triggers API secara lokal, tanpa token uji coba origin, aktifkan
tanda #enable-experimental-web-platform-features
di about://flags
.
Deteksi fitur
Anda dapat mengetahui apakah browser mendukung Pemicu Notifikasi dengan memeriksa keberadaan
properti showTrigger
:
if ('showTrigger' in Notification.prototype) {
/* Notification Triggers supported */
}
Menjadwalkan notifikasi
Menjadwalkan notifikasi mirip dengan menampilkan notifikasi push biasa, kecuali bahwa Anda harus meneruskan properti kondisi showTrigger
dengan objek TimestampTrigger
sebagai nilai ke objek options
notifikasi.
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),
});
};
Membatalkan notifikasi terjadwal
Untuk membatalkan notifikasi terjadwal, minta daftar semua notifikasi yang cocok dengan tag
tertentu melalui ServiceWorkerRegistration.getNotifications()
terlebih dahulu. Perhatikan bahwa Anda harus meneruskan flag includeTriggered
agar notifikasi terjadwal disertakan dalam daftar:
const cancelScheduledNotification = async (tag) => {
const registration = await navigator.serviceWorker.getRegistration();
const notifications = await registration.getNotifications({
tag: tag,
includeTriggered: true,
});
notifications.forEach((notification) => notification.close());
};
Proses Debug
Anda dapat menggunakan Panel Notifikasi Chrome DevTools untuk men-debug notifikasi. Untuk memulai proses debug, tekan Mulai rekam peristiwa atau Control+E (Command+E di Mac). Chrome DevTools merekam semua peristiwa notifikasi, termasuk notifikasi terjadwal, ditampilkan, dan ditutup, selama tiga hari, bahkan saat DevTools ditutup.
Demo
Anda dapat melihat cara kerja Pemicu Notifikasi di demo, yang memungkinkan Anda menjadwalkan notifikasi, mencantumkan notifikasi terjadwal, dan membatalkannya. Kode sumber tersedia di Glitch.
Keamanan dan izin
Tim Chrome telah mendesain dan menerapkan Notification Triggers API menggunakan prinsip inti yang ditentukan dalam Mengontrol Akses ke Fitur Platform Web yang Andal, termasuk kontrol pengguna, transparansi, dan ergonomi. Karena memerlukan pekerja layanan, API ini juga memerlukan konteks yang aman. Penggunaan API memerlukan izin yang sama dengan notifikasi push reguler.
Kontrol pengguna
API ini hanya tersedia dalam konteks ServiceWorkerRegistration
. Hal ini menyiratkan bahwa semua
data yang diperlukan disimpan dalam konteks yang sama dan otomatis dihapus saat pekerja layanan
dihapus atau pengguna menghapus semua data situs untuk origin. Memblokir cookie juga akan mencegah pekerja layanan diinstal di Chrome, sehingga API ini tidak dapat digunakan. Notifikasi dapat
selalu dinonaktifkan oleh pengguna untuk situs di setelan situs.
Transparansi
Tidak seperti Push API, API ini tidak bergantung pada jaringan, yang menyiratkan bahwa notifikasi terjadwal
memerlukan semua data yang diperlukan terlebih dahulu, termasuk resource gambar yang direferensikan oleh atribut badge
, icon
, dan
image
. Artinya, menampilkan notifikasi terjadwal tidak dapat diamati oleh developer
dan tidak melibatkan pengaktifan pekerja layanan hingga pengguna berinteraksi dengan notifikasi.
Akibatnya, saat ini tidak ada cara yang diketahui bagi developer untuk mendapatkan informasi tentang pengguna
melalui pendekatan yang berpotensi melanggar privasi seperti pencarian geolokasi alamat IP. Desain ini juga
memungkinkan fitur ini secara opsional memanfaatkan mekanisme penjadwalan yang disediakan oleh sistem operasi
seperti AlarmManager
Android,
yang membantu menghemat baterai.
Masukan
Tim Chrome ingin mengetahui pengalaman Anda dengan Pemicu Notifikasi.
Ceritakan kepada kami tentang desain API
Apakah ada sesuatu tentang API yang tidak berfungsi seperti yang Anda harapkan? Atau apakah ada metode atau properti yang tidak ada yang Anda perlukan untuk menerapkan ide Anda? Ada pertanyaan atau komentar tentang model keamanan? Ajukan masalah spesifikasi di repo GitHub Pemicu Notifikasi, atau tambahkan pendapat Anda ke masalah yang ada.
Mengalami masalah dengan penerapan?
Apakah Anda menemukan bug pada implementasi Chrome? Atau apakah implementasinya berbeda dengan spesifikasi?
Ajukan bug di new.crbug.com. Pastikan untuk menyertakan detail sebanyak mungkin,
petunjuk sederhana untuk mereproduksi, dan tetapkan Komponen ke UI>Notifications
. Glitch sangat cocok untuk membagikan reproduksi bug dengan cepat dan mudah.
Berencana untuk menggunakan API?
Berencana untuk menggunakan Pemicu Notifikasi di situs Anda? Dukungan publik Anda membantu kami memprioritaskan
fitur dan menunjukkan kepada vendor browser lain betapa pentingnya mendukung fitur tersebut. Kirim tweet ke
@ChromiumDev menggunakan hashtag
#NotificationTriggers
dan beri tahu kami tempat dan cara Anda menggunakannya.
Tautan Bermanfaat
- Penjelasan publik
- Demo Pemicu Notifikasi | Sumber demo Pemicu Notifikasi
- Melacak bug
- Entri ChromeStatus.com
- Komponen Kedipan:
UI>Notifications
Ucapan terima kasih
Pemicu Notifikasi diimplementasikan oleh Richard Knoll dan penjelasan ditulis oleh Peter Beverloo, dengan kontribusi dari Richard. Orang-orang berikut telah meninjau artikel ini: Joe Medley, Pete LePage, serta Richard dan Peter. Banner besar oleh Lukas Blazek di Unsplash.