CORS (Cross-Origin Resource Sharing) 란?

 

CORS란

CORS 웹개발에서 중요한 보안 관련 주제 중 하나로, "Cross-Origin Resource Sharing" (교차 출처 리소스 공유) 의 약어이다.

 

서로 다른 도메인 간에 데이터 요청과 응답을 허용하는 웹 보안 메커니즘으로 출처가 다른 자원들을 공유한다는 의미이다.

쉽게 말해,  한 출처에 있는 자원에서 다른 출처에 있는 자원에 접근하도록 하는 개념이다.

 

웹 브라우저에서 실행되는 스크립트가 다른 출처(도메인)에서 리소스를 요청할 때, 동일 출처 정책 (Same-origin policy)에 따라 요청을 차단하는데, 이를 허용하기 위해 필요한 것이 CORS이다.

 

 

CORS에 대해 자세히 알기 전에 출처 와 동일 출처 정책 이 무엇인지 먼저 알아보자.

 

 

 

출처란?

여기서 출처가 무엇인지, 어디서부터 어디까지가 출처라고 할 수 있을까?

https://beomy.github.io/tech/browser/cors/

프로토콜(Protocol) + 호스트(Host) + 포트(Port) 3가지가 같으면 동일 출처(Origin) 이다.

다른 출처 요청일 경우, CORS 정책에 준수하여 요청해야만 정상적으로 응답을 받을 수 있다.

 

 

 

동일 출처 정책 (Same-origin policy)

동일 출처 정책은 웹 브라우저에서 실행되는 스크립트가 다른 출처로부터 웹 페이지에 접근하거나 리소스를 요청하는 것을 제한하는 보안 규칙이다.

 

 

만일, 동일 출처 정책이 없다면?

악의적인 웹 사이트가 다른 출처의 쿠키, 세션 데이터, 또는 사용자 정보에 접근하여 개인 정보 유출을 유발하거나

XSS, CSRF 공격과 같은 공격을 할 수 있습니다.

 

예를들어,

'포리'라는 사용자가 웹사이트 A에 로그인을 한 후, 그 토큰이 브라우저의 쿠키에 저장이 되었다.
이때, '포리'가 개인 정보를 탈취하기 위해 악의적으로 만들어진 웹사이트 B에 접속하면,
웹사이트 B의 자바스크립트 코드가 브라우저에 다운로드되어 실행된다.
이 자바스크립트 코드는 웹사이트 B에서 '포리'의 브라우저에 저장된 웹사이트 A의 토큰을 사용하여 웹사이트 A의 서버로 요청을 보낸다.이렇게 함으로써 웹사이트 A의 서버로부터 '포리'의 정보를 탈취하고, 그 정보를 웹사이트 B의 서버로 전송할 수 있다.

이렇게 동일 출처 정책을 우회하려는 시도로 개인정보가 탈취될 수 있다.

 

동일 출처 정책으로 인해 웹 보안을 강화하고 사용자의 개인 정보와 웹 애플리케이션의 무결성을 보호받을 수 있다.

단, 다른 출처에서 얻은 이미지를 담는 <img>, 외부 주소를 담는 <link> 같은 여러 태그들은 허용한다.

 

 

 

CORS의 필요성

서로 다른 도메인 간에 자유롭게 데이터를 주고 받는데에는 위에 적힌 글과 같이 많은 보안 문제를 일으킬 수 있다.

다른 도메인을 열 수 없도록 한다면 좋겠지만,

지금의 웹에서는 다른 도메인에서 데이터를 가져와야 하는 경우가 많아졌기 때문에

더 안전하게 요청하고 공유할 수 있도록 하는 CORS가 필요해졌다.

 

 

 

CORS의 동작 원리

CORS는 HTTP 헤더를 통해 구현된다.

 

1. 다른 도메인에 요청을 보낼 때, 브라우저는 요청 헤더에 도메인(Origin) 정보를 포함시킨다.

Origin : https://pory.com

위와 같이 Origin 정보가 요청에 포함된다.

 

 

2. 서버는 이 Origin 정보를 확인하고, 허용되는 도메인인 경우 응답을 반환한다.

서버는 응답 헤더에 Access-Control-Allow-Origin 헤더를 포함하여 허용되는 리소스를 지정한다.

Access-Control-Allow-Origin: pory.com

pory.com 이라는 해당 도메인에서만 리소스에 접근이 허용하다는 의미이다.

 

Access-Control-Allow-Origin: *

위와 같은 경우에는 모든 출처에서의 요청을 허용하는 것을 나타낸다.

즉, 어떤 도메인에서도 해당 리소스에 접근할 수 있다는 의미이다.

참고로 이는 보안상 권장되지 않는다.

 

 

 

참고
CORS란 무엇인가?
[Browser] CORS란?
CORS, 기본 동작 원리와 이슈 해결 방법