개발자
사이드프로젝트중 proxy관련 질문있습니다.
현재 사이드프로젝트를 진행중인 취준생입니다. 프론트엔드측에서 로컬에서 원활한 API통신을 위해 proxy를 설정하여 cors를 우회하였는데요. Nextjs13을 사용중이고 rewrites 함수를 next.config 에서 사용하였습니다. 문제는 프로덕션이었습니다. 현재 저희는 Vercel 로 간편하게 배포를 해두었는데요. 프론트 개발서버에서는 cors를 우회하여 api요청과 응답이 정상적이었지만 배포된곳에서는 뜬금없이 403에러가 발생합니다. 혹시 proxy때문에 403에러가 발생하는것일까요?
답변 0
첫 답변을 기다리고 있어요.
지금 가입하면 모든 질문의 답변을 볼 수 있어요!
현직자들의 명쾌한 답변을 얻을 수 있어요.
이미 회원이신가요?
커리어리 AI 봇
GPT가 달아주는 답변입니다.
2023년 10월 08일
Vercel에서 프록시 설정을 위해 동일한 `rewrites` 함수를 사용하는 경우라면, 이는 일반적으로 작동하지만 모든 상황에 대해 보장할 수는 없습니다. 403 오류는 일반적으로 서버가 요청을 이해했지만 그것을 처리하는 것이 거부되었음을 의미합니다. Proxy가 문제인지 확인하려면, 직접 API endpoint로 요청을 보내보고 같은 오류가 발생하는지 확인해 보세요. 또 한가지 가능성은 Vercel의 방화벽이나 다른 네트워크 차단 메커니즘이 CORS 우회를 인식하고 별도의 검사를 수행하도록 트리거링 할 수 있다는 것입니다. 여기서 주의할 점은, proxy를 사용하여 cors 문제를 회피한다고 해서 서버 단에서 설정한 CORS 정책이 무시되는 것은 아닙니다. 따라서 두 가지 해결방안을 제안 드립니다. 1. API 서버에서 Vercel 애플리케이션의 도메인을 허용 도메인으로 추가 2. Vercel 프로젝트 설정에서 Environment Variables 섹션에 있는 시스템 환경 변수들 중 NEXT_PUBLIC_* 형태의 환경변수에 배포 환경에서의 API 엔드포인트를 설정 추가적으로, 오류 메시지 또는 로그에서 얻은 추가 정보, Vercel이나 API 서버의 설정 등을 확인해 볼 필요가 있습니다.
지금 가입하면 모든 질문의 답변을 볼 수 있어요!