手动重播由workbox-background-sync排队的请求-Java 学习之路

我正在使用我的PWA应用程序中的离线支持 . 我正在使用workbox . 这是我目前的代码：

const addToFormPlugin = new workbox.backgroundSync.Plugin('addToForm');

workbox.routing.registerRoute(
RegExp('MY_PATH'),
  workbox.strategies.networkOnly({
    plugins: [addToFormPlugin]
  }),
  'POST'
);

代码似乎在我的计算机上正常工作 . 但是，一旦我在手机上运行应用程序，上传存储在IndexedDB中的请求需要很长时间 . 我知道它发生在SYNC上，但似乎需要至少5分钟 . 这不是我需要的 . 我想知道是否有一个选项可以访问IndexDB并在点击时“手动”发送所有请求 . 另一种方法是检查设备是否在线 . 以下是请求的存储方式：

enter image description here

1 回答

1
如果你强制这样做，最干净的方法是直接使用 workbox.backgroundSync.Queue 类（而不是 workbox.backgroundSync.Plugin ） .

为你设置fetchDidFail callback的 Plugin 类takes care，所以如果你使用 Queue 类，你需要自己做：
```
const queue = new workbox.backgroundSync.Queue('addToForm');

workbox.routing.registerRoute(
  RegExp('MY_PATH'),
  workbox.strategies.networkOnly({
    plugins: [{
      fetchDidFail: async ({request}) => {
        await queue.addRequest(request);
      },
    }],
  }),
  'POST'
);
```
然后，您可以调用queue.replayRequests()来触发重放，例如，作为 message 事件的结果：
```
self.addEventListener('message', (event) => {
  if (event.data === 'replayRequests') {
    queue.replayRequests();
  }
});
```
但是......所有人都说，我认为最好的办法就是让浏览器“做自己的事情”并找出合适的时间重播排队的请求 . 这将最终对移动设备更加友好 .

如果您对触发器在触发 sync 事件之前等待的时间间隔不满意，那么最佳操作方法可能是打开浏览器的错误 - 无论是Chrome（如屏幕截图所示）还是其他浏览器 .
回复于 2024-05-03T22:58:26+08:00

手动重播由workbox-background-sync排队的请求

1 回答

相关问题