이번에 aws 계정을 변경하면서 프론트서버를 재배포하게 되었다.
해야할 것들부터 정리해보자.
- 지속적인 운영을 위한 프로덕트 서버 배포
- 서비스 운영에 관계없이 개발에 집중을 하기위한 개발 서버 배포
- Rout53으로 가비아 연결하기
빌드 파일 저장은 s3 스토리지를 이용한다. 왜 ? 이전 기록 삭제하고 다시 빌드 올리기가 쉽기 때문이다.
1. S3 버킷 생성
버킷 만들기 클릭
아래 화면에서 s3 버킷 쓰임에 따라 내용을 작성한 후 버킷을 생성한다.
- 버킷 이름 : 해당 버킷이 어떤 역할을하는지 알아볼 수 있는 이름 작성한다.
- 기존 버킷에서 설정 복사 : 이전에 설정한 버킷과 같은 설정을 하고 싶다면
버킷 선택을 눌러 가져오고 싶은 설정의 버킷을 선택하여 세팅할 수 있다. - 객체 소유권 : 다른 aws 계정에서 해당 버킷을 이용하게 할 경우 ACL 활성화를 하면 되지만 해당 버킷을 생성하고 있는 계정에서만 쓸 경우에는 비활성화를 선택하면 된다.
- 퍼블릭 엑세스 차단 설정 : 바로 S3로 접속을 할 경우에는
모든 퍼블릭 액세스 차단을 해제한 후 아해 개별 설정을 해줘야하지만 현재는 cloudfront를 이용해 배포를 할 것이기 때문에 기본 값이모든 퍼블릭 액세스 차단에 체크를해두면 된다. - 버킷 버전 관리 : 해당 프로젝트는 실사용자가 있어 무분별한 기능 업데이트보다는 버전으로 관리될 예정이므로 혹시 모를 일을 대비해 버전 관리
활성화에 체크하였다. 딱히 버전관리가 필요없다면비활성화에 체크하면 된다.
- 기본 암호화 : 딱히 키별로 관리할 용도의 버킷이 아니기 때문에 기본값인
SSE-S3로 체크하였다. - 고급 설정 - 객체 잠금: 여러 명이 함께하는 프로젝트라면 객체잠금을 하겠지만, 현재 프론트가 혼자인 관계로 딱히 설정하지 않았다.
여기까지하면 버킷 만들기 클릭.
개발서버는 앞에 dev, 운영서버는 product를 붙여 구분하였다.
s3 파일 업로드하는 방법은 간단하다. 업로드 부분에 파일을 드래그하거나 업로드 버튼을 눌러 추가하면 된다.
s3만으로 정적 호스팅을 하려면 aws 속성 설정 > 맨 하단의 정적 웹 사이트 호스팅 활성화를 켜면 된다.
cloudfront로 배포를 할 것이기 때문에 비활성화 상태로 둔다.
인덱스 문서와 오류 문서 둘다 index.html로 설정한다.
2. cloudfront 생성
생성된 s3버킷을 origin domain으로 두고 cloudfront를 생성한다.
나머지 설정들
- 기본 캐시 동작은 본인 프로젝트에 맞춰 설정해주면 되는데 서버측과 얘기한 후 HTTP and HTTPS로 할지 Redirect HTTP to HTTPS할지 정하면 된다.
쭉 이미지를 따라 설정하다가 인증서 설정이 나오는데
마지막으로 배포 생성 누르면 cloudfront 생성 끝. 가비아나 구매한 url을 연결해주려면 생성 후 cname 등록을 해주어야한다.
3. S3 버킷 정책 수정하기
생성하고 난 후에 뜬 알림문의 정책 복사 후 s3 버킷 권한으로 이동한다.
아래 정책 부분에 복사한 정책을 붙여넣은 후 변경사항 저장을 눌러주자.
다시 클라우드 프론트로 돌아와 배포 url을 확인하면 배포가 잘 되었는지 확인할 수 있다.
오류 페이지 등록
cloudfront에서 페이지를 접속했을 때 403 Forbidden이 뜰 경우 리다이렉트해줄 파일을 선택할 수 있다.
403으로 뜰 경우 index.html 기본 폴더로 리다이렉트되게 설정하였다.
4. CNAME 등록하기
미리 가비아에 구매해둔 도메인을 등록하기 위해 가비아 페이지에서 cname을 등록해주자. 등록해서 바로 적용되는 것이 아닌 짧게는 15분~1시간 길게는 하루 반나절 정도 걸리니, cloudfront 배포 후 바로 등록해주는 것이 좋다.
자세한 내용을 따로 먼저 s3 cloudfront 배포후 추가 포스팅 첨부예정이다.
S3 버킷 정적 호스팅 활성화
S3 get Object 설정
Rout53으로 cname 등록
