Window.open忽略高度和宽度，当noopener包含在选项中时

Question

我一直在尝试通过window.open函数指定弹出窗口的宽度和高度。但是，一旦我在选项中包含noopener，Chrome 上的宽度和高度就会被忽略。

这是我使用的代码，https://jsfiddle.net/v0otu1kq/在这种情况下，窗口将以指定的尺寸打开。

但是，一旦我在选项中包含noopener，例如 https://jsfiddle.net/1eqtLsnr/它就会忽略维度集。

document.querySelector('[data-frame]').addEventListener('click', function(e) {
e.preventDefault();
window.open(
'https://facebook.com',
'facebook-window',
'width=600,height=400,scrollbar=yes,noopener' // <-- this
);
});

Answer 1

我深入研究了window.open函数的文档，最终找到了解决方法：

let fbWindow = window.open(
'',
'facebook-window',
'width=600,height=400,scrollbar=yes'
);
fbWindow.opener = null;
fbWindow.location = 'https://facebook.com';

其工作原理如下：

1. 我们创建一个弹出窗口，其中包含所需的属性和空白URL
2. 以编程方式，我们将创建的弹出窗口的属性打开器更改为 null
3. 完成所有操作后，我们将窗口的位置更改为所需的位置(如果我们之前这样做，我们会遇到跨源错误(

PS：请注意，这在JSFiddle上不起作用，因为它是沙盒的。