Django CORS 설정하기

RestApi를 설계해서 front 소스와 통신하는 중 해당 오류가 나타났다.

Ensure CORS response header values are valid

유효한 CORS 응답 헤더 값을 확인하라는 뜻이다.

CORS란

크로스 오리진 리소스 공유(CORS)는 애플리케이션을 통합하기 위한 메커니즘이다. CORS는 한 도메인에서 로드되어 다른 도메인에 있는 리소스와 상호 작용하는 클라이언트 웹 애플리케이션에 대한 방법을 정의한다.

url의 protocol, host, port를 통해 같은 출처 또는 다른 출처인지 확인이 가능하다.
세가지가 다 같아야지만 같은 출처라고 보고, 그중 하나라도 다르면 다른 출처이다.

1. 프로토콜: http와 https는 프로토콜이 다르다.
2. 도메인 google.com과 other-google.com은 다르다.
3. 포트번호 8000포트와 3000포트는 다르다.

그럼 해당 오류를 어떻게 해결해야 할까?

장고에서 CORS설정을 해주어야 한다.

1. django-cors-headers 설치

pip install django-cors-headers

2. settings.py 에 설정 추가

django-cros-headers 공식 깃허브

INSTALLED_APPS =[
...
'corsheaders', #CORS 관련 추가
...
]
MIDDLEWARE = [
'corsheaders.middleware.CorsMiddleware', # CORS 관련 추가 (가장 상단에 위치)
...
]

#CORS 관련 추가
CORS_ORIGIN_WHITELIST = ['http://127.0.0.1:3000'
,'http://localhost:3000','원하는 포트번호']#(포트 지정)
CORS_ALLOW_ALL_ORIGINS = True #(모든 포트 허용)

#HTTP methods 추가
CORS_ALLOW_METHODS = (
"DELETE",
"GET",
"OPTIONS",
"PATCH",
"POST",
"PUT",
)

#원하는 헤더 추가
CORS_ALLOW_HEADERS = (
"accept",
"authorization",
"content-type",
"user-agent",
"x-csrftoken",
"x-requested-with",
)

설정을 해주고 나면 이렇게 오류 없이 잘 실행된다!