[Next.js] CORS 오류 및 프록시(Proxy) 설정

Proxy 설정 "next.config.js" 하단에 "redirects()" 부분에서 변경해주면 된다. "source"는 만약 사용자가 접근하는 URL 주소가 "/v1"이라면 프록시 시킨다. 즉, 사용자가 여러 페이지를 돌아다니다가 URL 주소가 "/v1"이 들어가 있다면, 아래의 "destination" 설정한 주소로 강제 프록시 된다. 뒤에 "/:path*"는 이하 주소 및 파라미터라고 보면 될것 같다. 아래 프록시 설정을 해주면 이제 실제 백엔드로 API 호출할 HTTP OR AXIOS에서 써주면 CORS 오류 없이 작동한다. module.exports = { ... async redirects() { return [ { source: '/v1/:path*', destination: `http://서버주소/:path*`, permanent: true, }, ] }, } 참고 링크 React와 Next.js의 Cors 에러 해결 (Proxy) BackEnd Developer가 ...