html的a标签属性rel="noopener"有什么作用？

rel="noopener" 属性是 HTML 中 <a> 标签的一个安全属性，用于防止新打开的页面通过 window.opener 访问原始页面的 window 对象。 这主要用于保护原始页面免受恶意攻击。

具体来说，当你在一个页面上点击一个链接，并且该链接的目标属性设置为 _blank (在新标签页或窗口中打开链接) 时，新打开的页面可以通过 window.opener 访问原始页面的 window 对象。 这意味着新页面可以：

• 修改原始页面的内容： 例如，恶意网站可以替换原始页面的内容，进行网络钓鱼攻击。
• 重定向原始页面： 恶意网站可以将原始页面重定向到另一个网站。
• 窃取原始页面的信息： 如果原始页面包含敏感信息 (例如，登录凭据)，恶意网站可以访问并窃取这些信息。

通过添加 rel="noopener" 属性，你就可以切断新打开的页面与原始页面之间的这种连接，从而防止上述攻击。 当 rel="noopener" 存在时，新打开的页面中的 window.opener 将被设置为 null。

总结:

• 安全性: rel="noopener" 增强了安全性，防止恶意网站通过 window.opener 操纵原始页面。
• 适用场景: 任何使用 target="_blank" 打开外部链接的 <a> 标签都应该添加 rel="noopener" 属性。
• 最佳实践: 为了更全面的保护，建议同时使用 rel="noopener noreferrer"。 rel="noreferrer" 会阻止 Referer 头信息发送到新打开的页面，进一步保护用户的隐私。

示例：

<a href="https://www.example.com" target="_blank" rel="noopener">安全链接</a>
<a href="https://www.example.com" target="_blank" rel="noopener noreferrer">更安全的链接 (推荐)</a>

总而言之，rel="noopener" 是一个简单但重要的安全属性，可以有效地保护你的网站免受潜在的攻击。 强烈建议在所有使用 target="_blank" 的链接中使用它。