javascript - 当网站关闭时,推送通知如何在每个浏览器上工作?

标签 javascript google-chrome push-notification safari push

当网站打开或关闭时,我想在每个浏览器的通知中显示网站的最新消息。

我可以知道如何实现该流程吗?我需要使用哪个推送 api?程序是什么?

最佳答案

为了向您的网站添加推送通知,您需要了解使用哪种技术/API 在客户端和服务器之间进行通信,即使浏览器已关闭。 Service Worker API 允许这样做,您需要向您的站点添加一个 Service Worker 才能使推送通知正常工作。

Service workers essentially act as proxy servers that sit between web applications, the browser, and the network (when available). They are intended, among other things, to enable the creation of effective offline experiences, intercept network requests and take appropriate action based on whether the network is available, and update assets residing on the server. They will also allow access to push notifications and background sync APIs.

来源:MDN - Service Worker API

注意:为了让 Service Worker 工作,您的网站需要安全并在 https:// 上运行 对于本地开发,这不是必需的.

运行 Service Worker 后,您需要注册用户以接受推送通知。这允许服务器向客户端发送消息。看看Push Notifications: What are they and how do I send them?以便更好地了解这个过程。

由于这个主题涉及面很广,并且有很多您需要了解的变化部分,我建议您通过教程和文章熟悉 Service Workers 和推送通知。以下是一些我认为有用的免费资源。

Service Workers - an Introduction
Offline Web applications
Service Workers: Push Notifications
Set Up a JavaScript Firebase Cloud Messaging Client App

关于javascript - 当网站关闭时,推送通知如何在每个浏览器上工作?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/51692643/

相关文章:

javascript - 基于分配给它的特定 css 类的另一个 div #id 隐藏带有 css #id 的 div

javascript - Chrome扩展开发: Call a method in popup from background_html

javascript - 从 Chrome 扩展程序访问网站数据

javascript - 在 Chrome 应用程序中重用 UDP 套接字的地址

android - 发送到 Android 设备的额外推送通知

reactjs - 关闭应用程序后如何在React Native中实现推送通知

javascript - 如何添加 'section trail' 作为导航的侧边栏?使用 JS/jquery

javascript - 无法创建多个模态

javascript - JavaScript 文件顶部的 "format register"字符串是什么?

android - onRegistered() 被调用但 onMessage() 没有