date: 2022-08-25
개념을 공부하고 싶고, 나만의 기록용으로 최대한 짧게 요약
요새 열정적인 사람들 사이에서 나도 열정적이고 싶다.
1. SOP 정책의 탄생 이유
쿠키에 민감한 정보가 보관되어 있고, 브라우저(cookie storege, session storege)에 저장되어 있다.
브라우저는 자동으로 해당 웹 서비스에 저장할때 쿠키를 헤더에 포함시켜 요청을 한다.
예시
- 이용자가 악의적인 페이지를 접속한다.
- 악의적인 페이지에서 자바스크립트를 사용해 이용자의 SNS 웹 서비스로 요청을 보내는데, 브라우저는 요청을 보낼 때 쿠키를 포함시켜 정보를 악의적인 페이지로 전달할 것이다.
- 악의적인 페이지는 응답받은 쿠키를 이용하여 SNS를 읽고, 쓰고, 삭제하는 등 마음대로 사용 할 수 있을 것이다.
이왕 같은 문제를 방지하기 위해 동일 출처 정책, Same Origin Policy(SOP) 보안 정책이 탄생.
2. 동일 출처 정책(Same Origin Policy, SOP)
웹 브라우저가 보안을 위해 프로토콜, 호스트, 포트가 동일한 서버로만 비동기 요청을 주고 받을 수 있도록 한 정책이다.
아래 3가지로 Origin을 확인 할 수 있다.
1. Protocol, Scheme
2. Port
3. Hosthttp://www.xxxxersuy.com -> http://www.xxxxersuy.com : same-originhttp://www.xxxxersuy.com -> https://www.xxxxersuy.com : cross-originhttp://www.xxxxersuy.co.kr -> http://www.xxxxersuy.com : cross-originhttp://www.xxxxersuy.com -> http://www.xxxxersuy.com:1234 : cross-origin
즉, 동일 출처 정책(Same Origin Policy, SOP)이란 Origin 출처의 서버로만 요청을 주고 받을 수 있다.
3. CORS 탄생 이유
외부 출처에 대한 접근을 허용해줘야하는 경우 <img> , <style>, <script> 등의 태그는 SOP의 영향을 받지 않는다.
또한 SOP를 완화하여 다른 출처의 데이터 처리를 해야되는 경우도 있다.
- 카페: https://cafe.naver.com
- 블로그: https://blog.naver.com
- 메일: https://mail.naver.com
- 메인: https://naver.com
메인 페이지에서 수신한 메일의 갯수를 표현하기 위해서 https://naver.com 에서 https://mail.naver.com 에 관련된 리소스를 요청해야한다.
이 때 두 사이트의 Origin이 다르므로 SOP를 적용받지 않고 리소스를 공유할 방법이 필요하다.
위와 같은 상황에서 자원을 공유하기 위해 공유 교차 출처 리소스 공유(Cross Origin Resource Sharing , CORS)라고 한다.
4. 교차 출처 리소스 공유(Cross Origin Resource Sharing , CORS)
공유 교차 출처 리소스 공유(Cross Origin Resource Sharing , CORS)는 HTTP 헤더에 기반하여 Cross Origin 간에 리소스를 공유하는 방법이며 출처가 다른 도메인에서 서버단에서 데이터 접근 권한을 허용하는 정책이다.
CORS에러는 클라이언트 즉, 브라우저에서 발생하는 것이다.
OPTIONS 메소드를 가진 HTTP 요청 -> CORS preflight 라고 하며, 수신측에 웹 리소스를 요청해도 되는지 질의하는 과정이다.
| Header | 설명 |
| Access-Control-Allow-Origin | 헤더 값에 해당하는 Origin에서 들어오는 요청만 처리 |
| Access-Control-Allow-Methods | 헤더 값에 해당하는 메소드의 요청만 처리 |
| Access-Control-Allow-Credentials | 쿠키 사용 여부를 판단합니다. 예시의 경우 쿠키의 사용을 허용 |
| Access-Control-Allow-Headers | 헤더 값에 해당하는 헤더의 사용 가능 여부를 나타냄 |
댓글0