CORS

김영후·2022년 8월 3일
0
post-thumbnail

CORS(Cross Origin Resource Sharing)는 클라이언트 애플리케이션과 다른 origin을 가진 서버 애플리케이션이 서로 통신할 수 있도록 허용하는 프로토콜


클라이언트와 서버는 같은 origin을 가진 경우에만 서로 통신을 할 수 있다. -> Same Origin Policy

origin이 다를 때 통신을 무조건 허용하면 보안 상 문제가 생길 위험이 크다.

그래서 CORS를 사용해 서로 다른 origin에서의 통신을 제어한다.


본격적으로 CORS에 대해 알아보기 전에 Same Origin Policy에 대해서 알아보자


Same Origin Policy

다른 출처의 리소스를 사용하는 것을 제한하는 보안 방식

http://github.com:80 를 예시로 들자면

http : 프로토콜
github.com : 호스트
80 : 포트

토큰만으로 사용자를 판단하지 않고 요청 URL을 확인해서 악의적인 요청을 차단한다.



CORS 접근 제어에 사용되는 세 가지 시나리오

  1. 단순 요청
  2. 사전 요청
  3. 인증 요청

단순 요청

Preflight 요청 없이 바로 요청을 보낸다.

Simple Request는 아래와 같은 조건을 만족해야한다.

메서드 : GET, POST, HEAD

Content-Type :

  • application/x-www-form-urlencoded
  • multipart/form-data
  • text/plain

헤더 : Accept, Accept-Language, Content-Language, Content-Type


사전 요청

OPTIONS 메서드를 통해 다른 도메인 리소스에 요청이 가능한지 확인하는 작업

요청이 가능한 것을 확인하면 실제 요청을 보낸다.

Preflight Request

Origin: 요청 출처
Access-Control-Request-Method: 실제 요청의 메서드
Access-Control-Request-Headers: 실제 요청의 추가 헤더

Preflight Response

Access-Control-Allow-Origin : 허가 출처
Access-Control-Allow-Methods : 허가 메서드
Access-Control-Allow-Headers : 허가 헤더
Access-Control-Max-Age : Preflight 응답 캐시 시간

여기서 Preflight의 응답 코드는 200대여야 하고 Body는 비어있는 것이 좋다


인증 요청

인증 관련 헤더를 포함할 때 사용하는 요청


클라이언트

쿠키 또는 JWT 토큰을 담아 보낼 경우 credentials : include 를 포함해서 보낸다.

서버

Access-Control-Allow-Credentials : true 해야 클라이언트의 인증 포함 요청에 허용이 가능하다.

profile
https://poagg.tistory.com/ 로 이전합니다.

0개의 댓글