교차 출처 리소스 공유(Cross-Origin Resource Sharing, CORS)

교차 출처 리소스 공유(Cross-Origin Resource Sharing, CORS)소개

교차 출처 리소스 공유(Cross-Origin Resource Sharing, CORS)는 웹 애플리케이션에서 다른 출처(Origin)의 자원에 접근할 수 있는 권한을 부여하기 위해 추가적인 HTTP 헤더를 사용하는 메커니즘입니다.  "출처"란 프로토콜, 호스트, 포트 번호의 조합으로 구성되며, 웹 브라우저에서는 이 출처가 다를 경우 보안상의 이유로 기본적으로 리소스 접근을 차단합니다.

웹 애플리케이션은 자신과 다른 출처 간의 HTTP 요청을 실행할 때 CORS를 이용하여 접근 권한을 제어합니다.

CORS는 웹 애플리케이션이 다른 출처의 리소스에 제한적으로 접근할 수 있는 권한을 부여하도록 하는 메커니즘을 제공합니다. 이를 통해 웹 개발자는 웹 애플리케이션 간에 안전하게 데이터를 공유하고 리소스에 접근할 수 있습니다. CORS를 올바르게 구성하면 웹 애플리케이션에서 다른 출처의 리소스에 제한된 접근을 허용하거나, 특정 출처만 접근을 허용하도록 제어할 수 있습니다. 이를 통해 보안을 유지하면서도 웹 애플리케이션 간의 데이터 공유와 통신을 원활하게 할 수 있습니다.
예를 들어, https://domain-a.com의 웹 애플리케이션이 XMLHttpRequest나 Fetch API를 사용하여 https://domain-b.com/data.json과 같은 다른 출처의 리소스를 요청할 때, 브라우저는 보안상의 이유로 이를 제한합니다. 이 때, 다른 출처의 리소스에 접근하려면 해당 출처에서 올바른 CORS 헤더를 포함한 응답을 반환해야 합니다. 이를 통해 웹 애플리케이션은 안전하게 다른 출처의 자원을 활용할 수 있습니다.

 

CORS 작동 방식은 다음과 같습니다.

1. 요청 전송: 웹 브라우저에서 동일한 출처가 아닌 리소스에 대한 HTTP 요청을 보낼 때, 해당 요청에는 추가적인 헤더인 Origin 헤더가 포함됩니다. 이 헤더는 해당 요청이 어떤 출처에서 시작되었는지를 나타냅니다.
2. preflight 요청: 일부 경우에는 실제 요청을 보내기 전에 브라우저가 "preflight" 요청이라는 사전 요청을 보낼 수 있습니다. 이는 실제 요청이 안전한지 여부를 확인하기 위한 단계로서, 서버는 이 요청에 대한 응답으로 어떤 출처로부터의 요청을 허용할 것인지를 나타내는 헤더를 포함시킵니다.
3. 서버 응답: 서버는 응답 헤더 중에 Access-Control-Allow-Origin 헤더를 설정하여 어떤 출처로부터의 요청을 허용할지를 지정합니다. 이 헤더 값은 허용하는 출처나 "*"(모든 출처 허용) 중 하나가 될 수 있습니다. 또한, 다른 추가적인 헤더나 메소드, 허용되는 헤더들에 대한 정보도 설정할 수 있습니다.

CORS 헤더 

CORS 헤더는 서버에서 웹 브라우저에게 어떤 출처로부터의 요청을 허용하고 어떤 요청이나 헤더를 허용하는지를 알리는 역할을 합니다. 

 

다음은 일반적으로 사용되는 주요 CORS 관련 헤더입니다.

 

1. Access-Control-Allow-Origin: 이 헤더는 특정 출처로부터의 요청을 허용하는 출처를 지정합니다. 값으로는 허용할 출처의 도메인을 지정하거나, "*"를 사용하여 모든 출처를 허용할 수 있습니다.
2. Access-Control-Allow-Methods: 이 헤더는 허용되는 HTTP 메소드를 나타냅니다. 클라이언트가 보낼 수 있는 메소드를 지정합니다
3. Access-Control-Allow-Headers: 이 헤더는 허용되는 HTTP 헤더를 지정합니다.
4. Access-Control-Allow-Credentials: 이 헤더는 브라우저에게 요청에서 자격증명(쿠키, 인증 등)을 포함시킬 수 있는지 여부를 알려줍니다. 값으로는 true나 false를 사용합니다. 
5. Access-Control-Expose-Headers: 이 헤더는 브라우저가 접근할 수 있는 응답 헤더를 명시합니다. 일부 특정 응답 헤더를 노출시킬 경우 사용됩니다.
6. Access-Control-Max-Age: 이 헤더는 프리플라이트 요청의 유효 기간을 지정합니다. 프리플라이트 요청이 여러 번 발생하지 않도록 설정할 수 있습니다.
7. Access-Control-Request-Headers: 이 헤더는요청이 이루어질 때 사용될 HTTP 헤더를 서버에 알리기 위해 preflight요청을 발행할 때 사용됩니다.

참고자료

• Chapter 4. Handling preflight requests - CORS in Action: Creating and consuming cross-origin APIs (manning.com)
• https://developer.mozilla.org/ko/docs/Glossary/CORS