2

在尝试为用户构建表单时，我遇到了服务人员 (SW) 的问题。表单需要离线工作，缓存请求直到网络连接恢复。

这是用于创建用户的 API 调用尝试（浏览器控制台）

工作箱路由器正在响应：https://awesomeapi/dev/users

'https://awesomeapi/dev/users' 的工作箱网络请求引发了错误。类型错误：获取失败

“https://awesomeapi/dev/users”的工作箱请求已添加到后台同步队列“usersQueuePost”。

工作箱使用 NetworkOnly 响应“https://awesomeapi/dev/users”

“https://awecomeapi/dev/users”的 FetchEvent 导致网络错误响应：承诺被拒绝。

未捕获（承诺）无响应：该策略无法为“https://awecomeapi/dev/users”生成响应。基础错误是 TypeError: Failed to fetch。
    在 NetworkOnly._handle (http://localhost:9000/sw.js:6604:19)
    在异步 NetworkOnly._getResponse (http://localhost:9000/sw.js:6913:24)

Uncaught (in promise) TypeError: Failed to fetch

POST https://awesomeapi/dev/users net::ERR_FAILED

所以 SW 路由器捕获了一个请求，并选择了策略来处理这个请求。这是此类查询的代码

registerRoute(
  // Check to see if the request is a navigation to a new page
  ({ request }) => request.url.includes("/users"),
  // Use a Network Only caching strategy
  new NetworkOnly({
    // We want to send API requests after network connection is restored
    plugins: [new BackgroundSyncPlugin("usersQueuePost")],
  }),
  // This route is only for user's creation
  "POST"
);

但网络连接恢复后，重放失败，原因不明：

已收到标签“workbox-background-sync:usersQueuePost”的工作箱后台同步

“https://awesomeapi/dev/users”的工作箱请求已添加到后台同步队列“usersQueuePost”。

'https://awesomeapi/dev/users' 的工作箱请求未能重播，将其放回队列'usersQueuePost'

WorkboxError.js：30 未捕获（承诺）队列重播失败：重播后台同步队列“usersQueuePost”失败。
    在 Queue.replayRequests (http://localhost:9000/sw.js:444:23)
    在异步同步完成（http://localhost:9000/sw.js:488:29）

事件被放入适当的队列，几分钟后它们被成功推送回 API。初始重放失败的原因是什么？有时它会发生，但有时 - 不是......

4

0 回答 0