추가적인 HTTP 헤더를 사용하여 한 출처에서 실행 중인 웹 에플리케이션이 다른 출처의 선택한 자원에 접근할 수 있는 권한을 부여하도록 브라우저에 알려주는 체제. 웹 어플리케이션은 리소스가 자신의 도메인/프로토콜/포트 와 다를 때 교차 출처 HTTP 요청을 실행한다. -MDN
CORS는 브라우저와 서버가 서로 통신할 때 등장하는 개념으로 HTTP 헤더를 기반으로 동작한다. 서버는 어떤 출처가 자신의 리소스를 가져갈 수 있는지 설정하고, HTTP 헤더를 사용해 요청의 출처를 확인한다. SOP 위반일 때 요청이 실행된다고 생각하자.
부록) Preflight 메커니즘
브라우저가 실제 요청에 앞서 자신이 어떤 HTTP 메소드를 사용할 것인지 서버에 미리 알리고 실제 요청이 허락될지 확인하는 과정.
모든 HTTP 요청이 프리플라이트를 띄우지는 않는다.(get요청...)
서버에 정보를 업데이트 하는 요청(post)의 경우에는 프리플라이트에 해당하는 http 메소드인 options가 먼저 서버에 날라가, 허용될 지 여부를 알아온다.
단순요청의 요건
1. HTTP 메소드는 다음 셋 중 하나일 것.
- GET
- HEAD
- POST
- 브라우저 기본 세팅으로 설정된 헤더.
- Accept
- Accept-Language
- Content-Language
- Content-Type
- Content-Type 헤더의 값은 다음 셋 중 하나일 것.
- application/x-www-form-urlencoded
- multipart/form-data
- text/plain
- 요청에서 이벤트 리스너가 사용되지 않아야 함.
- 요청에서 ReadableStream이 사용되지 않아야 함.
서버와 쿠키, 세션 등을 통해 통신한다면 반드시 withCredentials
값을 True
로 설정해주어야 한다.
이 때, 서버는 반드시 Access-Control-Allow-Origin 값으로 *
를 사용하지 않고 정확한 출처를 명시해야한다.
withCredentials
값을 별도로 설정하지 않는 경우
INSTALLED_APPS =[ ..... 'corsheaders', ]
MIDDLEWARE = [ ..... 'corsheaders.middleware.CorsMiddleware', ]
##CORS CORS_ORIGIN_ALLOW_ALL=True CORS_ALLOW_CREDENTIALS = True CORS_ALLOW_METHODS = ( 'DELETE', 'GET', 'OPTIONS', 'PATCH', 'POST', 'PUT', ) CORS_ALLOW_HEADERS = ( 'accept', 'accept-encoding', 'authorization', 'content-type', 'dnt', 'origin', 'user-agent', 'x-csrftoken', 'x-requested-with', )