새소식

CS

[매일메일] CORS란?

  • -

 CORS(Cross Origin Resource Sharing)출처가 다른 리소스를 요청할 때 접근 권한을 부여하는 메커니즘으로 리소스를 주고받는 두 곳의 출처가 다르면 출처가 교차(Cross Origin)한다고 말한다. 이때 출처는 URL, 프로토콜 그리고 포트까지 포함되며 서버에서 허용하지 않은 클라이언트가 요청을 할 시에 CORS 에러가 발생할 수 있다.

 

CORS가 필요한 이유?

 

이전에는 CSRF(Cross-Site Request Forgery) 문제가 있었다.

 

2024 Fall 경북대학교 정보보호론 - 이지연 교수님 강의 자료

 

 공격자에 의해 사용자가 가짜 요청을 날리게 되는 공격으로, 위 그림에서는 공격자가 만든 가짜 사이트로 인해 피해자가 자신의 정보를 이용하여 돈을 이체하게 된다.

 

 이를 막기 위해 SOP(Same-Origin Policy)를 구현하였다. 그러면 클라이언트와 동일한 출처의 리소스로만 요청을 보낼 수 있었다. 하지만 현대의 웹 애플리케이션은 다른 출처의 리소스를 사용하는 경우가 많아 SOP를 확장한 CORS가 만들어지게 되었다.

 

CORS의 작동 방식?

 

 브라우저가 요청 메시지의 Origin 헤더, 그리고 응답 메시지의 Access-Control-Allow-Origin 헤더를 비교해서 CORS를 위반하는지 확인한다. Origin 헤더에는 현재 요청하는 클라이언트의 출처(프로토콜, 도메인, 포트) 그리고 Access-Control-Allow-Origin 헤더에는 리소스 요청을 허용하는 출처가 포함되어 있다.

 

 이렇게 단순 요청으로 처리되는 방식을 Simple Request라 한다. 이러한 Simple Request는

 

요청 메서드 GET, POST, HEAD
요청 헤더 Accept, Accept-Language, Content-Languaeg,
Content-Type, Range
Content-Type 헤더 application/x-www-form-urlencoded, multipart/form-data,
text/plain

 

인 경우에 해당한다.

 

 Simple Request와는 다르게 브라우저가 Preflight Request(사전 요청)을 보내는 경우도 있다. 브라우저가 본 요청을 보내기 전 OPTION 메서드로 Preflight Request를 보내어 실제 요청이 안전한지 확인한다.

 

 Preflight Request는 Simple Request에 추가로 Access-Control-Request-Method(실제 요청 메서드)Access-Control-Request-Headers 헤더(실제 요청의 추가 헤더 목록)를 담아서 보내야 한다.

 

 이에 대해 응답에서는 Access-Control-Allow-MethodsAccess-Control-Headers를 보내야 한다. 또한 Preflight Request의 반복된 요청으로 인한 성능저하를 해결하기 위해  Access-Control-Max-Age를 설정하여 Preflight 응답을 캐시 할 수도 있다.

 

 쿠키와 토큰같은 인증 정보를 포함한 요청의 경우 더욱 안전하게 처리되어야 하는데, 이는 인증 요청을 사용함으로써 처리될 수 있으며 이를 Credential Request라 하고 Credential Request를 요청하는 경우 서버에서는 Access-Control-Allow-Credentials를 true로 설정해야 하며 Access-Control-Allow-Origin에 *와 같은 와일드카드를 사용하지 못한다.

Contents

포스팅 주소를 복사했습니다

이 글이 도움이 되었다면 공감 부탁드립니다.