Network

[네트워크/HTTP]OPTIONS 메소드는 언제 사용할까?

a-몬드 2022. 7. 6. 09:04
반응형

아직 직접적으로 OPTION method를 사용해본적이 없다. HTTP를 공부하다 보니 OPSIONS는 보안상의 이유로 한번 확인했어야 한다는 생각이 든다.

HTTP 메소드

OPTIONS 요청은 언제 어디서 발생할까?

preflight 또는 OPTIONS요청은 브라우저가 서버에게 지원하는 옵션들을 미리 요청

허가된 요청만 전송하기 위한 보안상의 목적

 

CORS와 보안

  • 현재 웹페이지를 받은 서버와 다른 서버의 리소스를 요청할때 발생 
  • 웹사이트에서 악의적인 목적으로 외부로 정보를 보내거나 하는 등의 요청으로 보안상의 문제이다.
  • 브라우저에서 OPTIONS를 preflight하여 서버에서 허용하는 옵션을 미리 확인하고 허용되지 않은 요청은 405Error 발생시켜 실제 요청은 전송하지 않는다.

 

preflight Request란?

  • 클라이언트에서 요청하려는 URL이 외부 도메인일 경우, 웹브라우저에서 자체적으로 실행
  • 웹 브라우저에서는 실제 요청하려는 경로와 같은 URL에 대해 서버에 OPTIONS method로 사전 요청
  • 즉, 서버는 미리 실제 요청이 유효한지, 사전에 요청이 안전한지 확인
  • 실제 클라이언트 request전, OPTIONS메서드를 통해 발생
  • 모든 cross origin요청이 Preflight Reqeust를 발생시키는 것은 아니다.
  • cross origin요청에는 Simple reuqests, Preflighted requests, Request with credentials 등이 있는데 이중 Preflighted request만 OPTIONS메소드를 통해 요청을 확인

 

💚실제 동작

  1. 브라우저에서 method를 OPTIONS로 요청 전송
  2. OPTIONS를 받은 서버가 응답헤더에 허용하는 옵션(Access-Cotrol-Allow)을 포함해 전송
  3. 브라우저는 응답헤더 옵션을 확인해 허용되지 않는 요청을 504Error발생, 허용하는 경우 요청을 전송

 

OPTIONS요청 없애기

1. CORS상황이 되지 않도록 하는것 

웹서버와 동일한 서버의 리소스만 사용하는 것, 하지만 API서버가 분리되어 있는 경우가 많아 쉽지 않다.

웹서버와 동일한 서버에서 받아 실제 API서버로 전달하는 중계점을 두면 해결할 수 있다.

 

2. CORS에서 preflight가 발생하지 않는 조건을 모두 만족시키는 것(조건은 아래 더보기)

일반적으로 인증을 위한 헤더를 포함하거나, 최근에는 Content-Type으로 application/json을 사용하는 경우가 많아 적용하기는 어렵다

더보기

CORS상황에서 OPTIONS요청이 발생하지 않는 조건

1. GET, HEAD, POST 중 하나
2. user agent에 의해 자동 설정되는(Connection, User-Agent, Fetch, Forbidden header) 헤더외에 CORS-safelisted
3. reqeust-header로 명시된 헤더들만 포함된 경우 (Accept, Accept-Language, Content-Language, Content-type)
Content-Type은 application/x-www-form-urlencoded, multipart/form-data, text/pain만 허용

 

 

💙정리

OPTIONS 메소드는 브라우저에서 보안상 목적으로 주로 사용하고

OPTIONS에서 허용하는 메소드가 아닌 요청일 경우 브라우저에서 알아서 405error를 띄운 후 실제 request는 발생하지 않는다. 

 

CORS상황에서 OPTIONS를 preflight하여 서버에서 허용하는 옵션이 아닌경우 실제 request가 발생하지 않아 문제가 발생

통신하기 위해서는 웹서버와 동일한 서버에서 받아 실제 API서버로 전달하는 중계점(proxy server)같은 걸 두는 것이 가장 현실적인 해결책이다. 

 

출처

https://nukeguys.github.io/dev/options-request/

https://hanamon.kr/%EB%84%A4%ED%8A%B8%EC%9B%8C%ED%81%AC-http-options-%EB%A9%94%EC%86%8C%EB%93%9C%EB%A5%BC-%EC%93%B0%EB%8A%94-%EC%9D%B4%EC%9C%A0%EC%99%80-cors%EB%9E%80/

반응형