在Chrome中使用Service Worker时出现net::ERR_CONNECTION_RESET错误

Question

我有一个非常简单的服务工作者，可添加离线支持。 fetch处理程序如下所示

self.addEventListener("fetch", function (event) {
  var url = event.request.url;
  event.respondWith(fetch(event.request).then(function (response) {
    //var cacheResponse: Response = response.clone();
    //caches.open(CURRENT_CACHES.offline).then((cache: Cache) => {
    //  cache.put(url, cacheResponse).catch(() => {
    //    // ignore error
    //  });
    //});
    return response;
 }).catch(function () {
    // check the cache
    return getCachedContent(event.request);
}));

我们偶尔会在在线加载特定脚本时看到net::ERR_CONNECTION_RESET错误。由于服务工作者从浏览器缓存中获取文件，该错误并非来自服务器。Chrome的网络选项卡显示服务工作者已成功从磁盘缓存中获取了文件，但浏览器对服务工作者的请求显示为（失败）。

有人知道引起此问题的根本原因吗？我的服务工作者实现存在问题吗？

- Doogal

---

我认为这与您的服务工作者无关。您能否确认在隐身窗口中看到相同的行为，该窗口将拥有全新的浏览器缓存和所有扩展都被禁用？ - Jeff Posnick

我在使用隐身模式时遇到了同样的问题。如果我移除服务工作线程，这个问题也会停止出现。这个问题似乎最常发生在慢速网络上的大型脚本文件中（在开发者工具中将网络设置为Slow 3G几乎总是能复现）。我通过解包一些文件并注入脚本标签来重新加载脚本，从而减少了它的影响。 - Doogal

Answer 1

这可能是由于Chrome（以及其他浏览器）中的一个错误导致的，可能会导致垃圾回收事件在仍在读取响应流时删除对其的引用。

该问题在Chrome中的修复正在https://bugs.chromium.org/p/chromium/issues/detail?id=934386上跟踪。

- Jeff Posnick