Skip to content
Biome 中文网
开发文档 当前版本 v1.9

noBlankTarget

诊断类别：lint/a11y/noBlankTarget

¥Diagnostic Category: lint/a11y/noBlankTarget

自从：v1.0.0

¥Since: v1.0.0

来源：

¥Sources:

禁止没有 rel="noreferrer" 的 target="_blank" 属性

¥Disallow target="_blank" attribute without rel="noreferrer"

创建锚点 a 元素时，有时必须通过 target="_blank" 属性在新浏览器选项卡中打开其链接。此属性必须与 rel="noreferrer" 配对，否则你将遇到安全问题。

¥When creating anchor a element, there are times when its link has to be opened in a new browser tab via target="_blank" attribute. This attribute has to paired with rel="noreferrer" or you’re incur in a security issue.

参考 noreferrer 文档 和 noopener 文档

¥Refer to the noreferrer documentation and the the noopener documentation

示例

Section titled 示例

¥Examples

无效

Section titled 无效

¥Invalid

<a href='http://external.link' target='_blank'>child</a>
code-block.jsx:1:32 lint/a11y/noBlankTarget  FIXABLE  ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━

  ✖ Avoid using target=“_blank” without rel=“noreferrer”.
  
  > 1 │ <a href=‘http://external.link’ target=’_blank’>child</a>
      │                                ^^^^^^^^^^^^^^^
    2 │ 
  
  ℹ Opening external links in new tabs without rel=“noreferrer” is a security risk. See the explanation for more details.
  
  ℹ Safe fix: Add the rel=“noreferrer” attribute.
  
    1 │ <a·href=‘http://external.link’·target=’_blank’·rel=“noreferrer”>child</a>
      │                                               +++++++++++++++++          
<a href='http://external.link' target='_blank' rel="noopener">child</a>
code-block.jsx:1:32 lint/a11y/noBlankTarget  FIXABLE  ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━

  ✖ Avoid using target=“_blank” without rel=“noreferrer”.
  
  > 1 │ <a href=‘http://external.link’ target=’_blank’ rel=“noopener”>child</a>
      │                                ^^^^^^^^^^^^^^^
    2 │ 
  
  ℹ Opening external links in new tabs without rel=“noreferrer” is a security risk. See the explanation for more details.
  
  ℹ Safe fix: Add the “noreferrer” to the existing attribute.
  
    1 │ <a·href=‘http://external.link’·target=’_blank’·rel=“noreferrer·noopener”>child</a>
      │                                                     +++++++++++                   
<a {...props} href='http://external.link' target='_blank' rel="noopener">child</a>
code-block.jsx:1:43 lint/a11y/noBlankTarget  FIXABLE  ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━

  ✖ Avoid using target=“_blank” without rel=“noreferrer”.
  
  > 1 │ <a {…props} href=‘http://external.link’ target=’_blank’ rel=“noopener”>child</a>
      │                                           ^^^^^^^^^^^^^^^
    2 │ 
  
  ℹ Opening external links in new tabs without rel=“noreferrer” is a security risk. See the explanation for more details.
  
  ℹ Safe fix: Add the “noreferrer” to the existing attribute.
  
    1 │ <a·{…props}·href=‘http://external.link’·target=’_blank’·rel=“noreferrer·noopener”>child</a>
      │                                                                +++++++++++

有效

Section titled 有效

¥Valid

<a href='http://external.link' rel='noreferrer' target='_blank'>child</a>
<a href='http://external.link' target='_blank' rel="noopener" {...props}>child</a>

选项

Section titled 选项

¥Options

选项 allowDomains 允许特定域使用 target="_blank" 而不使用 rel="noreferrer"。在以下配置中，允许使用域 https://example.com 和 example.org：

¥The option allowDomains allows specific domains to use target="_blank" without rel="noreferrer". In the following configuration, it’s allowed to use the domains https://example.com and example.org:

{
    "//": "...",
    "options": {
        "allowDomains": ["https://example.com", "example.org"]
    }
}
<>
  <a target="_blank" href="https://example.com"></a>
  <a target="_blank" href="example.org"></a>
</>

Biome 不会检查列表是否包含有效的 URL。

¥Biome doesn’t check if the list contains valid URLs.

相关链接

Section titled 相关链接

¥Related links