问题标签 [background-sync]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
1 回答
178 浏览

workbox - 如何在 workbox-config.js 中为 POST 操作配置 runtimeCaching

我正在工作箱中为“POST”操作进行后台队列配置。请指导我在 workbox-config.js 中的“runtimeCaching”配置中为“POST”操作提供选项的位置

上面的代码在 dist/sw.js 中为“GET”生成默认配置。

请指导如何为“POST”操作生成相同的配置。

0 投票
1 回答
265 浏览

service-worker - 重新联机时后台同步不刷新页面

最近我开始学习服务工作者,后台同步......我实现了服务工作者并在安装步骤中缓存了一些我想在离线时显示的文件。

当没有互联网连接时,我正在收听获取事件以捕获,因此我可以在那时显示离线页面。

我还添加了后台同步,所以当有互联网连接时我可以重新上线。

注册服务人员后,我添加了:

我在我的服务人员中收听同步事件。

当我离线并重新在线时,没有任何反应。但是当我删除我的 fetch 事件(不显示以前缓存的离线页面)时,页面会自行恢复在线(当我有 fetch 事件时我想这样做)

有谁知道我应该添加什么,以便我的页面可以自行重新上线?

0 投票
1 回答
218 浏览

django - 发布到 Django 表单的时间比使用 Service Worker 后台同步生成的时间晚得多:CSRF 问题

我有一个 Django 表单,可以通过服务人员离线使用。如果用户离线完成表单,提交的数据将存储在 IndexedDB 中,然后注册后台同步;当浏览器重新上线时,该sync事件在 service worker 中触发,然后它可以从 IndexedDB 读取数据并通过fetch().

但是,我打开了 Django 的 CSRF 保护。这要求我提交带有合法 CSRF 令牌的表单,该令牌存储在 cookie 中,而且还包含在表单的正文中(或者更好的是在X-CSRFToken标头中)以及fetch()请求的一部分。不幸的是,因为这发生在服务工作者中,我无法读取 cookie 来获取 CSRF 令牌。有一个建议允许服务人员读取 cookie,但它尚未完成并且当前已暂停,因此不可用。

我考虑过使用postMessage从服务人员到主页来要求该主页读取 cookie 并将其发送回,但后台同步可能会在没有主页的时候运行postMessage

可以存储在服务工作者生成和缓存表单时有效的 CSRF 令牌,但我不知道 CSRF 令牌的有效期有多长,或者 Django 对其进行了哪些验证。

有没有明智的方法来解决这个问题?显然我不想禁用 CSRF 保护。

0 投票
2 回答
304 浏览

angular - workbox.backgroundSync.Plugin 不创建 IndexedDB

我已将我的 Angular 应用程序转换为 PWA。Angular 服务工作者完成它的工作并缓存静态资源,以便在离线时加载应用程序外壳。

现在,我还想缓存 POST 请求,这些请求将在设备重新上线后立即发送。不幸的是,Angular Service Worker 不支持 GET 和 HEAD 以外的 HTTP 方法。因此,我使用的是 Google 的工作箱库。

按照官方的“基本用法”片段 [1],我使用了 workbox.backgroundSync.Plugin() 并定义了要缓存的路由:

sw.js:

跟踪服务.ts:

Workbox 已加载,但在离线时执行 POST 请求时,不会创建 IndexedDB。使用 Fetch API 而不是 Angular HTTP 客户端也不起作用。

[1] https://developers.google.com/web/tools/workbox/modules/workbox-background-sync

0 投票
0 回答
111 浏览

javascript - 具有后台同步的 PWA,当互联网可用时,如何处理在向服务器发出请求时出现的错误?

我正在学习 PWA(渐进式 Web 应用程序)。我正在使用后台同步进行离线操作和操作。因此,当互联网恢复时,服务人员对服务器执行该操作。

我的问题是如何处理我们在反向同步服务器请求时遇到的错误。处理这种情况的最佳方法是什么?

0 投票
1 回答
167 浏览

javascript - 如何验证浏览器是否支持后台同步?

我正在开发一个应用程序,它使用服务工作者来缓存来自特定端点的 HTTP 请求。这些请求应该使用后台同步发送到服务器。我知道某些浏览器不受支持,但我想警告我的用户此功能将不可用。为此,我需要某种方式来确定浏览器是否支持后台同步。

0 投票
1 回答
533 浏览

javascript - 如果设置 onSync 回调,Workbox 后台同步不会运行

在我的服务人员中,我正在像这样实现与工作箱的后台同步

当我通过禁用网络访问、执行请求然后重新打开网络访问来测试行为时,我看到了在 中触发的通知showNotification,但我没有看到实际的请求。

奇怪的是,当我删除onSync回调时,我现在看到了请求,但显然,我没有创建任何通知。如何获得回调重播实际请求?

0 投票
1 回答
687 浏览

service-worker - 如何检测客户端是否有来自 Service Worker 的后台同步支持?

如何检测用户的浏览器是否在 service worker 中支持后台同步?

我知道如何在应用程序端检测到这一点,但不是从服务人员本身。

基本上我正在使用 Workbox 的后台同步,它在 Chrome 和 Chrome Mobile 中运行良好。

我知道 Workbox 对不支持后台同步的浏览器有一个后台同步“回退”,但这不是很好,所以我宁愿完全禁用不支持后台同步的浏览器。

这是我的服务工作者文件供参考。你可以看到如果浏览器不支持后台同步,我不想执行 3 块代码我用 标记了这些代码*** I ONLY WANT TO RUN THIS CODE IF BACKGROUND SYNC IS SUPPORTED ***):

0 投票
0 回答
35 浏览

api - websockets 可以替代 HTTP 吗?

我开始将 WebSockets 集成到我的应用程序中以进行实时更新,这让我想知道是否应该完全消除应用程序中的 HTTP 请求。

到目前为止,我发现的缺点是:

  1. 将来更难将我的后端拆分为微服务。

  2. 将来更难将 API 公开给第三方软件。

  3. 更难对发布请求执行缓存和后台同步。

我将如何使用 WebSockets 实现这些目标?

另外,通过 WebSockets 接收的数据有多可靠?我可以确定数据是一致的吗?我可以确定我发送的数据得到正确处理吗?通过 WebSockets 发送“GET”请求有意义吗?

当我有一个打开的 WebSocket 时打开额外的 HTTP 请求似乎很浪费,但是在消除 HTTP 时我有很多疑问和问题。

0 投票
1 回答
186 浏览

javascript - 工作箱后台同步 - 访问重放的 API 响应