Gửi thông báo kịp thời và hữu ích cho người dùng.
Thông báo đẩy đã được chuẩn hoá vào năm 2016 bằng việc phát hành API đẩy và API thông báo. Đây là một phần của Nhóm công tác ứng dụng web của W3C. Các API này cung cấp chức năng cần thiết cho các nhà phát triển web để tích hợp thông báo đẩy vào ứng dụng web cũng như giúp người dùng nhận và tương tác với thông báo trên trình duyệt web của họ. Thông báo đẩy là thông báo được gửi đến trình duyệt web của người dùng từ một trang web hoặc ứng dụng mà trước đó người dùng đã cấp quyền gửi thông báo. Những thông báo này có thể được dùng để thông báo cho người dùng về nội dung hoặc thông tin cập nhật mới, nhắc họ về các sự kiện hoặc thời hạn sắp tới hoặc cung cấp thông tin quan trọng khác. Thông báo đẩy có thể đặc biệt hữu ích cho các ứng dụng cần cung cấp thông tin kịp thời và phù hợp cho người dùng (chẳng hạn như ứng dụng tin tức hoặc thể thao) hay các trang web thương mại điện tử muốn gửi thông báo cho người dùng về các ưu đãi hoặc chương trình giảm giá đặc biệt.
Để đăng ký nhận thông báo đẩy, trước tiên, hãy kiểm tra xem trình duyệt của bạn có hỗ trợ thông báo này hay không bằng cách kiểm tra các đối tượng serviceWorker và PushManager trong các đối tượng navigator và window.
Nếu thông báo đẩy được hỗ trợ, hãy sử dụng từ khoá async và await để đăng ký trình chạy dịch vụ và đăng ký nhận thông báo đẩy. Dưới đây là ví dụ về cách bạn có thể thực hiện việc này bằng JavaScript:
// Check if the browser supports push notifications.
if ("serviceWorker" in navigator && "PushManager" in window) {
try {
// Register the service worker.
const swReg = await navigator.serviceWorker.register("/sw.js");
// Subscribe for push notifications.
const pushSubscription = await swReg.pushManager.subscribe({
userVisibleOnly: true
});
// Save the push subscription to the database.
savePushSubscription(pushSubscription);
} catch (error) {
// Handle errors.
console.error("Error subscribing for push notifications.", error);
}
} else {
// Push notifications are not supported by the browser.
console.error("Push notifications are not supported by the browser.");
}
Tài liệu đọc thêm
Một phần của Loạt chương trình tương tác mới