2023년 1월 1일
08:00 AM
Buffering ...

최근 글 👑

[백엔드] 기술 면접 Top30 - #6 CORS(Cross Origin Resource Sharing)

2023. 9. 8. 11:00ㆍ[백엔드] 기술면접
반응형

CORS (Cross Origin Resource Sharing)

 

 

CORS 란?

웹 애플리케이션에서 동일 출처 정책(Same-Origin Policy)을 우회하여 다른 도메인에서 리소스를 요청하고 공유할 수 있도록 해주는 웹 보안 메커니즘입니다.

동일 출처 정책은 웹 보안을 강화하기 위해 웹 브라우저에서 적용되는 규칙 중 하나로, 다른 출처(origin)에서 온 리소스 요청을 차단하고 있습니다.

출처란 프로토콜(e.g. HTTP, HTTPS), 호스트(도메인), 포트 번호의 조합을 뜻 합니다.

 

CORS 의 역할

웹 브라우저에서 실행되는 클라이언트 측 스크립트(JavaScript)가 다른 출처의 서버에서 데이터를 가져오거나 서비스를 사용할 수 있도록 하는 기술입니다.

웹 애플리케이션은 다른 도메인의 API를 호출하거나 외부 리로스를 불러와 사용할 수 있게 됩니다.

 

CORS 의 작동 방식

  • 브라우저에서 웹 페이지가 다른 도메인의 리소스를 요청할 때, HTTP 요청 헤더에 Origin 정보가 포함됩니다.
    Origin은 요청을 보낸 페이지의 출처를 나타냅니다

  • 서버는 Origin 정보를 확인하고 해당 Origin에서의 요청을 허용할지 거부할지 결정합니다.
    이를 위해 서버는 응답 헤더에 Access-Control-Allow-Origin을 포함하여 허용할 출처를 명시합니다.
    허용하는 출처는 ' * ' 를 사용하여 모든 출처를 허용하거나 특정 출처를 명시적으로 지정할 수 있습니다.

  • 브라우저는 서버의 응답을 확인하고, 만약 허용된 출처와 일치한다면 응답을 처리하고 자바스크립트로 데이터를 활용할 수 있습니다.
    그렇지 않다면 브라우저는 CORS 에러를 발생시키고 자바스크립트에서 해당 응답을 접근할 수 없게 됩니다.

요약

CORS(Cross-Origin Resource Sharing)는 웹 보안 메커니즘으로, 웹 애플리케이션이 다른 출처의 리소스에 안전하게 접근하도록 허용합니다. 
브라우저에서 실행되며, 요청 시 Origin을 체크하고 서버에서 허용 여부를 결정합니다. 
서버는 응답 헤더에 출처를 명시하여 접근을 제어하며, 브라우저는 이를 확인하여 접근 여부를 결정합니다. 
이로써 웹 애플리케이션은 보안을 유지하면서 다른 도메인의 데이터를 활용할 수 있습니다.
반응형