증상:
- 프론트엔드 (Vercel):
https://studiz-fe.vercel.app/(HTTPS) - 백엔드 (EC2):
http://3.27.86.20:8080(HTTP) - 브라우저가 HTTPS 페이지에서 HTTP API 호출을 차단
해결 방법:
Vercel 환경 변수 설정:
NEXT_PUBLIC_API_URL=http://3.27.86.20:8080/api
프론트엔드 코드에서:
// 개발 환경에서는 HTTP 허용
const API_URL = process.env.NEXT_PUBLIC_API_URL || 'http://3.27.86.20:8080/api';주의: 이 방법은 브라우저가 여전히 차단할 수 있습니다.
- Nginx 리버스 프록시 설정
- Let's Encrypt SSL 인증서 발급
- 포트 443으로 HTTPS 제공
자세한 내용은 deploy/ 디렉토리의 스크립트 참고.
- 도메인 구매 (예: studiz-api.com)
- EC2에 Elastic IP 할당
- DNS A 레코드 설정
- SSL 인증서 발급
- 프론트엔드 API URL을
https://api.studiz.com으로 변경
# 서버 연결 확인
./deploy/check-server.sh
# 또는 직접 확인
curl http://3.27.86.20:8080/api/# 빌드
./gradlew clean build -x test
# 배포
./deploy/ec2-deploy.sh