[Pre Project] Day 13 : 프로젝트 배포

기여한 내용

 

배포 시 발생한 CORS 이슈 해결

 

---

 

새롭게 배운 내용

 

AWS EC2로 Spring Boot 서버를 배포하는 흐름

 

보강할 내용

 

· 서버 배포의 개념과 방법
· CORS

 

회고

 

  오늘은 Stack Overflow 사이트를 클론 코딩 한 프리 프로젝트의 배포일이다. 배포는 다른 백엔드 팀원이 맡아 주셨고, 오전 중에 백엔드, 프론트엔드 양측 서버의 배포가 완료되었지만, 프로젝트 이전까지 학습을 해 오면서 보안 파트 다음으로 배포 과정이 어렵게 느껴졌었기에 과정에 대한 설명을 요청드려 정리했다.

먼저 백엔드 서버는 어느 정도 API 개발이 완료된 이후부터 AWS의 EC2를 통해 배포해 왔었다. 인스턴스(ubuntu) 내에서 git clone을 통해 빌드 과정을 거치지 않고, 인텔리제이에서 빌드를 하여 생성된 WAR 파일을 인스턴스 내로 이동시켰다. 이때 FileZilla 프로그램으로 SFTP 프로토콜을 사용하고, 호스트를 EC2 인스턴스 주소로 해서 이동시킨다.

터미널에서 EC2 인스턴스에 접속하려면 ssh -i [키파일] ubuntu@[인스턴스 주소]를 입력하면 된다. 접속한 인스턴스에 open-jdk 11 버전을 설치하고, java -jar pre30-SNAPSHOT.war를 입력하면 서버가 돌아간다.

프론트엔드 서버를 배포하기 위해서는 AWS의 S3를 이용했다. 학습을 할 땐 EC2 내에서 S3 주소를 설정했었는데, IAM 역할 권한 만으로 연결이 돼서 배포가 되었다. 이 부분은 아직 확실하게 이해하지 못해서 더 공부를 해야겠다.

📚 참고: https://vlee.kr/4765

EC2와 S3를 연결할 때 또 위와 같은 CORS 에러가 발생했다. 'Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource' 이 문장을 보고 WebConfig 클래스의 CORS 설정에서 .allowedOriginPatterns(...)을 localhost:3000으로 지정해 둔 게 생각이 나서 와일드 카드로 바꾸니 배포가 성공적으로 됐다! preflight에서는 와일드 카드를 사용하지 않아야 한다고 봤는데... 무엇일까... ^^... 다행히 이전에 CORS에 대해 정리해 둬서 쉽게 에러의 원인을 파악했지만 부족한 개념을 다시 채워 넣어야겠다.

 

★★★★★