본문 바로가기
프로그래밍/HTML

a태그 noopener와 noreferrer 정리 - HTML | GenieIT Programming World

by GenieIT* 2024. 10. 4.
728x90
반응형

a태그 noopener와 noreferrer에 대한 설명
a태그 noopener와 noreferrer에 대한 설명

 

"noopenner와 noreferrer이란 무엇인가?"

 

요약

  • noopener: 새로 열린 페이지가 원본 페이지의 참조를 가져올 수 없게 하여 보안을 강화.
  • noreferrer: 새로 열린 페이지가 원본 페이지의 리퍼러 정보를 받지 못하게 하여 개인정보 보호를 강화. noopener의 기능도 포함.
  • target="_blank"를 사용할 때 발생할 수 있는 보안 위협을 줄이고, 사용자의 개인정보를 보호할 수 있습니다.

 

왜 noopener, noreferrer를 사용하나요?

  • noopenernoreferrer는 보안과 개인정보 보호를 강화하기 위해 HTML의 <a> 태그에서 사용하는 rel 속성 값입니다. 이 값들은 주로 target="_blank"와 함께 사용되며, 새 창을 열 때 발생할 수 있는 보안 위험을 방지하는 데 도움이 됩니다.

 

rel 속성 값 : noopener

  • noopener는 링크가 새 창이나 새 탭에서 열릴 때, 원본 페이지와 새로 열린 페이지 간의 참조 연결을 끊는 역할을 합니다.
  • target="_blank"를 사용하여 새 창을 열면, 새 창의 JavaScript에서 원본 창(링크를 클릭한 페이지)에 대한 참조(window.opener)를 가질 수 있게 됩니다. 악의적인 웹사이트는 이 참조를 이용해 원본 창의 페이지를 제어하거나 보안에 위협을 가할 수 있습니다.
  • noopener를 사용하면 새로 열린 페이지가 원본 페이지의 window.opener 객체를 사용할 수 없게 됩니다. 즉, 새 페이지가 원본 페이지를 수정하거나 제어하는 것을 방지합니다.
<a href="https://spirit0833.tistory.com" target="_blank" rel="noopener">Example</a>

 

rel 속성 값 : noreferrer

  • noreferrer새 페이지가 원본 페이지의 정보(리퍼러 정보)를 받지 않도록 합니다.
  • 사용자가 링크를 클릭해서 다른 웹사이트로 이동할 때, 브라우저는 기본적으로 원본 페이지의 URL을 새 웹사이트에 전달합니다. 이를 '리퍼러 정보(Referer)'라고 합니다.
  • noreferrer를 사용하면 새로 열린 페이지가 원본 페이지의 URL 정보를 받지 못하게 합니다. 이는 개인정보 보호 측면에서 유용합니다. 또한, noreferrer는 noopener의 기능을 포함하고 있어, 새로 열린 페이지가 원본 페이지에 대한 참조를 가질 수 없게 합니다.
<a href="https://spirit0833.tistory.com" target="_blank" rel="noreferrer">Example</a>

 

함께 사용하기

  • 대부분의 경우 noopener와 noreferrer는 함께 사용되며, 이는 보안 및 개인정보 보호를 동시에 보장합니다.
<a href="https://spirit0833.tistory.com" target="_blank" rel="noopener noreferrer">Example</a>

 


[Python] 파이썬 짝수 홀수 판별 예제

 

[Python] 파이썬 짝수 홀수 판별 예제

개요파이썬 짝수 홀수 판별에 대한 기본적인 이해를 위해 예제 소스들을 작성해 보겠습니다.짝수는 2의 배수라는 뜻입니다.홀수는 숫자를 2로 나누었을 때 나머지가 1인 숫자들입니다.n%2 == 0 짝

spirit0833.tistory.com

[Python] 모듈 없이 간단한 초를 시분초로 변환하기 (Time conversion in seconds)

 

[Python] 모듈 없이 간단한 초를 시분초로 변환하기 (Time conversion in seconds)

divmod 함수를 활용하여 쉽게 초단위를 시간으로 변환하는 방법에 대해 알려드리겠습니다.초를 분초, 시분초, 일시분초 그리고 연일시분초 단위로 시간 단위 변환 예제 코딩을 작성했습니다.divmod

spirit0833.tistory.com

주피터 노트북 설치 없이 웹에서 사용하기 - python world

 

주피터 노트북 설치 없이 웹에서 사용하기 - python world

파이썬 웹 컴파일러는 웹 브라우저에서 파이썬 코드를 작성하고 실행할 수 있도록 해주는 도구입니다. 이러...

blog.naver.com


728x90
반응형

 

728x90
반응형