CORS - 1

면접중에 받았던 질문중에 CORS에 대한 질문이 있었는데, 긴장을 해서였는지 그냥 준비가 부족해서 였는지 답변을 못했었다.

대부분의 웹 프로젝트가 프론트와 백의 서버가 분리되어 서비스 되는 만큼 진짜 기본 중에 기본이라고 할 수 있는 개념인데...

사실 그 면접 마무리되고 나서부터 계속 한번 정리해야지 해야지 생각만하고 있었는데 이번 기회에 정리하면서 확실하게 가지고 가야겠다.

 

 

CORS란?

• CORS는 Cross-Origin Resource Sharing의 약자로서 간단하게 번역해보면 "교차 출처 자원 공유" 정도로 번역된다.
• CORS는 웹에서 다루는 데이터의 크기가 커지고, 더 다양해짐에 따라서 기존의 웹 규칙인 SOP와는 대치되는 구조이다.
• 도메인을 단위로 하여 최초 자원이 로드된 도메인이 아닌 외부의 다른 도메인으로부터 자원을 요청할 수 있도록 허용한다.
  • 이 부분이 SOP의 구조와 충돌하는 부분

 

SOP란?

• SOP란 Same Origin Policy의 약자로 번역하면 "동일-출처 정책"으로 번역할 수 있다.
• 웹 애플리케이션에 적용되는 보안 모델로서 어떤 출처에서 로딩된 리소스가 다른 출처에서 로딩한 리소스와 상호작용하는 것을 막는 모델이다.
• 출처를 구분하는 기준은 URL의 "프로토콜" + "호스트/도메인" (+ "포트", 명시되었을 경우)가 정확하게 일치해야 동일 출처라고 판단하며 하나라도 다를경우 다른 출처라고 판단한다.

출처 결정 규칙 예시

 

CORS 사용하려면?

• CORS를 사용하기 위해서는 HTTP Method를 구성하는 부분중 Header에 CORS와 관련된 내용이 들어가야 한다.
• Request에서 사용되는 CORS 헤더
  • Origin
  • Access-Control-Request-Method
  • Access-Control-Request-Headers
• Response에서 사용되는 CORS 헤더
  • Access-Control-Allow-Origin
  • Access-Control-Allow-Credentials
  • Access-Control-Expose-Headers
  • Access-Control-Max-Age
  • Access-Control-Allow-Methods
  • Access-Control-Allow-Headers
• CORS 세팅은 프로젝트 시작할 때, 초기 설정과정에 포함시켜 놓는 게 마음 편하다.

 

Django에서 CORS 설정하기

• Django 프레임워크에서 CORS를 설정하는 방법은 매우 간단하다. CORS 미들웨어를 pip를 통해서 설치한 후, 프로젝트의 setting 파일에서 관련 옵션들을 지정해 주면 끝이다.
• 미들웨어 설치는 pip를 통해서 진행할 수 있다.
  • command) pip install django-cors-headers 
  • 요즘 pip를 쓸 때 DEPRECATION 메세지가 계속 뜨고 있는데 한번 확인해볼 필요가 있을 듯 하다.

django-cors-headers 설치

• 미들웨어 설치가 성공하면 이후에는 프로젝트의 settings 파일에 추가적인 작업이 필요하다.
  • INSTALLED_APPS 리스트에 "corsheaders" 추가
  • MIDDLEWARE 리스트에 "corsheaders.middleware.CorsMiddleware" 추가
    • 이 부분은 가장 최상단에 위치하는 것이 좋다.
    • 리스트로 정의된 항목이니 만큼 순서에 따라서 호출되기에 자칫하면 미들웨어 단에서 생성되는 요청에 CORS가 적용되지 않을 수 있다.

• 다음 과정은 항목 자체를 생성해주어야 한다. 위쪽에서 먼저 언급한 CORS 관련 헤더에 어떤 값을 채울 것인가와 관련된 필드이다.
  • CORS Origin 과 관련된 필드 : CORS를 허용할 도메인을 설정할 수 있다. 공부 또는 테스트용도라면 모든 도메인에 대해서 허용해 줄 수도 있다.
  • HTTP Method 와 관련된 필드 : CORS를 허용할 HTTP Method를 설정할 수 있다. GET, POST 같은 HTTP Method를 지정하면 된다. 커스텀 Method의 경우에도 추가만 해주면 문제없이 사용 가능
  • HTTP Header 와 관련된 필드 : CORS를 허용할 HTTP Header를 설정할 수 있다.

테스트 목적으로 모든 도메인에 대해서 CORS를 허용하는 설정 -- CORS_ORIGIN_ALLOW_ALL = True

CORS_ORIGIN_WHITELIST를 사용하여 CORS를 허용할 도메인을 문자열 형식으로 지정할 수 있다.

• 이렇게 설정이 되면 끝이다.

 

중간정리

• 이번 포스팅에서는 CORS가 뭔지, Django에서 CORS 설정을 적용하는 것까지 정리했는데 CORS 설정만 목적으로 한다면 여기까지 알고 진행하면 문제없다.
• 다음에 CORS에 대한 포스팅은 CORS에 대해서 더 세부적으로 파악해서 정리해보면 좋을 것 같다.

 

참고 및 출처

• 출처 결정 규칙 표 출처 - https://ko.wikipedia.org/wiki/동일-출처_정책

동일-출처 정책 - 위키백과, 우리 모두의 백과사전

• 참고 글 - https://velog.io/@hoo00nn/CORSCross-Origin-Resource-Sharing-란#access-control-allow-credentials-true