CORS

[점프 투 파이썬] 1-07에서 CORS 정책에 의해 API를 제대로 호출하지 못하고 요청이 거부된다.

CORS 예외 URL을 등록하여 해결하는데, CORS란 무엇인가?

 

CORS(Cross-Origin Resource Sharing)

• 브라우저 단에서 작동. 
• 한 출처(도메인, 프로토콜, 포트)에서 실행 중인 웹 애플리케이션이 다른 출처의 자원에 접근할 때 교차 출처 HTTP 요청 및 보안 이슈 발생.
• 웹 서버가 추가 HTTP 헤더를 반환하여 자원 접근 권한을 부여하도록 브라우저에서 알려주는 체제.
  • 특정 출처에서만 요청을 허용하도록 설정 가능.
  • 보안을 위해 최소한의 CORS 허용 권장.
• 서버는 클라이언트에게 요청에 인증정보(쿠키, HTTP 인증)를 포함하도록 요구할 수 있음.

 

preflight(사전 전달)

• GET을 제외한 HTTP 요청 메서드는 브라우저가 OPTIONS 메서드로 preflight하여 지원하는 메서드를 요청하고, 서버의 허가를 받으면 실제 요청 전송.
• OPTIONS 요청에 Access-Control-Request-*(Method, Headers) 사용자 정의 헤더를 설정.
• 서버 응답
  • Access-Control-Allow-Origin : 리소스 접근 허용 도메인.
  • Access-Control-Allow-Method : 리소스를 쿼리하는 데 허용된 메서드(Allow 응답 헤더와 유사하지만 접근 제어 컨텍스트 내에서 엄격하게 사용) 목록.
  • Access-Control-Allow-Headers : 실제 요청에 사용할 수 있도록 허가한 사용자 정의 헤더 목록.
  • Access-Control-Max-Age : 다른 preflight request를 보내지 않고 preflight request에 대한 응답을 캐시할 수 있는 시간(초). 각 브라우저의 최대 캐싱 시간은 Access-Control-Max-Age가 클수록 우선순위가 높다.
• 본래 preflighted request 후 리다이렉트가 필요했지만, 필요없도록 변경됐음에도 모든 브라우저가 변경 사항을 구현하지는 않았기 때문에 본래 필요한 동작이 발생하여 해결해야 한다.
  
  • 서버측 동작 변경.
  • preflight가 불필요한 simple request가 되도록 요청 변경.
  • Fetch API 의 Response.url 또는 XMLHttpRequest.responseURL을 사용하여 simple request를 작성하고 이를 통해 얻은 URL로 또 다른 실제 요청 생성.
  • withCredentals 옵션 설정 및 자격 증명을 포함하여 요청.

 

결론

[점프 투 파이썬] 1-07에서 설정한 건 백엔드 서버(FastAPI)는 "http://127.0.0.1:8000"이지만 웹 Svelte 서버는 "http://localhost:5173"이므로 출처가 다르기 때문에 CORS 정책에 위배된다.

따라서 FastAPI 설정에서 Svelte 서버의 주소를 추가하여 백엔드 서버의 리소스에 접근할 수 있도록 허용한 것이다.

 

 

이렇게 적어보긴 했는데 대충은 뭔지 알겠지만 아직도 모르는 게 아주 많은 것 같다.

좀 더 성장 후 다시 보충해야겠다.