在 Firefox 中更改 window.location.href 而不关闭 websockets

Posted 2023-02-16

【中文标题】在 Firefox 中更改 window.location.href 而不关闭 websockets

【英文标题】：Change window.location.href in Firefox without closing websockets

【发布时间】：2017-02-20 09:24:54

【问题描述】：

我目前正在尝试使用 javascript 中的以下代码触发文件下载： window.location.href = downloadUrl;

这在 Chrome、IE 和 Edge 中运行良好，但 Firefox 会由于新 URL 而卸载页面，因此会关闭所有打开的 websocket。我知道这是 FF 的一种奇怪的习惯，但有什么我可以使用的解决方法吗？ 它可以与window.open(downloadUrl); 一起使用，并在一定超时后关闭新标签，但我想防止仅仅为了触发下载而打开新标签。

任何帮助将不胜感激，谢谢。

【参考方案1】：

经过大量研究和实验，我找到了以下解决方案：

使用下载属性在 JavaScript 中创建一个链接，单击它并在一段时间后将其删除（我使用的是 ExtJs）：

var a = document.createElement("a");
document.body.appendChild(a);
a.style = 'display: none';
a.href = downloadUrl;
a.download = 'test.zip';
a.click();

Ext.defer(function(link) 
    document.body.removeChild(link);
, 200, this, [a]);

【讨论】：

解决方案对我不起作用，websocket 仍然像以前一样关闭。我测试了window.open( uri ).close();，但这在 Opera 中不起作用，因为它还会关闭询问在哪个应用程序中打开链接的提示。

我刚刚在我的软件中尝试了提供的解决方案，使用临时链接下载文件并保持 WebSockets 打开仍然可以正常工作（在 Firefox 中）。 Firefox 还会打开一个提示，询问在下载文件时要在哪个应用程序中打开链接，但该提示不会关闭 websocket。

我不熟悉 ExtJs，但我猜它在这个解决方案中没有任何作用。使用 FireFox (68.0.2)，我收到提示，询问在哪个应用程序中打开 uri（我使用的是 lightning://...，但也使用 tg:// 进行了测试），但是在 Websocket 断开连接后一两帧信息。除了您认为可能缺少的已发布代码之外，是否还有其他内容？我什至通过将链接添加到我的html 作为<a href="lightning://testlink" download="NOTHING.txt">LINK</a> 与相同的 Websocket 关闭问题进行了尝试。

我目前的解决方案是检查浏览器是否为 FireFox if (/Firefox[\/\s](\d+\.\d+)/.test(navigator.userAgent)) //code 并通过 window.open( url ) 打开链接 对解决方案不太满意，但它在我的测试中有效。

【参考方案2】：

偶然发现了这个问题。当用户单击链接（包括“下载”链接）时，浏览器认为他正在离开当前页面并关闭 websocket（这可能是合理的）。通过 Javascript onclick 事件（或 window.open 等）打开链接无济于事。设置 target="_blank" 会有所帮助，但会在单击时产生不舒服的眨眼。最后我想出了以下几点：

<iframe src="about:blank" name="iframe_a" class="ws_keep_conn"></iframe>
<a href="https://www.fileserver.com/file.xml" target="iframe_a">Click this</a>

CSS

.ws_keep_conn position: absolute; left: -9999px; visibility: hidden;

就是这样，websocket 生活，流畅的行为，没有眨眼！