DeepL(和许多其他网站)可以在第一次运行时在单独的选项卡/窗口上打开,但在后续运行时在相同的单独选项卡/窗口上打开.这就是目标

window.open("https://www.deepl.com/translator", "sameD");

Google Translator不能,它总是在后续运行时在新选项卡中打开,即使窗口名称相同

window.open("https://translate.google.com", 'sameG');

为什么谷歌翻译并没有在同一个标签中打开,它是否明确禁止它?它是如何做到的?

或者窗口中是否有其他参数.打开以确保url可以在同一个单独的选项卡/窗口中打开?

推荐答案

不是一个解决方案,而是对你所经历的事情的解释:

你已经知道了

window.open("https://translate.google.com", 'sameG');

将打开一个名为sameG的新窗口/选项卡.呼叫也将为return a proxy to the window object of that page.

此外,这将在新窗口中将window.opener设置为调用窗口window的代理.

通常用相同的窗口名再次调用window.open()将更新之前打开的窗口,以导航到新的URL——正如您在deepl.com示例中看到的那样.

但是translate.google.com发送一个

Cross-Origin-Opener-Policy: same-origin-allow-popups

标题!This header实际上是一个浏览器安全标头,它隔离了新窗口的浏览器上下文,即返回值window.open()不会让您访问新打开的窗口,其中window.opener设置为null.

此外,这将丢失对窗口名称sameG的引用,因此对window.open()的后续调用将再次打开一个新窗口,而不是更新已打开的窗口.

TL;DR:Cross-Origin-Opener-Policy是原因.

Javascript相关问答推荐

如何在不指定宽度和高度的情况下显示来自网址的下一张图像

事件错误:类型错误:无法读取未定义的属性(读取stopPropagation)

为什么在react js中没有调用加载器函数?

添加/删除时React图像上传重新渲染上传的图像

MongoDB中的引用

JQuery. show()工作,但. hide()不工作

Phaser 3 console. log()特定游戏角色的瓷砖属性

如何在Obsidian dataview中创建进度条

colored颜色 检测JS,平均图像 colored颜色 检测JS

使用Java脚本根据按下的按钮更改S文本

如何将innerHTML字符串修剪为其中的特定元素?

环境值在.js文件/Next.js中不起作用

如何在不影响隐式类型的情况下将类型分配给对象?

在使用REACT更改了CSS类之后,无法更改CSS样式

如何将zoom 变换应用到我的d3力有向图?

将对象推送到数组会导致复制

无法重定向到Next.js中的动态URL

MongoDB中的嵌套搜索

在JavaScript中将Base64转换为JSON

P5play SecurityError:无法从';窗口';读取命名属性';Add';:阻止具有源的帧访问跨源帧