Question

我正在尝试浏览器缓存API机制，但是将要缓存的api使用cookie身份验证。并且正在接收“ unauthorized-401”错误消息。我怀疑当我从cache.add（apiurl）调用时，应该为所有api请求发送的http cookie没有发送。

    new_string = str(list_name)

Answer 1

我找到了解决此问题的方法。不用在add（）方法中添加URL，而是根据您的CORS设置创建一个带有“凭证：包括”或“凭证：same-orgin”的Request对象。

 if ('caches' in window) {
            caches.open('cachename').then(cache => {
                cache.add(new Request('apiurl', {credentials: 'include'}).then(() => {
                    //done!
                })
            });
        }

//或

if ('caches' in window) {
            caches.open('cachename').then(cache => {
                cache.add(new Request('apiurl', {credentials: 'same-origin'}).then(() => {
                    //done!
                })
            });
        }

Answer 2

不建议将 cache.add 与 new Request 一起使用。至少它是对服务器的新请求，并且可以缓存不相关的数据。相反，我建议使用 cache.put + res.clone()

if ('caches' in window) {
  if (navigator.onLine) {
    return fetch(request)
        .then(res => {
            const resClone = res.clone();
            caches.open(KEY).then((cache) => cache.put(request, resClone));

            return res;
        })
        .catch(err => console.error(err));
  }

  // some other logic
}

https://developer.mozilla.org/en-US/docs/Web/API/Service_Worker_API/Using_Service_Workers#recovering_failed_requests

浏览器缓存API不适用于Cookie身份验证的服务

2 个答案: