我有一系列链接,我想在新窗口中打开它们。打开窗口并单击新链接后,它应该使用新的 url 重新加载窗口。
通过为一系列网站的 window.open 提供指定的目标(名称),它可以正常工作,但不知何故,在打开 google 搜索页面后,它会打开另一个窗口。
当我单击Open w3school
,然后Open React
时,行为符合预期。如果我点击打开谷歌搜索
,然后另一个链接会在新窗口中弹出。
重新创建的步骤:
- 点击
打开 w3school
打开一个新窗口(预期) - 点击
Open React
在打开的窗口中重新加载页面(预期) - 点击
打开 Google 搜索
会在打开的窗口中重新加载页面(预期) - 点击
打开 w3school
打开一个新窗口(无意)
下面的代码说明了这个问题。
有人对这种行为有解释吗?
<html>
<body>
<p>Click the button to open a new browser window.</p>
<button onclick="openW3school()">Open w3school</button>
<button onclick="openGoogleSearch()">Open google search</button>
<button onclick="openReact()">Open React</button>
<script>
function openW3school() {
window.open("https://www.w3schools.com", "mywindow", "popup");
}
function openGoogleSearch() {
window.open("https://www.google.com/search?q=javascript", "mywindow", "popup");
}
function openReact() {
window.open("https://reactjs.org/", "mywindow", "popup");
}
</script>
</body>
</html>
最佳答案
很可能是因为 Google 搜索结果页面是通过发送的
cross-origin-opener-policy: same-origin-allow-popups; report-to="gws"
HTTP header (而示例中的其他两个页面不是),大概告诉浏览器“如果它们位于不同的域(来源),则阻止与开启者的联系”。
根据Cross-Origin-Opener-Policy MDN page它应该具有您为 Google Chrome 描述的效果:
If a cross-origin document with COOP is opened in a new window, the opening document will not have a reference to it, and the window.opener property of the new window will be null.
奇怪的是,Firefox 似乎并不尊重这一点,尽管它在那里显示为兼容。
关于javascript - window.open 名称 - google 'search results' 页面的行为不同,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/75373293/