[web] SOP/ CORS
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가 유효한지 결정한다.
브라우저에서 응답의 유효성을 판단하는 점때문에 서비끼리와의 통신에서는 적용되지않는다
공부할 시나리오
- Preflight Request
- Simple Request
- Credentialed Request
Author And Source
이 문제에 관하여([web] SOP/ CORS), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://velog.io/@amuse/web-SOP-CORS저자 귀속: 원작자 정보가 원작자 URL에 포함되어 있으며 저작권은 원작자 소유입니다.
우수한 개발자 콘텐츠 발견에 전념 (Collection and Share based on the CC Protocol.)