我有一个webapp，它使用一个服务工作者来检测网络何时离线，并提供缓存的离线页面。
我有一个案例：
- 程序在网络连接时启动，并加载 URL https://localhost/my_site
- 用户按下一个按钮，触发抓取调用
- 在此期间，网络断开连接，
- 服务工作进程检测到此状态并返回缓存的脱机页
- JavaScript代码检查响应内容类型，发现它是text/html(而不是应该是应用程序的原始响应(
- JavaScript代码呈现离线页面(通过设置"window.location.href = response.url"(。离线网址 https://localhost/static/offline/offline.html
- 此时，网站的地址栏显示脱机 URL。
我希望用户在重新连接网络后刷新页面(例如按 F5(，以重新加载原始内容。
但是由于地址栏现在显示脱机 URL，因此刷新页面只会一次又一次地重新加载脱机页面。
用户如何返回原始网址：https://localhost/my_site？
谢谢
艾伍纳
编辑：
为什么不将服务工作进程的脱机页面作为本地主机/my_site
这可能发生在不同的页面。您将如何以编程方式更改 response.url？
我尝试使用基于此处的解决方案。
当提取返回时，我检查响应类型。
如果是文本/html，我从响应中加载新页面，然后 用：
window.history.pushState({"html":response.html,"pageTitle":response.pageTitle},"", queryUrl1);
设置网址，但它只更改历史记录中的网址，而不更改当前显示的网址中的网址...
问题是由以下情况引起的：
我的 wep 应用程序是一个单页应用程序 (SPA(，其中 DOM 树通过 ajax 命令在前端更改。
就我而言，等待获取响应的函数需要内容类型应用程序/json。
当服务工作进程检测到网络断开连接时，它会返回内容类型的响应：text/html(脱机页面(。
由于没有响应错误，该函数尝试提取 response.json((，但由于类型是文本而不是 json(由于离线页面( 分析失败并引发错误，文本/HTML 数据(脱机页面(将被忽略。
强制重新加载带有window.location.href = response.url的页面会导致程序加载页面，这会更改地址栏，从而阻止用户在网络重新连接时通过刷新恢复原始页面
解决方案是：
- 检测获取是否由于网络断开连接
而失败，我通过检查if(response.url == "https://localhost/static/offline/offline.html"(
来执行此操作 -
如果是，请使用以下命令替换现有页面的内容：
document.getElementsByTagName("html")[0].innerHTML = dataAsText;这有一个额外的好处，如果我们在另一个页面上发生网络断开连接，一旦网络重新连接，刷新将加载上次访问的页面(保持上次访问的状态(
- 停止使用 window.location.href 加载 offlin 页面。这样做的好处是： 防止重新加载重新加载标题和资源的页面，这会减慢响应速度，并防止更改地址栏中的链接，以便用户只需在网络重新连接时刷新页面即可还原最后一页。