CORS의 개념
브라우저에서는 보안적인 이유로 cross-origin HTTP 요청들을 제한한다. 그래서 cross-origin 요청을 하려면 서버의 동의가 필요하다. 만약 서버가 동의한다면 브라우저에서는 요청을 허락하고 동의하지 않는다면 브라우저에서 거절한다.
이렇게 허락을 구하고 거절하는 것을 HTTP-header에서 이용 가능한데 이게 바로 Cross-Origin Resource Sharing(교차 출처 리소스 공유)라고 부르는 CORS이다.
더 쉽게 말하면 동일한 출처가 아닌 다른 출처에서 데이터를 주고받는 것을 허용하는 정책이다.
그렇다면 앞서 닳도록 말한 cross-origin은 무엇일까??
cross-origin은 다음 중 한 가지라도 다른 경우를 말한다.
- 프로토콜 -http와 https는 프로토콜이 다르다.
- 도메인 -domain.com과 other-domain.com은 다르다.
- 포트 번호 -8080 포트와 3000 포트는 다르다.
CORS가 필요한 이유는?
CORS의 개념을 알았다면 허락을 구하고 거절해야 되는 게 왜 필요한지에 대한 궁금증이 생긴다. CORS가 없이 모든 곳에서 데이터를 요청할 수 있게 되면 다른 사이트에서 원래 사이트를 흉내낼 수 있게 된다. 기존 사이트와 완전히 동일하게 동작하도록 한다면 사용자는 헷갈릴 수밖에 없을 것이고 헷갈려서 흉내낸 사이트에 로그인을 한다면? 그 로그인을 한 세션을 탈취하여 악의적으로 정보를 추출해서 공격을 할 수 있게 된다. 이런 공격을 할 수 없도록 브라우저에서 보호하고 필요한 경우에만 서버와 협의해서 요청할 수 있도록 하는 것이다.
즉 보안상의 이유로 CORS가 필요하다고 볼 수 있다!!
CORS의 동작은?
CORS가 어떻게 안전하게 다른 출처와 리소스를 공유하는 것일까?
두 가지 방법이 있는데 단순 요청 방법과 예비 요청 방법이 있다.
요청 방법은 요청하는 헤더와 응답하는 헤더를 통해서 이루어진다.
먼저 단순 요청 방법은 Simple Request로 서버에서 바로 본격적인 요청을 시작하는 것이다. 그러면 미리 확인하지도 않고 어떻게 리소스를 요청해?라고 생각할 수 있는데 조금 까다로운 조건을 걸어서 바로 요청을 시작할 수 있게 한다.
- Access-Control-Request-Method를 통해 요청할 때 메서드는 HTTP 메서드가 아닌 GET, HEAD, POST 중 하나여야 한다.
- Access-Control-Request-Headers를 통해 요청을 보낼 때
Accept, Accept-Language, Content-Language, Content-TypeDPR, Downlink, SAVE-Data, Viewport-Width 중 하나여야 한다. - Content-Type을 사용할 경우 application/x-www-form-urlencoded, multipart/form-data, text/plain 중 하나여야 한다.
이렇게... 많고 까다로운 조건을 걸고 해당 조건에 부합한다면 안전한 요청이라 인식하고 데이터를 응답하는 형식이다.
예비 요청 방법은 말 그대로 미리 요청을 보내 보고 안전한지를 판단한 뒤에 본격적으로 요청을 하는 방식이다.
헤더에 Access-Control-Request-Method를 통해 요청하는 HTTP 메서드 GET, POST, PUT, DELETE 중 하나의 메서드와 Access-Control-Request-Headers를 통해 OPTIONS라는 헤더를 넣고 요청을 보낸다.
이때 예비로 확인하는 것뿐이기 때문에 바디에 아무것도 작성하지 않고 헤더만 보낸다.
해당 메서드와 헤더가 유효하다면 서버는 응답 헤더를 통해 접근 가능한지, 사용할 수 있는 리소스의 리스트, 캐싱되는 시간 등을 알려 주는 것이다.
... 너무너무 복잡한 CORS 근데 보안상의 이유를 충족해 주기 위해서는 필요한 것이니까 어려워도 앞으로 차근차근 더 공부를 해야 될 것으로 보인다. ㅠㅠ
참고 : CORS란, CORS란 무엇인가
