Skip to content
学习 衡量 博客 Case studies 关于
本页内容
  • Lighthouse 跨源目的地审计如何失败
  • 资源

指向跨源目的地的链接不安全

May 2, 2019 — 更新日期 Aug 28, 2019
Available in: Español, 日本語, 한국어, Русский, English
Appears in: 最佳做法审核
本页内容
  • Lighthouse 跨源目的地审计如何失败
  • 资源

当您使用 target="_blank" 属性链接到另一个网站上的页面时,您的网站可能会面临性能和安全问题:

  • 另一个页面可能与您的页面在同一进程上运行。如果另一个页面运行大量 JavaScript,您的页面的性能可能会受到影响。
  • 另一个页面可以使用 window.opener 属性访问您的 window 对象。这可能允许其他页面将您的页面重定向到恶意 URL。

将 rel="noopener" 或 rel="noreferrer" 添加到您的 target="_blank" 链接避免这些问题。

从 Chromium 88 版开始,默认情况下,带有 target="_blank" 的锚点会自动获得 noopener 行为。rel="noopener" 的显式规范有助于保护旧版浏览器(包括 Edge Legacy 和 Internet Explorer)的用户。

Lighthouse 跨源目的地审计如何失败 #

Lighthouse 标记指向跨源目的地的不安全链接:

显示指向跨源目的地的不安全链接的 Lighthouse 审计

Lighthouse 使用以下过程将链接识别为不安全:

  1. 收集所有包含 target="_blank" 属性但不包含 rel="noopener" 或 rel="noreferrer" 属性的 <a> 标签。
  2. 过滤掉任何同主机链接。

因为 Lighthouse 会过滤掉同主机链接,所以如果您在大型站点上工作,您应该注意一种边缘情况:如果一个页面包含指向您站点上另一个页面的 target="_blank" 链接,而未使用 rel="noopener",此审计对性能的影响仍然适用。 但是,您不会在 Lighthouse 结果中看到这些链接。

Each Best Practices audit is weighted equally in the Lighthouse Best Practices Score. Learn more in The Best Practices score.

如何提高站点性能并防止安全漏洞 #

将 rel="noopener" 或 rel="noreferrer" 添加到 Lighthouse 报告中标识的每个链接。通常,当您使用 target="_blank" 时,请始终添加 rel="noopener" 或 rel="noreferrer" :

<a href="https://examplepetstore.com" target="_blank" rel="noopener">
Example Pet Store
</a>
  • rel="noopener" 阻止新页面访问 window.opener 属性,并确保它在单独的进程中运行。
  • rel="noreferrer" 具有相同的效果,但还会阻止将 Referer 标头发送到新页面。请参阅链接类型“noreferrer” 。

有关更多信息,请参阅安全地共享跨源资源帖文。

资源 #

  • 指向跨源目的地的链接不安全审计源代码
  • 安全地共享跨源资源
  • 面向 Web 开发人员的站点隔离
Last updated: Aug 28, 2019 — Improve article
Return to all articles
分享
订阅

Contribute

  • 提交错误
  • 查看源代码

相关内容

  • developer.chrome.com
  • Chrome 动态
  • 网站开发基础
  • 案例研究
  • 播客
  • 节目

连接

  • Twitter
  • YouTube
  • Google Developers
  • Chrome
  • Firebase
  • Google Cloud Platform
  • 所有产品
  • 条款和隐私权
  • 社区准则

Except as otherwise noted, the content of this page is licensed under the Creative Commons Attribution 4.0 License, and code samples are licensed under the Apache 2.0 License. For details, see the Google Developers Site Policies.