REACT proxy 수동 설정 - CORS

CORS Proxy 설정

 

npm 명령어로 http-proxy-middleware 를 설치한다.

npm install http-proxy-middleware // npm 사용 일 경우
yarn add http-proxy-middleware // yarn 사용 일 경우

 

setupProxy.js 파일을 src 밑에 생성 후 아래와 같이 프로젝트 proxy 설정을 커스터마이징 해준다.

const { createProxyMiddleware } = require('http-proxy-middleware');

module.exports = function(app) {
    app.use(
        '/api',
        createProxyMiddleware({
          target: 'http://localhost:5000', // 비지니스 서버 URL 설정
          changeOrigin: true,
        })
      );
};

changeOrigin 설정은 http-proxy 모듈의 설명과 같이 대상 서버 구성에 따라 호스트 헤더가 변경되도록 설정한다.