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>;