web-dev-qa-db-ja.com

Window.open with'noopener 'は、新しいタブではなく新しいウィンドウを開きます

window.open('')と_'_blank'_を2番目のパラメーターとして使用して、新しいタブでリンクを開きました。 window.open('http://google.com', '_blank')

しかし、最近、3番目のパラメーター_'noopener'_を追加して、新しいタブで_window.opener_がnullになり、新しいタブが親タブ/ウィンドウにアクセスできないようにしました。つまり、_window.opener_はnullです

window.open('http://google.com', '_blank', 'noopener')

したがって、上記のコードはセキュリティの問題を解決しましたが、新しいタブを開く代わりに、新しいウィンドウが開き始めました。これは私が期待したものではありません。私のブラウザの設定は同じで、変更はありませんでした。

このコードを新しいウィンドウではなく新しいタブで開くためにできることはありますか？ 3番目のパラメータとしてnoopenerを削除したくない

javascriptwindow.openwindow.opener
10
Chirag Swadia

正直なところ、コードは問題ないと思いますが、別の実装を試すことができます。

var yourWindow = window.open();
yourWindow.opener = null;
yourWindow.location = "http://someurl.here";
yourWindow.target = "_blank";
6
Ricardo Costa

これを1行で解決する別のアプローチは、オープナープロパティに直接アクセスし、それをnullに設定して、window.open()がWindowオブジェクトを返すという事実を利用することです。これはすべてのブラウザで機能し、null window.openerで新しいタブを開きます。

window.open(url, '_blank').opener = null;
10
keimjohn

https://mathiasbynens.github.io/rel-noopener/

const anchor = document.createElement('a');

Object.assign(anchor, {
  target: '_blank',
  href: 'http://google.com',
  rel: 'noopener noreferrer'
})
.click()

これは少しすっきりした感じの方法です。アンカータグを作成してクリックします。この回避策をユーザー設定として使用する必要があります。

3
Joe Warner

これは私にとってクロスブラウザ（IE11、Chrome 66、FF 60、Safari 11.1）で動作する唯一のものです

function openURL(url) {
  var link = document.createElement('a');
  link.target = "_blank";
  link.href = url;
  link.rel = "noopener noreferrer";
  document.body.appendChild(link); // you need to add it to the DOM to get FF working
  link.click();
  link.parentNode.removeChild(link); // link.remove(); doesn't work on IE11
};
2
Alberto