首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >为什么与rel=的链接总是在一个新的选项卡中打开?

为什么与rel=的链接总是在一个新的选项卡中打开?
EN

Stack Overflow用户
提问于 2019-12-12 09:52:54
回答 1查看 3.6K关注 0票数 0

我们有一个网站与多个链接到一个网络应用程序。预期的行为是,在任何链接上的第一次单击都应该在一个新的选项卡中打开web应用程序,任何后续的单击都应该在相同的新选项卡中打开web应用程序。

我们这样做是因为我们的用户只想同时打开web应用程序的一个实例。

这适用于将target属性添加到链接中:

代码语言:javascript
复制
<a https://example.com" target="webapp-tab">Link 1</a>
<a https://example.com" target="webapp-tab">Link 2</a>

但是我们的CMS会自动将rel="noopener noreferrer"添加到所有链接中,所以链接将如下所示:

代码语言:javascript
复制
<a https://example.com" target="webapp-tab" rel="noopener noreferrer">Link 1</a>
<a https://example.com" target="webapp-tab" rel="noopener noreferrer">Link 2</a>

问题是,这改变了行为。每次点击任何链接,现在都会打开一个新的选项卡。

行为改变有什么具体原因吗?根据我的理解,区别只应该是没有引用者和开放者信息将与请求一起发送,但是为什么它在一个新的选项卡中打开呢?

即使将rel="noopener noreferrer"添加到链接中,我也能做些什么来保持原始行为吗?

EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2019-12-12 10:04:45

,但是为什么它会在一个新标签中打开呢?

似乎是这样规定的,https://developer.mozilla.org/en-US/docs/Web/HTML/Link_types说:

注意,当使用noopener时,_top_self_parent以外的非空目标名称在决定是否打开新窗口/选项卡时都被视为_blank

我的猜测--应用程序本身指定了一个不同的选项卡名--可能有人担心某些不应该泄漏的信息仍然会泄漏--例如,如果一个不同的脚本先打开一个带有该名称的选项卡,但没有noopener --那么它可能有一个对该选项卡的引用,并且在用户打开一个显式设置了noopener的链接时,它仍然会使用该引用访问内容。

有什么我可以做的,以保持原来的行为,即使rel=“noreferrer”被添加到链接。

这可能会破坏这个特性最初应该提供的安全性。

但是,您可以尝试在加载文档之后让JS运行它,并让它从这些链接中删除rel属性。从其值中删除noopener部件。

当然,您不会得到这个功能所提供的任何“保护”,但是打开所有在同一个选项卡中的链接应该仍然有效。

编辑:将属性值设置为具有此特定target集的所有链接的空字符串的简单方法是

代码语言:javascript
复制
document.querySelectorAll('[target="webapp-tab"]').forEach(function(e) { e.rel = ''; } )

(当然,请确保在加载了文档之后执行该操作。)

票数 1
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/59301834

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档