<a> 태그 target=_blank 속성의 취약점
HTML에서 <a>태그를 사용해서 새로운 웹페이지로 링크를 걸어둘 수 있다. 이때 방문자의 접속 자체가 이탈되는 것을 방지하기 위해 target=_blank 속성을 사용하여 링크된 웹페이지가 새로운 tab으로 열릴게끔 설정할 수 있다.
<a href="https:www.google.com/" target=_blank>Google</a>
<!--> 새로운 웹브라우저 탭에서 Google이 열린다 <-->다만 target=_blank 속성을 사용하게 되는 경우 보안 문제가 발생하게 된다.
👺Tabnabbing 공격
"Tabnabbing은 HTML 문서 내에서 링크(target이 _blank인 Anchor 태그)를 클릭 했을 때, 새롭게 열린 탭(또는 페이지)에서 기존의 문서의 location을 피싱 사이트로 변경해 정보를 탈취하는 공격 기술을 뜻한다. 이 공격은 메일이나 오픈 커뮤니티에서 쉽게 사용될 수 있습니다. "
window.opener라는 전역객체는 현재 창을 열었던 이전 창의 참조를 반환한다.- 해커들이 이를 악용해
window.opener의 location 값에 접근해 (A) 이전 페이지의 콘텐츠를 수정하거나 피싱 사이트 주소로 바꿔 악용할 수 있다. - 즉 링크를 역으로 타고 들어온 이들에게 필요 이상의 많은 권한을 내어주게 된다.
rel=noopener & noreferrer
noopener 속성값은 Tabnabbing 공격을 방지하기 위해 생겨났으며 새 페이지에서의 이전 페이지 접근을 막아준다. 자세히 보자면 →
-
새 탭에서 opener 를 참조할 수 없게 막는다.
-
noopener 속성값이 부여된 Anchor 태그를 통해 열린 페이지는 location 변경과 같은 자바스크립트 요청을 거부한다.
-
또한 새탭에서 열린 페이지는 언제든지 opener를 참조할 수 있기 때문에 부모 탭과 같은 스레드에서 페이지가 동작하게 된다. 이때 만약 새 탭의 페이지가 리소스를 많이 사용한다면 부모 탭도 함께 느려진다는 성능 취약점이 발생한다. 반면 noopener를 사용하면 새 탭은 부모 탭을 호출할 일이 없어지므로 기존 탭에 성능 저하를 발생시키지 않는다.
참고: Tony Teaches Tech - This is How rel=”noopener” Protects Your Outgoing Links
noreferrer 속성값은 noopener 속성값과 동일하게 새로 열린 사이트가 window.opener 객체에 접근하는 것을 방지하는 역할을 한다. 이와 더불어 noreferrer의 메인 기능은 브라우저가 새 페이지를 불러올 때 referrer 헤더를 생략하게 한다는 점이다. 즉 noreferrer 속성값이 포함되어 있는 Anchor 태그로 새 페이지가 열리는 경우 Direct 접속으로 기록되게 되고, 새 페이지의 관리자는 해당 방문자가 어디서 오게 되었는지 알 수 없다.
두 속성값 모두 _target 속성값의 취약점을 보완해주는 속성값이며, 아래 예제처럼 Anchor 태그를 사용할 때마다 포함시켜 주는 것이 좋다.
<a href="https://www.google.com" rel="noopener noreferrer">Google</a>