[Django] CORS 에러 해결하기

서론

가끔씩 로컬에서 서버를 실행시키고 Front-end, 클라이언트에서 실행시킨 해당 서버에 접근 하려고 할 때 CORS 에러가 발생한다.

 

CORS (Crosss Origin Resource Sharing)

브라우저는 보안상의 이유로 corss-origin http 요청을 거부하는 특징을 가지고 있다.

따라서 이러한 요청을 가능하게 하려면 서버에서 특정 주소를 허락해주어야 한다. CORS는 직역하면 교차 출처 리소스 공유로 표현할 수 있는데 쉽게 설명하면 브라우저에서 다른 출처의 리소스를 공유하는 방법을 말한다.

 

그래서 이번 글에서는 Django에서 CORS 에러를 해결하는 방법을 다뤄보고자 한다.

STEP 1

CORS 에러 해결에 필요한 모듈을 설치한다.

• pip install django-cors-headers

STEP 2

settings.py 파일의 INSTALLED_APPS 부분에 아래와 같이 corsheaders를 추가한다.

INSTALLED_APPS = [
        ...
    'corsheaders',
]

STEP 3

settings.py 파일의 MIDDLEWARE 부분에 아래와 같이 corsheaders.middleware.CorsMiddleware를 추가한다.

MIDDLEWARE = [
    ...
    'corsheaders.middleware.CorsMiddleware',
]

STEP 4

CORS_ORIGIN_ALLOW_ALL = True
CORS_ALLOW_CREDENTIALS = True

두 줄의 코드를 settings.py 파일에 추가한다. 이렇게 하면 외부의 모든 브라우저에서 개발한 서버에 접근할 수 있다.

 

하지만 이 경우는 로컬에서만 돌리는 경우이므로 실제 배포할 때에는 이렇게 구현하하는 것은 매우 위험하다.

실제 배포를 할 때 설정은 아래와 같이 해당 서버에 접근할 수 있는 주소를 직접 명시하여 접근을 제한하는 것이 효율적이다.

 

CORS_ORIGIN_WHITELIST = ['http://127.0.0.1:3000' ,'http://localhost:3000'] 
CORS_ALLOW_CREDENTIALS = True
CORS_ORIGIN_ALLOW_ALL = False

이런 식으로 WHITELIST를 명시하여 서버 접근을 허용할 주소들을 명시할 수 있다.

---

출처

• https://pypi.org/project/django-cors-headers/