PWA 关闭时发送通知

2023-12-08

我制作了一个 PWA 待办事项列表应用程序(链接到应用程序)使用角度。 我现在计划添加通知,以便在应用程序关闭时可以到达用户。 由于它是一个离线工作的 PWA,我不能依赖推送通知。 提前致谢


你可以利用Web 定期后台同步 API您也可以离线运行此功能,即使应用程序已关闭,它也不需要后端服务器进行推送,因为它由服务工作人员定期触发(我猜至少 24 小时)

在您的项目文件中注册同步事件:

registration.periodicSync.register(constants.periodicBgSyncEventName, {
    minInterval: syncMinInterval,
    networkState: "any",
});

在您的 Service Worker 文件中监听同步并显示 Web 通知:

self.addEventListener("periodicsync", (event) => {
  if (event.tag === constants.periodicBgSyncEventName) {
    self.registration.showNotification("Wake Time !!!", {
      body: `Hi, Good Morning`,
    });
  }
});

注意 - 为了使用此定期同步 API,您需要先安装 PWA。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

PWA 关闭时发送通知 的相关文章

随机推荐

  • 无法解析的日期:“Fri Oct 10 23:11:07 IST 2014”(偏移量 20)

    我创建了这个函数来解析日期 但这给出了异常 Unparseable date Fri Oct 10 23 11 07 IST 2014 at offset 20 请帮助 因为我无法弄清楚这段代码有什么问题 public Date parse
  • 从一个列表列表中减去另一个列表列表

    我想从另一个列表列表的相应元素中减去一个列表列表 例如 a 1 2 3 4 b 1 2 3 0 预期输出为 c 0 0 0 4 仅使用一个列表与另一个列表进行减法很容易 c i j for i j in zip a b 但这不适用于列表和返
  • “User”类型的字段“me”必须具有一系列子字段

    嗨 我正在努力学习GraphQL语言 我有下面的代码片段 Welcome to Launchpad Log in to edit and save pads run queries in GraphiQL on the right Clic
  • iOS:自定义键盘:我想将图像发送到textDocumentProxy(输入控件)

    我正在实现仅包含图像的自定义键盘 并且希望在单击图像时将图像发送到 textDocumentProxy 输入控件 例如 textview 但不能克服它 到目前为止 我能够将文本 字符串发送到输入控件 但不能发送图像 是否可以将图像发送到输入
  • 快速重命名后退导航项

    我正在尝试编辑返回项目在导航控制器中 我有这个场景 导航控制器 gt 表视图控制器 gt TableViewController 在第二个 TableViewController 中 我想将后面的项目重命名为 xxxx to Back 有没
  • Firefox 开发者工具添加新规则?

    我决定尝试一下内置的 Firefox 开发者工具 看起来似乎不错 但是 我无法从 Inspector Rules 找到如何向 CSS 添加新规则 我的意思是 my new rule 不仅仅是默认打开的 element 规则 最终编辑 现在通
  • 是否可以在 HTML5 画布中使用多个图像?

    我正在尝试将 10 张不同的图像加载到画布中 我的计划是最终将这些图像制作成动画 但现在它们似乎正在互相覆盖 这是我的代码 var DrawLetters function for i 0 i lt howManyLetters i thi
  • 将 Sqlite 数据库文件重新嵌入到同一个可执行文件中

    我正在创建 Win Form 应用程序 我正在添加一个空的 Sqlite 数据库文件 其中包含表作为嵌入式数据源 在运行时 我将数据库文件提取到应用程序路径中 并将值插入到该数据库文件的表中 再次关闭应用程序时 我必须将数据库文件更新或替换
  • Powershell:更新 IIS web.config

    需要更新 IIS web config 以通过添加 SSL 来保护 cookie Web Config 当前包含以下代码片段
  • 从 chrome.webRequest.onBeforeSendHeaders 中提取 cookie

    我正在开发一个 Firefox 插件来拦截 HTTP 请求并提取 cookie 我能够从标头中提取 用户代理 但无法提取 cookie 我使用的代码如下 chrome webRequest onBeforeSendHeaders addLi
  • 让 vibrate() 在没有 PhoneGap 的浏览器中工作

    有谁知道如何让 navigator vibrate 之类的东西直接在网站的浏览器中工作 不使用 PhoneGap 和 webview 没有找到任何命令http www w3 org TR vibration 似乎有效 我能找到的只是对使用
  • 使用 jQuery 获取选定复选框的值

    我想循环遍历复选框组 locationthemes 并使用所有选定的值构建一个字符串 因此 当选择复选框 2 和 4 时 结果将是 3 8
  • 如何在后台首次运行/调用 CtrlP - VIM

    打电话时CtrlP第一次它导致构建缓存相当延迟 有没有办法在后台运行它 这样我就可以继续在 vim 中做事情 如果您需要加快索引速度CtrlP 您可以使用aggrep 文件 从索引中排除某些文件夹和文件 并设置缓存位置 为此 请将这些行放入
  • WordPress 管理员 - 需要自定义元检查

    我在 WordPress 管理中添加自定义用户元 并且我希望我的两个自定义字段是必需的 但是如何显示错误并告诉 WordPress 在出现错误时不更新配置文件 add action personal options update sweet
  • 为什么annotation_raster不起作用?

    在文档中 有一个示例显示了使用annotation raster如下 ggplot aes x mpg y wt data mtcars annotation raster red Inf Inf Inf Inf geom point 这工
  • 将 ASP.NET MVC Razor @helper 函数转换为帮助器类的方法

    考虑以下 ASP NET MVC razor 视图片段 它定义了一个帮助器 helper FieldFor
  • 当用户连续键入时,每 500 毫秒执行一次函数不超过一次

    我正在尝试实现类似自动完成的功能 因此我在以下时间运行该函数oninput事件发生 因为我正在发出获取请求 而不是在每次更改时运行它 所以我希望在 也许 500 毫秒内运行它不超过一次 有没有办法做到这一点
  • 多次调用 window.open() 第一次后失败

    我有一个脚本可以循环访问多个网址并在新选项卡中打开它们 以前可以用 但现在只能打开第一个 甚至有一个 w3schools 测试编辑器据说可以打开多个窗口 但在第一个窗口之后它也失败了 https www w3schools com jsre
  • 友好地获取ffmpeg信息

    每次我尝试使用 ffmpeg 获取有关我的视频文件的一些信息时 它都会吐出很多无用的信息和好的信息 我在用着ffmpeg i name of the video mpg 有没有可能以友好的方式得到它 我的意思是 JSON 会很棒 甚至丑陋的
  • PWA 关闭时发送通知

    我制作了一个 PWA 待办事项列表应用程序 链接到应用程序 使用角度 我现在计划添加通知 以便在应用程序关闭时可以到达用户 由于它是一个离线工作的 PWA 我不能依赖推送通知 提前致谢 你可以利用Web 定期后台同步 API您也可以离线运行