SOP(Same-origin policy)

• Same-Origin Policy (SOP)와 Cross-Origin Resource Sharing (CORS)은 둘 다 웹 보안에 관련된 정책이지만, 각각 다른 목적과 방법으로 작동합니다. 이 두 정책은 상호 보완적인 관계에 있습니다.
  • SOP의 주된 목적은 웹 페이지에서 실행되는 스크립트가 다른 출처의 리소스에 대한 무제한 접근을 하지 못하게 제한하는 것입니다. 이는 악의적인 웹사이트가 사용자의 데이터를 탈취하거나 변조하는 것을 방지합니다.
  • 브라우저는 웹 페이지가 리소스를 요청할 때 그 출처(origin)을 확인합니다. 프로토콜, 도메인, 포트가 모두 같아야만 리소스에 접근이 허용됩니다.

Origin

• Origin은 프로토콜(scheme), 도메인(또는 호스트), 그리고 포트 번호의 조합을 의미합니다.
• 웹 브라우저에서 다루는 보안 정책, 특히 Same-Origin Policy(SOP)와 Cross-Origin Resource Sharing(CORS)에서 중요한 개념입니다.
• 예를 들어, https://planner.bodoc.co.kr:443 이라는 URL로 서비스 한다고 가정합니다.
  • 프로토콜 (Scheme) : https
  • 도메인 (Host) : planner.bodoc.co.kr
  • 포트 번호 (Port) : 443 위 세 가지 요소가 모두 일치해야 동일한 출처(origin)으로 판단됩니다.

Origin과 브라우저 동작

1. HTTP 헤더: 웹 브라우저는 보통 다른 출처의 리소스에 접근할 때 "Origin" 헤더를 포함하여 요청을 보냅니다. 이 헤더는 현재 페이지의 출처를 나타냅니다.
2. Same-Origin Policy: 웹 페이지의 스크립트가 다른 출처의 리소스에 접근하려면, 두 출처의 Origin이 일치해야 합니다.
3. Cross-Origin Resource Sharing (CORS): 서버는 "Access-Control-Allow-Origin" 같은 CORS 헤더를 사용하여, 어떤 출처에서의 접근을 허용할지를 명시할 수 있습니다.
4. Credential Sharing: 쿠키나 HTTP Authentication 같은 credentials를 다른 출처과 공유하려면, 명시적인 서버 설정이 필요합니다. CORS에서는 "Access-Control-Allow-Credentials" 헤더를 사용합니다.
5. Security Restrictions: 브라우저는 Origin을 기반으로 여러 가지 보안 제한을 적용합니다. 예를 들어, localStorage나 IndexedDB는 동일한 Origin 내에서만 데이터를 공유할 수 있습니다.
6. JavaScript APIs: 많은 JavaScript API들, 예를 들어 fetch나 XMLHttpRequest, postMessage 등도 Origin을 고려합니다. fetch나 XMLHttpRequest는 CORS 정책을 지키고, postMessage는 명시적으로 메시지를 수신할 대상 Origin을 지정할 수 있습니다.

SOP와 CORS의 상관관계

1. 기본 보안 수준 설정: SOP가 웹의 기본 보안 수준을 설정합니다. 즉, 어떠한 설정도 하지 않으면 SOP에 따라 다른 출처의 리소스 접근은 기본적으로 제한됩니다.
2. 보안 완화: CORS는 이러한 SOP의 제약을 명시적으로 완화할 수 있게 해줍니다. 서버가 CORS 헤더를 올바르게 설정하면, 다른 출처에서도 특정 리소스에 안전하게 접근할 수 있습니다.
3. 브라우저의 역할: 둘 다 브라우저 수준에서 동작하는 정책이며, 브라우저가 이 두 정책을 적절히 조절하여 웹의 보안을 유지합니다.