Using target=_blank without rel=noopener noreferrer is a security risk

react 작업 시, Warning으로 따라다니는 경고 메시지.

a태그에 target=_blank 속성만 넣으면 나타나는 메시지로 보안 이슈로 알려져 있다.

 

원인:

Tabnabbing 피싱 공격에 노출될 수 있기 때문.

Tabnabbing 피싱 공격이란 target_blank인 태그를 클릭하였을 때 새롭게 열린 탭에서 기존 페이지를 피싱페이지로 바꿔 정보를 탈취하는 피싱공격입니다.

 

해결방법:

rel=”noopener noreferrer” 속성을 추가하여 문제를 해결.
rel=”noopener noreferrer”는 rel=noopener 속성이 부여된 링크를 통해 열린 페이지는 opener의 location변경과 같은 자바스크립트 요청을 거부함.

 

<a
target="_blank"
rel="noopener noreferrer"
href="#"
>
디버깅 완료
</a>