我们有一个网站，其中包含多个指向 Web 应用程序的链接。预期行为是第一次单击任何链接应在新选项卡中打开 Web 应用程序，任何后续单击都应在同一新选项卡中打开 Web 应用程序。
我们这样做是因为我们的用户只希望同时打开一个 Web 应用程序实例。
这适用于将target属性添加到链接：
<a https://example.com" target="webapp-tab">Link 1</a>
<a https://example.com" target="webapp-tab">Link 2</a>
但是我们的 CMS 会自动添加rel="noopener noreferrer"到所有链接中，因此链接将如下所示：
<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"添加到链接中，我能做些什么来保持原始行为。
但为什么它会在新标签页中打开？
似乎是这样指定的，https : //developer.mozilla.org/en-US/docs/Web/HTML/Link_types说：
请注意，当
noopener使用时，除_top,_self和之外的非空目标名称_parent都被视为_blank决定是否打开新窗口/选项卡。
我的猜测 - 使用应用程序本身指定的不同选项卡名称，可能会担心某种不应泄漏的信息可能会泄漏 - 例如，如果不同的脚本首先打开具有该名称的选项卡，但没有noopener-然后它可以引用该选项卡，并在稍后用户打开明确noopener设置的链接时仍使用该引用访问内容。
即使将 rel="noopener noreferrer" 添加到链接中，我还能做些什么来保持原始行为。
这可能会破坏此功能最初应该提供的安全性。
您可以尝试在加载文档后让 JS 运行在您的文档上，并让它rel从这些链接中删除属性，分别是。noopener从其值中删除该部分。
那么您当然不会获得此功能提供的任何“保护”，但是在同一个选项卡中打开所有链接应该仍然有效。
编辑：将具有此特定target设置的所有链接的属性值设置为空字符串的简单方法是
document.querySelectorAll('[target="webapp-tab"]').forEach(function(e) { e.rel = ''; } )
（当然，请确保在文档加载后执行该操作。）
本文收集自互联网，转载请注明来源。
如有侵权，请联系 [email protected] 删除。
我来说两句