우리는 보통 HTML에서 링크를 만들 때 a태그를 사용하여 href 속성에 주소를 넣어 사용한다.
이때 새탭에서 열게하기 위해서 target='blank'라는 속성을 사용하는데 이렇게 사용할 때 보안에 취약점이 생기게 된다.
그렇다면 blank를 사용할 때는 어떤 문제점들이 생기는걸까?
blank 취약점
- 보안상 취약점이 생긴다
target="_blank"가 사용된 링크를 사용자가 클릭하면 새 탭에서 링크된 페이지가 열린다.
만약 어떤 해커가 이 페이지의 JavaScript에서 window.opener로 오브젝트에 접근해서 'window.opener.location = 새로운URL'로 부모 윈도우의 URL을 바꿨다고 생각해보자.
이렇게 되면 개인정보 유출을 유도하는 가짜 페이지로 부적절한 연결을 하는 등 보안상에 심각한 문제가 발생할 수도 있다.
- 퍼포먼스가 떨어질 수 있다
target="_blank"가 사용된 링크에 의해 열린 링크는 같은 프로세스를 가지게 된다. 링크된 페이지에서 높은 부하를 유발하는 JavaScript가 실행되고 있으면 링크를 건 페이지에도 그 영향이 미쳐져 의도하지 않게 퍼포먼스가 떨어지는 문제가 발생할 수도 있다.
blank 해결방법
-
noopener 지정
noopener를 지정하면 열려 있는 창에 속성을 설정하지 않음으로써 문서를 연 문서에 대한 새 브라우징 컨텍스트 액세스 권한을 부여하지 않고 브라우저가 대상 리소스로 이동하도록 지시한다. -
noreferrer 지정
noreferrer를 지정하면 대상 리소스로 이동할 때 헤더를 생략하고 리퍼러 정보를 유출하지 않도록 브라우저에 지시 하고 추가로 키워드도 지정된 것처럼 작동하도록 한다. -
nofollow 지정
nofollow를 지정하면 검색엔진에게 링크된 웹사이트를 보증하거나 신뢰할 수 없으니 현재 웹사이트와 연결하지 않고 싶을 때 사용하는 속성이다.
안녕하세요