react/jsx-no-target-blank Pedantic
작동 방식
이 규칙은 외부 링크의 href 및 폼 액션에 대해 보안 취약점을 방지하기 위해, 외부 링크 href 및 폼 액션에 rel='noreferrer'를 요구하며, 선택적으로 동적으로 생성된 모든 링크 href 및 폼 액션에도 적용합니다.
왜 문제가 되는가?
JSX 요소에서 a 태그를 만들 때 종종 target='_blank' 속성을 사용하여 새 탭에서 링크를 열고 싶어 합니다. 그러나 rel='noreferrer' 없이 target='_blank'만 사용하는 것은 심각한 보안 취약점입니다 (자세한 내용은 noreferrer 문서 및 noopener 문서를 참조하세요). 이 규칙은 target='_blank' 속성과 함께 rel='noreferrer'를 함께 사용하도록 요구합니다.
예시
이 규칙에 부적절한 코드 예시:
jsx
var Hello = <a target="_blank" href="https://example.com/"></a>;
var Hello = <a target="_blank" href={dynamicLink}></a>;이 규칙에 적절한 코드 예시:
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>;구성
이 규칙은 다음 속성을 가진 구성 객체를 수락합니다:
allowReferrer
type: boolean
기본값: false
참조자(리퍼러) 허용 여부.
enforceDynamicLinks
type: "always" | "never"
기본값: "always"
동적 링크 강제 적용 여부 또는 정적 링크 강제 적용 여부.
forms
type: boolean
기본값: false
폼 요소 검사 여부.
links
type: boolean
기본값: true
링크 요소 검사 여부.
warnOnSpreadAttributes
type: boolean
기본값: false
스프레드 속성이 사용될 때 경고 표시 여부.
사용 방법
구성 파일이나 명령줄 인터페이스를 통해 이 규칙을 활성화하려면 다음을 사용할 수 있습니다:
json
{
"plugins": ["react"],
"rules": {
"react/jsx-no-target-blank": "error"
}
}bash
oxlint --deny react/jsx-no-target-blank --react-plugin