为什么Chrome重定向时会阻止打开新标签页？

Question

我有一个带有特定链接的React应用。当用户单击链接时，它会打开一个新选项卡，还将当前页面重定向到主页。这是我在handleClick函数中所做的：

window.location.href = '/';
const win = window.open('https://google.com', '_blank');
win.focus();

但是，当我这样做时，Chrome会阻止弹出窗口。由于还会发生重定向，因此弹出窗口阻止消息也将消失。但是有趣的是，当我更改订单时，它可以工作，如下所示：

const win = window.open('https://google.com', '_blank');
window.location.href = '/';
win.focus();

知道为什么会这样吗？我浏览了文档，但找不到任何文档。我只是想确保第二种方法一直有效，并且Chrome将来不会停止阻止它。

要快速尝试一下，您可以在Chrome控制台中以两种顺序执行以下两行：

window.location.href = 'https://yahoo.com';
window.open('https://google.com', '_blank');

Answer 1

当您将window.location.href = '/';放在window.open之前时，浏览器已经在加载新的请求页面，并正在卸载当前页面，因此该语句之后的任何脚本语句都可能运行，也可能不会运行。这可能是导致您弹出窗口的原因。

但是在第二种情况下，window.open会像其他任何JS语句一样首先正常运行，然后重定向触发器。