即使使用示例代码,PWABuilder 也会记录错误

问题描述

我正在尝试设置 Service Worker 以允许我的 PWA 离线工作。我将 PWABuilder 与“带有备份离线页面的离线副本”策略一起使用。我已按照所有说明进行操作,对任一脚本的唯一更改是确保 Service Worker 脚本中的 URL 指向正确的离线后备页面

当我清除缓存和 Service Worker 然后在最新的稳定版 Chrome for Windows 上加载主页时,我看到几个控制台错误,并且该页面无法脱机工作(尽管它确实在角落)。

The service worker navigation preload request Failed with network error: net::ERR_INTERNET_disCONNECTED.
The FetchEvent for "https://example.com/starturl/" resulted in a network error response: the promise was rejected.
StaleWhileRevalidate.js:136 Uncaught (in promise) no-response: no-response :: [{"url":"https://example.com/starturl/","error":{}}]

我认为让起始 URL 与当前 URL 不同可能会导致问题,因此我尝试将其更改为 /,但我遇到了同样的问题。我尝试在谷歌上搜索错误,但没有找到任何相关内容

当我加载一个页面(也是起始 URL)时,我会收到其他错误

A bad HTTP response code (404) was received when fetching the script.
Uncaught (in promise) TypeError: Failed to register a ServiceWorker for scope ('https://example.com/starturl/') with script ('https://example.com/starturl/pwabuilder-sw.js'): A bad HTTP response code (404) was received when fetching the script.

我可以从该错误中看出它正在尝试从 https://example.com/starturl/pwabuilder-sw.js 而不是 https://example.com/pwabuilder-sw.js 加载 Service Worker 脚本。这对我来说毫无意义,因为说明说明文件应该在根目录下,我什至没有在代码中的任何地方包含该 URL。

通过 Lighthouse 运行我的页面告诉我,我的清单没有任何问题,并且任一页面上都没有任何 JavaScript 干扰服务工作者。我完全不知所措,因为我按原样使用示例代码(除了更改 service worker 中的 URL)。

如果有人知道为什么会这样,我很乐意提供帮助。

解决方法

暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!

如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@)