2.20 강의 Vercle 에 벡엔드 배포 후 미출력
안녕하세요.
강좌 잘 보고 있습니다.
다름이 아니라 vercel 에 onebite-books-server 를 배포하였습니다. 로컬에서는 작동을 확인하였습니다.
첫 화면은 잘 나오는데 /api 폴더로 접근시 화면에 swagger 가출력이 안되고 있네요. ㅠㅠ;
vercel 로그는 정상 배포 되었구요.
첫화면은 잘 나옵니다.
혹시 환경변수를 셋팅해야 하는가 해서 검토해 보았지만 필요없으시다고 하셔서 그냥 두었습니다.
에러 메시지는
콘솔창에
Failed to load resource: the server responded with a status of 404 ()
이런 메시지가 여러개 출력 중입니다.
확인좀 부탁드립니다.
감사합니다.
답변 2
0
안녕하세요 이정환입니다.
우선 이는 백엔드 서버가 서버리스 환경(Vercel)에 배포되어 발생하는 문제로 억수님의 설정에 문제가 있다거나 하지는 않다는 점 말씀드립니다. 해당 이슈는 서버리스 환경이 아닌 AWS EC2 등의 인스턴스 환경에서는 발생하지 않습니다.
이런 단점에도 강의에서 서버리스 환경으로 배포를 안내드리고 있는 이유는 AWS EC2로 안내드리면 누군가에게는 분명히 어려운 과정이 될 수 있기도 하고 또 과금 이슈가 발생할 수 있기 때문입니다. 물론 EC2의 프리티어를 활용하면 문제가되지 않을 수 있으나 고정된 백엔드 서버 주소를 위해 탄력적 IP를 설정하거나 HTTPS 설정을 위해 SSL 인증서를 발급하는 과정 등의 부가적인 설정들도 존재하여 과금이 발생하거나 시간이 오래 걸리는 문제가 발생할 수 있다고 생각했습니다.
따라서 Swagger 문서는 로컬 환경에서 확인해주시면 감사하겠습니다.
그럼에도 불편함이 있으실 수 있기에 지속적으로 해결할 수 있는 방법을 강구해보겠습니다. 해결되면 바로 알려드릴게요 감사합니다.
0
안녕하세요, 인프런 AI 인턴입니다. 억수님.
Vercel에 API 백엔드 서버를 배포하신 후 발생하는 404 에러에 대해 해결해드릴 수 있는 몇 가지 유사한 질문과 해결 방법을 안내드리겠습니다.
-
2.20) vercel에 프로젝트 배포 시 fetch failed 에러가 발생합니다
- 해결 방법 요약: Vercel에 배포시 발생하는 fetch 오류는 백엔드 서버의 배포 상태나 URL 설정 문제로 인한 것일 수 있습니다. 관련된 내용은 강의의 특정 시간대에 해결 방법이 설명되어 있으니 강의 영상을 참고해주세요.
- 해결 방법 요약: Vercel에 배포시 발생하는 fetch 오류는 백엔드 서버의 배포 상태나 URL 설정 문제로 인한 것일 수 있습니다. 관련된 내용은 강의의 특정 시간대에 해결 방법이 설명되어 있으니 강의 영상을 참고해주세요.
-
배포후 다이어리, 수정페이지 새로고침시 404에러
- 해결 방법 요약: 리액트 어플리케이션의 프런트엔드 라우팅 문제로 인한 404 에러는
vercel.json파일을 통해 설정을 추가하는 방법으로 해결할 수 있습니다. 이는 API 엔드포인트로의 요청이 제대로 이루어지지 않을 때도 유사한 접근법이 적용될 수 있습니다.
- 해결 방법 요약: 리액트 어플리케이션의 프런트엔드 라우팅 문제로 인한 404 에러는
-
local에서는 이상없이 되는데 vercel 배포 이후에 아무것도 없을 때가 보입니다
- 해결 방법 요약: 로딩 상태가 계속 유지되거나 데이터가 나타나지 않는 경우, 대부분의 원인은 클라이언트 사이드의 상태 관리 문제입니다. 해당 문제는 API 요청 후 상태를 업데이트하는 부분에서 놓친 부분이 있는지 확인해야 합니다.
- 해결 방법 요약: 로딩 상태가 계속 유지되거나 데이터가 나타나지 않는 경우, 대부분의 원인은 클라이언트 사이드의 상태 관리 문제입니다. 해당 문제는 API 요청 후 상태를 업데이트하는 부분에서 놓친 부분이 있는지 확인해야 합니다.
각각의 문제 해결 방법과 연관된 안내는 위 링크를 통해 확인하실 수 있습니다. 추가적으로, API 경로와 관련된 설정을 다시 한 번 점검해보시길 권장합니다.
저는 질문자님의 이해를 돕고자 지식공유자님의 기존 답변을 참고하여 유사한 답변 링크를 추천해드리고 있습니다.
현재 베타 기능으로 답변이 만족스럽지 않을 수 있는 점 양해 부탁드립니다. 🙏 추가적으로 궁금한 점이 있으시면, 이어서 질문해 주세요. 곧 지식공유자께서 답변해 주실 것입니다.
Next.js + Tanstack Query BFF 구조 질문
0
13
1
Next.js 사전렌더링 이해하기 부분
0
28
2
모달 관련 질문
0
34
3
렌더링 관련 질문
0
78
2
중복으로 하나의 api를 요청할 때 캐싱 옵션 통일화
0
62
2
라우트 세그먼트 옵션 강좌 노트에 사소한 제보 남깁니다.
0
60
2
SSR시 context에 params말고 query를 사용하면 안되나요?
0
73
2
npx prisma db push 시 에러가 뜹니다.
0
92
3
vercel 배포를 실패하였습니다.
0
97
3
Image 컴포넌트 사용시 브라우저 콘솔에 경고는 왜 뜨는걸까요?
0
55
2
getServerSideProps 함수와 SSR의 관계
0
76
6
없는 페이지인데 풀라우트캐시로 저장이 되는 이유가 궁금합니다
0
58
2
실제 프로젝트에서 SSR 사용에 관해서 질문드립니다.
0
112
2
일반적인 nextjs project architecture에 대하여..
0
86
2
2.14 Search에서 작성한건 static이긴하지만 CSR이 아닌가요?
0
71
2
배포 시 오류 발생
0
87
2
백엔드 서버 오류납니다.
0
81
2
취약점 제거시 nestjs 버전 문제가 생길까요?
0
89
1
eslint.config.mjs 내 rules 어떻게 설정 하나요?
0
103
1
[book]/[id]/page.tsx 모달 띄울 때 성능 하락 현상은 ReviewList를 불러오면서 발생하는 문제 같습니다.
0
60
2
빨간줄 설정
0
75
2
익스텐션 질문
0
58
1
강의 들으면서 궁금한 부분 질문드립니다.
0
109
1
서버 배포 에러입니다.
1
98
2