service-worker - 绕过 Service-Worker 缓存

Question

我有一个渐进式网络应用程序，它与 API 对话。对此 api 的调用由 service worker 缓存，效果很好。

但是现在，我想添加一个重新加载按钮，理想情况下，它会强制服务人员尝试绕过缓存并在成功时更新它，如果无法建立连接，它也不应该返回缓存的结果。

我有点不确定如何解决这个问题。我正在使用sw-toolbox。

Answer 1

根据您的描述，您正在使用应用程序缓存。可以从独立于 sw 工具箱的应用程序访问它。

  function onReloadButtonClicked(event) {
      //Check for browser cache support
      if ('caches' in window) {
        //Update cache if network query is successful
        caches.open('your_cache_name')
          .then(function(cache) {
            cache.add('your_url');
          }).catch(function(err) {
            // Do something with the error
          });
      }
    }

Answer 2

所有请求都通过接收请求对象的 fetch 回调。因此，在返回缓存响应之前，您可以查找额外的标头参数（您需要将其包含在对 API 的请求中）以跳过返回缓存响应的逻辑。