[web] SOP/ CORS

김기용·2020년 11월 8일
0
post-thumbnail

CORS가 무엇인지 알기 전에 먼저 SOP에대해서 알아보자

🤔 SOP란 ?

⚡️SOP(same-origin-policy) 동일 출처 정책은 WEB App이 같은 출처에서만 자원을 공유하는것을 원칙으로 하고 있다. 즉, 어떠한 출처에서 불러온 자원(문서, 스크립트)은 다른 출처에서 가져온 자원과 상호작용을 못하게 제한한다는 것이다.

"같은 출처에서만 자원을 공유해라!" - SOP

🕹 why? 보안상의 이유때문이다.

출처가 다른 App들이 마음대로 소통할 수 있는 환경은 매우 매우 매우 매우 위험한 환경이다. 사용자가 나쁜 마음을 먹는다면 CSRF(Cross-Site Request Forgery), XSS(Cross-Site Scripting) 등을 사용해서 필요한 정보를 손쉽게 탈취할 수 있기 때문이다.

🕹 Origin(출처)란 ?

출처는 URL 구조⚡️scheme, ⚡️host, ⚡️port 이 3가지만 잘 보면 된다! (아주쉬움!)

http://www.amusesla.com:8000

scheme	: https://
host	: www.amusesla.com
port	: 8000

포트의 경우 나타나지 않을 수 있으며 따로 확인해주어야함!

CORS(Cross-Origin Resource Sharing)

하지만 서비스를 제공하는 사람과 그 서비스를 사용하는 입장에서는 같은 출처에서만 자원을 공유한다는것은 매우 슬픈이야기다..😭

그래서 추가 HTTP header를 사용해 브라우저에게 다른 출처에 자원에 접속할 수 있게 권한을 받도록 하는 방법이 바로 CORS이다!

🕹 어떻게 작동하나 ?

브라우저가 request를 보낼때 Origin에 출처를 담아 보내게 되고 서버쪽에서는 응답을 할때 Acess-Control-Allow-Origin 필드에 자원에 접근 하는것이 허용된 출처라고 표시후 response를 보내면 브라우저가 origin과 Access-Contorl Allow Origin을 비교 분석후 response가 유효한지 결정한다.

브라우저에서 응답의 유효성을 판단하는 점때문에 서비끼리와의 통신에서는 적용되지않는다

공부할 시나리오

  1. Preflight Request
  2. Simple Request
  3. Credentialed Request
profile
매일 새로운 배움을 통해 꾸준히 성장하는 것을 목표를 두고 있습니다. 논리적인 사고로 문제해결 하는것에 희열을 느끼고 언젠가 제가 만든 결과물들이 사람들에게 편이를 제공하며 사용되는 날을 간절히 소망하고 있습니다. 🙏

0개의 댓글