缓存匹配在反应中返回未定义

Question

我正在尝试为我的 React 应用创建一个服务工作者，但我只是在玩弄一些东西。当我使用 cache.match 但当我使用 cache.matchAll 时，我得到了未定义的返回给我，我得到了所有的响应对象，但我不确定为什么。我认为这与我缓存的页面中有链接这一事实有关，但我不确定。


    const cacheName = 'v2'
    const cacheFiles = ['http://localhost:3000/index.html']
    
    self.addEventListener('install',(e)=>{
      console.log('installed');
      e.waitUntil(
        caches
        .open(cacheName)
        .then(cache => {
          self.skipWaiting();
          return cache.addAll(cacheFiles);
        })
      )
    
    })
    
    self.addEventListener('activate',(e)=>{
      console.log('activated');
    })
    
    
    
    self.addEventListener('fetch',(e)=>{
      console.log(e.request);
    
      e.waitUntil(
        caches.open(cacheName).then(cache => {
          cache.match(e.request).then(res => {
            console.log('The response',res);
            return test
          })
        })
      )

})

获取请求包括除 index.html 以外的文件，因为它是一个 React 应用程序，并且还请求 bundle.js 之类的文件。

Answer 1

问题是我捕获了一个与请求名称

不匹配的url

缓存匹配在反应中返回未定义

Cache match is returning undefined in react

caching

reactjs

service-worker