替换响应中的请求？

【问题标题】：How to cancel/modify/alter/replace a request in respondWith?如何取消/修改/更改/替换响应中的请求？
【发布时间】：2020-02-27 22:42:32
【问题描述】：

我正在使用工作箱并尝试缓存类似这样的请求：

this.serviceWorker.addEventListener('fetch', (event) => {
const request = event.request;
event.respondWith(
      caches.open('cache name')
         .then(cache => cache.match(request))
         .then(async (cachedResponse) => {
            // todo something

如何取消 event.request 并发送我的自定义请求？感谢您的帮助。

【问题讨论】：

标签： service-worker workbox request-cancelling

【解决方案1】：

您可以像这样更改或完全更改发出的请求：

this.serviceWorker.addEventListener('fetch', (event) => {
  const request = event.request;
  return event.respondWith(
    caches.open('cache name')
      .then(cache => cache.match(request))
      .then(async (cachedResponse) => {
        // create a new request, fetchi it, and return the result
        return fetch(new Request(request.url ....))
       })

注意我在第三行代码中添加的return语句:)

更多关于构建新请求的信息：https://stackoverflow.com/a/35421858/5038943

【讨论】：