[네트워크] same-site와 same-origin 그리고 cross-origin

프론트를 공부하다보면 CORS 에러를 자주 접하게 된다.

CORS는 Cross-Origin Resource Sharing의 약자로 문제를 이해하기 위해 먼저 origin과 site 개념에 대해 정리해보았다.

 

Origin

https://www.exameple.com:443

• https: scheme
• www.example.com: host name
• 443: port

 

same origin은 scheme, host name, port 가 모두 동일한 웹사이트를 말한다.

 

origin B	same-origin / cross-origin
https://www.evil.com:443	cross-origin: domains 불일치
https://example.com:443	cross-origin: subdomains 불일치
https://login.example.com:443	cross-origin: subdomains 불일치
http://www.example.com:443	cross-origin: schemes 불일치
https://www.example.com:80	cross-origin: 포트 번호 불일치
https://www.example.com:443	same-origin
https://www.example.com	same-origin : 암시적 포트번호(443) 일치

 

Site

동일한 eTLD+1 이 있는 웹사이트는 same-site 로 간주된다. 다른 eTLD+1 이 있는 웹사이트는 cross-site 이다.

 

origin B	same-site / cross-site
https://www.evil.com:443	cross-site: domains 불일치
https://login.example.com:443	same-site: 다른 subdomains 상관없음
http://www.example.com:443	same-site: 다른 schemes은 상관없음
https://www.example.com:80	same-site: 다른 포트 번호는 상관없음
https://www.example.com:443	same-site: 정확한 일치
https://www.example.com	same-site: 포트 번호 상관없음

 

schemeful same-site

same-site 의 정의는 HTTP 가 weak channel(비보안 출처의 요청을 위조할 수 있는 네트워크 공격, 웹사이트 취약점 공격…)로 사용되는 것을 방지하기 위해 URL scheme 을 site의 일부로 간주하도록 진화하고 있다.

origin B	same-site / cross-site
http://www.example.com:443	cross-site: schemes 불일치

 

요청을 확인하는 방법

크롬은 HTTP 헤더와 함께 Sec-Fetch-Site 요청을 보낸다.

이 헤더는 cross-site, same-site, same-origin, none 중에 하나를 포함한다. 

 

참고자료

https://web.dev/same-site-same-origin/