AWS로 도메인 구매후 https 배포하기

j moon·2022년 8월 21일

ACM 인증 대기 중 AWS S3 AWS 배포 S3 acm aws certificate manager cloudfront route53

AWS로 도메인 구매후 https 배포하기

순서

Route53 도메인 구매 및 호스팅 영역 등록
Certificate Manager ACM 인증서 등록(https를 사용하기 위함)
S3 버킷에 소스 올리기
CloudFront 에 S3 연동하기
CloudFront 와 Route53 연동하기

1. Route53 도메인 구매 및 호스팅 영역 등록

Route 53 에서 도메인 구매

도메인 등록에서 사용할 도메인을 구매 해준다.

호스팅 영역 등록

이미 생성되어 있으면 안해도됨

호스팅 역영으로 들어가 호스팅 영역 생성 버튼을 눌러준다.

구매한 도메인을 1번 박스에 적어주고 호스팅 영역 생성 버튼을 눌러준다.

도메인 이름을 눌러준다.

여기 있는 4가지 NS와 처음 구매했을때의 도메인의 NS가 같아야 한다. 같지않으면 후에 문제가 생김

도메인 구매 후 이메일로 인증을 하지 않았다면 등록 연락처 옆에 확인 완료 가 아닌 주황색 으로 등록 대기 중? 이렇게 뜨는데 이메일 인증을 하면 초록색으로 확인 완료로 바뀌게된다. << 이 과정도 꼭 필요함

2번 이름 서버 추가 또는 삽입을 누르게되면

이런 화면이 나오는데 등록한 호스팅 영역에 적혀있던 4가지 NS를 적어주고 업데이트를 누르면된다.

2. Certificate Manager ACM 인증서 등록(https를 사용하기 위함)

우측 상단에 미국 동부(버지니아 북부) us-east-1 선택

인증서 요청 클릭!

요청이 완료됬다면 왼쪽 햄버거 메뉴에서 인증서 나열을 누르고 요청된 인증서로 들어가준다

Route 53에서 레코드 생성 클릭

레코드 생성을 누르면

호스팅 영역 에서

맨 아래에 추가 되는것을 볼 수 있다.

이후 10분 정도 기다려주면

상태가 발급됨 으로 바뀜

검증 대기 중 에서 10몇시간 동안 안 바뀌어서 문제의 원인을 찾아 봤는데
1. Route53 도메인 구매 및 호스팅 영역 등록에서

도메인 등록 확인 (인증)
NS 일치 시켜주기

나의 경우에는 이 2가지가 원인 이었다.

S3 버킷에 소스 올리기

AWS S3로 들어가서 버킷만들기를 클릭해준다.

나머지는 그대로 나두고 버킷을 만들어준다.

업로드를 눌러 파일이나 폴더를 업로드 해주면 되는데

나의 경우 리액트의 npm run build 했을때 생성되는 build 폴더 안의 내용을 전부 넣어줬다

build 폴더를 넣어주는것이 아님

권한 탭을 눌러

편집을 눌러준다

정책 생성기 클릭 (주황색 박스 = ARN 아래 과정에서 필요함 복사하면됨)

완료 되었다면 Add Sataement 버튼 클릭

아래에 Generate Policy 클릭

{
  "Id": "Policy1661082462158",
  "Version": "2012-10-17",
  "Statement": [
    {
      "Sid": "Stmt1661082431454",
      "Action": [
        "s3:GetObject"
      ],
      "Effect": "Allow",
      "Resource": "arn:aws:s3:::버킷이름",
      "Principal": "*"
    }
  ]
}

이런 제이슨 코드가 나올텐데 복사 해서

빨간 박스 안에 붙여 넣기 해준다

그리고 위에 JSON에서

 "Resource": "arn:aws:s3:::버킷이름",

여기 부분을

"Resource": "arn:aws:s3:::버킷이름/*",

버킷이름 뒤에 /* 을 추가해주고 변경 사항 저장

버킷 정책 설정 끝

다음 권한 탭 내부의객체 소유권 설정

편집 을 눌러준다

ACL 활성화 눌러주고 변경 사항 저장

속성 탭으로 이동

맨 아래의

정적 웹 사이트 호스팅 편집

바꿔 주고 변경 사항 저장 (오류문서 없다면 입력 안해도됨)

빨간 박스의 링크를 눌러주면 배포했던 사이트가 나온다.

4. CloudFront 에 S3 연동하기

우측 상단에 미국 동부(버지니아 북부) us-east-1 선택

배포 생성하기

원본 도메인 선택에 우리가 바로 위의 S3 버킷에 설정했던

정적 웹 사이트 호스팅 주소를 복붙 해준다.
ex) 도메인/s3-website.ap-northeast-2.amazonaws.com

쭉쭉쭉 내리다가 사용자 정의 SSL 인증서 부분

[2번 에서 했던 ACM 인증서]가 정상적으로 발급 완료 되었다면 셀렉트 박스에 표시된다.

선택해주고 배포생성

5. CloudFront 와 Route53 연동하기

Route 53 호스팅 영역에서 레코드 생성하기

배포 선택 부분에 CloudFront에서

배포 도메인을 복붙 해준다

이후 레코드 생성

이제 브라우저에서 구매한 도메인을 입력하고 엔터 하면!

403 error the request could not be satisfied 에러가 난다.

원인1 - 요청이 HTTP를 통해 시작되었지만 CloudFront 배포가 HTTPS 요청만 허용하도록 구성되었습니다.
원인2 - 요청된 대체 도메인 이름(CNAME)이 CloudFront 배포에 연결되지 않았습니다.
해결방법 - https://aws.amazon.com/ko/premiumsupport/knowledge-center/resolve-cloudfront-bad-request-error/

한마디로 CloudFront 에서