react/jsx-no-target-blank 細かい
何を実行するか
このルールは、外部リンクの href およびフォームのアクションがセキュリティ上の脆弱性を引き起こすことを防ぐことを目的としています。外部リンクの href およびフォームのアクションに対して rel='noreferrer' を要求し、オプションで動的に生成されたリンクの href およびフォームのアクションもチェックします。
なぜ問題なのか
a タグを含む JSX 要素を作成する際、target='_blank' 属性を使って新しいタブでリンクを開きたい場合が多いです。しかし、rel='noreferrer' を伴わない target='_blank' の使用は、深刻なセキュリティ上の脆弱性となります(詳細は noreferrer のドキュメント および noopener のドキュメント を参照)。このルールでは、target='_blank' 属性を使用する際に rel='noreferrer' を併用する必要があります。
例
このルールに対する 誤った 例:
var Hello = <a target="_blank" href="https://example.com/"></a>;
var Hello = <a target="_blank" href={dynamicLink}></a>;このルールに対する 正しい 例:
/// 正しい
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>;設定
このルールは以下のプロパティを持つ設定オブジェクトを受け取ります。
allowReferrer
type: boolean
default: false
リファラーの許可を有効にするかどうか。
enforceDynamicLinks
type: "always" | "never"
default: "always"
動的リンクを強制するか、静的リンクを強制するか。
forms
type: boolean
default: false
フォーム要素のチェックを有効にするかどうか。
links
type: boolean
default: true
リンク要素のチェックを有効にするかどうか。
warnOnSpreadAttributes
type: boolean
default: false
展開属性が使用されたときに警告するかどうか。
使用方法
設定ファイルまたは CLI でこのルールを 有効化 するには、次のようにします:
{
"plugins": ["react"],
"rules": {
"react/jsx-no-target-blank": "error"
}
}oxlint --deny react/jsx-no-target-blank --react-plugin