Proxy

Proxy

---

 

CORS 정책이 필요한 이유

다른 도메인에서 API를 요청해서 사용할 수 있게 해 주려면 CORS 설정이 필요합니다.

 

만일 실제 서비스가 되는 상용 앱을 운영 중이라면, 구축한 클라이언트 뒤의 서버와 연결되어 있는 DB에는 라이브 데이터가 쌓일 것입니다. 이런 라이브 데이터는 민감성이 높은 데이터들이 위주이기 때문에 보안이 무엇보다 중요합니다. 그러나 여러분들의 서비스 및 프로젝트가 모든 출처의 접근을 허락한다면 이러한 보안성이 현저히 낮아지고, 해킹의 위험에 그대로 노출되게 됩니다.

 

따라서 모든 도메인을 허용해서는 안 되고, 특정 도메인을 허용하도록 구현해야 합니다.

 

---

 

Proxy

React 라이브러리, 혹은 Webpack Dev Server에서 제공하는 proxy 기능을 사용하면 CORS 정책을 우회할 수 있습니다.

 

이는 별도의 응답 헤더를 받을 필요 없이 브라우저는 React 앱으로 데이터를 요청하고, 해당 요청을 백엔드로 전달하게 됩니다. 여기서 React 앱이 서버로부터 받은 응답 데이터를 다시 브라우저로 전달하는 방법을 쓰기 때문에 브라우저는 CORS 정책을 위반했는지 모르게 됩니다. 브라우저를 proxy 기능을 통해 속이는 것입니다.

 

코드스테이츠 강의자료 중

 

프록시 서버의 기능

• 캐시 수행
  • 서버에서 받은 응답을 캐시에 저장합니다. 만약 클라이언트에서 같은 요청을 보낼 시 저장해뒀던 응답을 바로 전달합니다.
  • 불필요한 네트워크 요청을 줄일 수 있습니다. 속도가 조금 향상되는 효과가 있습니다.
• 보안 기능 수행
  • 클라이언트의 IP 주소를 숨깁니다.
  • 서버로부터 오는 응답 등을 필터링합니다.