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

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. 通过编程，我们将创建的弹出窗口的属性opener更改为 null
3. 一切完成后，我们将窗口的位置更改为所需的位置（如果我们之前这样做，我们会遇到跨域错误）

PS：请注意，这不适用于 JSFiddle，因为它是沙盒的。