跳至内容

react/jsx-no-target-blank 正确性

此规则已默认打开

作用

此规则的目的是通过要求外部链接 href 和表单操作使用 rel='noreferrer',以及可选的任何动态生成的链接 href 和表单操作,防止用户生成的链接 href 和表单操作产生安全漏洞。

此项为何不对?

创建具有 a 标签的 JSX 元素时,通常希望使用 target='_blank' 属性在新的选项卡中打开链接。但是,仅使用此属性而不使用 rel='noreferrer' 会造成严重的安全漏洞(有关更多详细信息,请参见 noreferrer 文档noopener 文档)。此规则要求您使用 rel='noreferrer' 伴随 target='_blank' 属性。

示例

jsx
/// correct
var Hello = <p target="_blank"></p>;
var Hello = <a target="_blank" rel="noreferrer" href="https://example.com"></a>;
var Hello = <a target="_blank" rel="noopener noreferrer" href="https://example.com"></a>;
var Hello = <a target="_blank" href="relative/path/in/the/host"></a>;
var Hello = <a target="_blank" href="/absolute/path/in/the/host"></a>;
var Hello = <a></a>;
/// incorrect
var Hello = <a target="_blank" href="https://example.com/"></a>;
var Hello = <a target="_blank" href={dynamicLink}></a>;

引用

根据 MIT 许可证发行。