본문 바로가기

cs(with 매일메일)

[251020월] CORS란 무엇인가요?

CORS(Cross Origin Resource Sharing) : 출처가 다른 리소스를 요청할 때, 접근 권한을 부여하는 매커니즘

 

리소스를 주고받는 두 곳의 출처가 다르면 출처가 교체하다고 합니다.

 

이때 출처는 URL뿐만 아니라 프로토콜과 포트까지 포함됩니다.

 

만약 클라이언트의 출처가 허용되지 않았다면 CORS 에러가 발생할 수 있습니다. 

 

과거에는 크로스 사이트 위조 요청(CSRF)문제가 있었습니다. 피해자의 브라우저에서 다른 어플리케이션으로 가짜 클라이언트 요청을 전송하는 공격입니다. 

 

CSRF를 예방하기 위해 브라우저는 동일 출처 정책(SOP, same-origin policy)을 구현했습니다. SOP가 구현된 브라우저는 클라이언트와 동일한 출처의 리소스로만 요청을 보낼수 있었습니다. 

 

하지만 SOP는 한계가 있습니다. 현대의 웹 어플리케이션은 다른 출처의 리소스를 사용하는 경우가 많기 때문입니다. 

 

 

✨ CORS의 작동방식

브라우저가 요청 메세지에 Origin 헤더와 응답 메시지의 Acess-Control-Allow-Origin 헤더를 비교해서 CORS를 위반하는지 확인

이때 Origin에는 현재 요청하는 클라이언트의 출처(프로토콜, 도메인, 포트)가, 

Access-Control-Allow-Origin에는 리소스 요청을 허용하는 출처가 작성됩니다. 

 

이렇게 단순하게 요청하는 것을 Simple Request하고 합니다. 이는 요청 메서드(GET, POST, HEAD), 수동으로 설정한 요청 헤더, Content-type 헤더인 경우에만 해당합니다. 

 

브라우저가 사전 요청을 보내는 경우도 있습니다. Preflight Request라고합니다. 브라우저가 본 요청을 보내기 이전, Preflight Request를 OPTIONS메서드로 요청을 보내어 실제 요청이 안전한지 확인합니다. 

 

preflight request는 추가로 Access-Control-Request-Method로 실 요청 메서드와, Access-Control-Request-Headers헤더에 실 요청의 추가 헤더 목록을 담아서 보내야 합니다.

 

또한 인증된 요청을 사용하는 방식도 있는데요, 이를 Credential Request라고합니다. 쿠키나 토큰과 같은 인증 정보를 포함한 요청은 더욱 안정하게 처리되어야합니다.