개발자
Nextjs proxy 백엔드협업 질문드립니다.
현재 nextjs config 를 통해 rewrites 함수를통해 proxy를 설정하여 cors를해결하여 백엔드와 통신하고있습니다. 그러나 CHAT/8 이라는 특정페이지에 접속하면 whitelabel error 가 발생합니다. 이런경우 어떻게 해야할까요..? 갈피를 전혀잡지못하겠습니다. 해당에러는 api를 이상한주소로 요청하면 스프링에서 내뱉는 에러라고 알고있는데... ㅠㅠ async rewrites() { return [ { source: '/:path*', destination: `백엔드api주소/:path*`, }, ]; }, 이렇게 config가 설정되어있습니다.. 원인이 백엔드주소/chat/8 이렇게 요청을보냈는데 백엔드에는 없는api여서 내뱉는 에러인걸까요? 그렇다면 프론트쪽에선 채팅방ID를 chat?id=8 이런식으로 url라우팅을 바꿔야 하는걸까요?
답변 1
우선 어느 쪽에 문제인지는 테스트를 해보세요. API를 테스트를 할 수있는 툴(크롬 확장프로그램이 많이 있습니다)로 백앤드 API주소/CHAT/8을 를 직접 호출 해 보세요. 거기서도 동일하게 에러가 나온다면, 백앤드쪽에서 발생하는 문제이니 백앤드에서 수정하면 될 것이고, 정상 응답이 온다면 프론트쪽에서 디버깅을 해야 할 것 같네요.
지금 가입하면 모든 질문의 답변을 볼 수 있어요!
현직자들의 명쾌한 답변을 얻을 수 있어요.
이미 회원이신가요?
커리어리 AI 봇
GPT가 달아주는 답변입니다.
2023년 10월 06일
Whitelabel error는 일반적으로 백엔드에서 경로를 제대로 찾지 못하고 있는 경우에 발생합니다. 해당 문제는 Next.js의 rewrites 설정이 잘못되었을 수 있으므로 체크해보시는 것이 좋습니다. 다음은 기본적인 rewrite 설정 예제입니다: ```js module.exports = { async rewrites() { return [ { source: '/api/:path*', destination: 'http://localhost:4000/:path*' // 백엔드 API 주소 }, ] }, } ``` 위의 예제에서, 모든 `/api` 경로는 `http://localhost:4000` 주소로 리디렉션됩니다. 따라서, 만약 백엔드 서버가 `http://localhost:4000`에 위치하고 있다면, `/api/chat/8` 경로는 `http://localhost:4000/chat/8`으로 연결될 것입니다. 문제가 생긴다면 이런 부분들을 확인해봐야 합니다: 1. rewrites 설정이 올바른지: source와 destination경로가 올바르게 설정되어 있는지 다시 한 번 확인해보세요. 2. 백엔드 API주소가 정확한지: Destination 주소부분에 입력된 백엔드 서버 주소가 올바르게 작성되어 있는지 확인하세요. 3. 백엔드 API 경로가 존재하는지: 요청하려는 페이지(여기서는 `/chat/8`)가 실제로 백엔드에서 지원하는 경로인지 확인해보세요. 이 세가지를 모두 확인했음에도 동일한 문제가 발생한다면, 구체적인 에러 메시지나 백엔드 설정(특히 Spring에서의 Controller나 Route 설정)을 다시 한 번 체크해볼 필요가 있습니다.
지금 가입하면 모든 질문의 답변을 볼 수 있어요!