javascript - 当选项中包含 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 上不起作用，因为它是沙盒的。