相关疑难解决方法(0)

如何在 Safari 10+ 中使用 BroadcastChannel API 或类似的东西?

问题:

我需要一个客户端 Javascript 解决方案(jQuery 很好),其中一个浏览器窗口/选项卡中的事件可以广播到同一域上的其他窗口/选项卡。例如,如果购物车在选项卡 A 中更新,选项卡 B 和 C 会收到通知,因此我们可以更新页面上的一些信息,或通知用户页面已过时,或类似的事情。

我试过的:

广播信API符合我的需要,但在IE 11或Safari不起作用。

所以我尝试了这个 polyfill,这样我就可以在任何地方使用 BroadcastChannel API。它在 IE 中有效,但在 Safari 中无效(我相信 BroadcastChannel 仍未定义)。

然后我尝试了sysend.js,它使用 BroadCastChannel 如果它可用,否则使用localStorage. 他们的演示页面在 Safari 中运行良好,但在我的网站上,我发现它在 Safari 9 中运行,但在 10-12 中不起作用(使用 BrowserStack 和一台运行 Safari 12 的真实 Mac 进行测试)。调试他们的脚本,似乎在不同选项卡中更改时应该触发的存储事件localStorage根本不会触发。但这实际上只是当您document.domain设置时才出现问题,我就是这样做的。

我相信这与这个旧的 Chrome 错误相同。但是 Chrome 在 2012-2017 年就有这个问题,而 Safari 显然是在 2017 年左右引入的?

我还没有发现其他人在 Safari 中讨论这个错误,但我可以很容易地证明这一点。打开两个使用相同document.domain值的选项卡并运行这些脚本:

选项卡 A:

$(window).on("storage", function (e) …
Run Code Online (Sandbox Code Playgroud)

javascript safari local-storage broadcast-channel

12
推荐指数
1
解决办法
8104
查看次数