我已经为我的JS应用程序做了一个简单的服务工作者,以推迟失败的请求(遵循此示例),它运行得很好。
但是当请求成功时,我仍然有一个问题:请求会被执行两次。一次正常,一次是由于
以下是代码:
如何做得好?
编辑:
我认为我不必重新执行 fetch() 请求(因为这是第二个请求的原因),也不用等待触发fetchEvent的初始请求的响应,但我不知道如何做。fetchEvent似乎没有等待(和读取)响应的方法。
我走对了吗?如何知道触发fetchEvent的请求何时有响应?
fetch()
调用而由服务工作者执行的。
这是一个真正的问题,因为当客户端想要保存数据时,它们将被保存两次...以下是代码:
const queue = new workbox.backgroundSync.Queue('deferredRequestsQueue');
const requestsToDefer = [
{ urlPattern: /\/sf\/observation$/, method: 'POST' }
]
function isRequestAllowedToBeDeferred (request) {
for (let i = 0; i < requestsToDefer.length; i++) {
if (request.method && request.method.toLowerCase() === requestsToDefer[i].method.toLowerCase()
&& requestsToDefer[i].urlPattern.test(request.url)) {
return true
}
}
return false
}
self.addEventListener('fetch', (event) => {
if (isRequestAllowedToBeDeferred(event.request)) {
const requestClone = event.request.clone()
const promiseChain = fetch(requestClone)
.catch((err) => {
console.log(`Request added to queue: ${event.request.url}`)
queue.addRequest(event.request)
event.respondWith(new Response({ deferred: true, request: requestClone }))
})
event.waitUntil(promiseChain)
}
})
编辑:
我认为我不必重新执行 fetch() 请求(因为这是第二个请求的原因),也不用等待触发fetchEvent的初始请求的响应,但我不知道如何做。fetchEvent似乎没有等待(和读取)响应的方法。
我走对了吗?如何知道触发fetchEvent的请求何时有响应?