WEB

SOP(Same-Origin Policy) / CORS(Cross-Origin Resource Sharing)

dolzi 2023. 5. 18. 19:02

SOP (Same-Origin Policy)

https://developer.mozilla.org/en-US/docs/Web/Security/Same-origin_policy

  • 어떤 출처(Origin)에서 불러온 문서나 스크립트가 다른 출처에서 가져온 리소스와 상호작용하는 것을 제한하는 중요한 보안 방식
    • Origin이란, Protocol, Host, Port의 조합을 의미
    • 즉, 기본적으로 브라우저는 나의 서버가 아닌 다른 서버의 통신(요청/응답)을 제한
  • 서버가 아닌, 브라우저에 구현된 정책

 

CORS (Cross-Origin Resource Sharing)

  • 한 출처(Origin)에서 실행 중인 웹 애플리케이션이 다른 출처의 선택한 자원에 접근할 수 있는 권한을 부여하도록 브라우저에 알려주는 체제
  • 절차
    1. HTTP 요청의 헤더값에 Origin을 담에서 전송
    2. 응답의 헤더값에 Access-Controll-Allow-Origin에 '접근 가능한 출처(Origin)을 담아서 전송
    3. 브라우저에서 요청 헤더의 Origin과 응답 헤더의 Access-Controll-Allow-Origin 비교
  • 방식
    1. Simple Request
      • 위에 설명된 절차대로 다이렉트로 서버의 헤더값을 요청해서 Origin와 Access-Controll-Allow-Origin을 비교
      • 요청의 메소드는 GET, POST, HEAD만 가능
      • Accept, Accept-Language, Content-Language, Content-Type, DPR, Downlink, Save-Data, Viewport-Width, Width 헤더일 경우 에만 적용
      • Content-Type 헤더가 application/x-www-form-urlencoded, multipart/form-data, text/plain중 하나
        • 아닐 경우, PreFlight로 동작
    2. Preflight Request
      • 요청을 보내기 전에 OPTIONS 메서드로 서버에 예비 요청을 보내, 허용 가능한 메소드와 출처(Origin)를 확인 후 재요청
      • 통신의 횟수가 늘어남에 요청/응답 시간은 늘어날 가능성이 존재
        • 브라우저 캐시로 해결 가능 (Access-Control-Max-Age 설정)
    3. Credentialed Request
      • 자격인증정보(Credential)를 실어 요청할 때 사용되는 요청
        • 세션 ID가 포함된 쿠키
        • Authorization 헤더 값
      • 요청에 Credential에 대한 설정 필요
      • 응답헤더 설정 필요
        • Access-Control-Allow-Credentials : true
        • Access-Control-Allow-Origin는 와일드카드 문자(*) 사용 불가
        • Access-Control-Allow-Methods는 와일드카드 문자(*) 사용 불가
        • Access-Control-Allow-Headers는 와일드카드 문자(*) 사용 불가

 

CORS 이해하고 사용 해야 하는 이유

  • SOP에 의해 막혀진 리소스 공유는 CORS에 의해 허용 될 수 있으나, 출처(Origin) 비교는 브라우저에서 이루어지기 때문에, 하나의 Request에 의한 서버내부의 동작은 이미 다 끝난 후, Origin 체크가 이루어 질 수 있다. 따라서, 비교적 Request에서 안전한 GET, POST, HEAD 메소드의 경우는 Simple Request로 CORS처리가 이루어지고, 서버 내부에서 크리티컬한 영향이 갈 수 있는 DELETE, PUT과 같은 메소드는 Preflight Reuqest로 CORS 처리가 이루어진다.

 

 

참고

저작자표시