S3 버킷, Route53, CloudFront 연결해보기 + HTTPS통신 까지

- CloudFront와 Route53을 연결하기 위한 S3버킷 만들기

- 리전 꼭 잘 확인 하자 

- S3 글로벌, CloudFront 글로벌, ACM  버지니아 북부(SSL인증서), -EC2, 로드밸런서의 인증서는 서울로 가능한거같다.

- 정적파일은 S3에 올린다. 스크립트에 경로는 S3경로로 바꿈.

- S3에서 요청을 EC2 도메인으로 설정하면 될꺼같다.

 

ACM(AWS Certificate Manager) - 인증서 요청

구입한 도메인이 있어야함

요청선택 후 원하는 도메인 이름 넣기(example.com , *.example.com)

-> route53 레코드 생성 

그후 발급 될 때 까지 좀 걸림

S3(버킷 생성시 구입한 도메인 이름과 다르게 설정해야함)

1. 버킷생성 클릭

2. 이름 정하고 

(퍼블릭으로 만들었어도 무조건 프라이빗으로 되어있음)

3. 생성 후 권한에서 정책 편집 에서 정책 생성기 선택

(S3 bucket-> allow -> * -> getobject -> 버킷 ARN에서 복사한 ID가지고와서 Resource에 끝에 /* 넣고 붙혀넣기  statement클릭 -> generate policy 

4. 속성에서 정적웹사이트 호스팅에서 인덱스 문서 넣고 리액트 사용시에도 index.html넣어주기

5. 파일 업로드

Cloudfront - 배포 생성하기

원본도메인에 S3 버킷 넣기 (앤드포인트)

뷰어에 Redirect HTTP to HTTPS 선택

설정에 북미,유럽,아시아 선택

대체 도메인 설정 (www.example.com) <- 여기로 접속하면 S3로 이동

기본값 루트에서 메인html선택

** 새로운 파일을 바로 업그레이드 할 때에는 객체 무효화를 통해 진행 해주자

(CloudFront는 캐싱을 하기 때문에 24시간동안 이전의 정보가 보여진다.)

무효화 접속후 생성해서 /* 전체 무효화 시킬 수 있다.(일정 횟수 이후로 과금처리)

 

EC2 연결(로드 밸런서 미연결)

1. EC2생성

2. CloudFront 배포 클릭 -> ec2 퍼블릭 도메인 입력(ex: ec2-0-0-0-0.ap-northeast-2.compute.amazonaws.com)

->HTTP만 해당 -> Redirect HTTP to HTTPS, GET POST PUT -> CachingDisabled -> AllViewer->북미 유럽 아시아->

대체도메인(backend.routest.link 산 도메인 앞에 붙혀주면됨(여기로 요청하면 백앤드로 감) 생성

or

--무시--

S3 배포한 CloudFront 클릭 -> origin(원본)에서 원본생성

-> 원본 도메인에 ec2 퍼블릭 도메인 입력(ex: ec2-0-0-0-0.ap-northeast-2.compute.amazonaws.com)

-> HTTP만 해당 -> 추가 설정에 연결유지시간 60으로 맞춘후 생성

동작 -> 동작생성 -> 경로패턴에 /api 등 주소 입력 -> 원본 및 그룹에는 ec2 선택 -> Redirect HTTP to HTTPS -> CachingDisabled -> AllViewer -> 생성

--무시--

 

EC2 연결(로드밸런서로 연결)

1. EC2생성

 

2. 대상그룹생성 -> 인스턴스, 이름, HTTP 80, HTTP1, HealthChecks 기본값 다음 누르고 사용할 EC2인스턴스 클릭 후 

아래 보류로 포함 선택 -> 만들기

 

3. EC2 로드밸런서 클릭 & 생성 ->  Application Load Balancer 생성 -> 이름, 인터넷연결, IPv4, Mapping(몇개 까지 사용할꺼냐?)2~4개 체크 -> 보안그룹은 EC2인스턴스에 연결한 보안그룹 선택 -> HTTP 80 만들어둔 대상그룹 선택 -> 생성

 

4.CloudFront 배포 생성 -> 원본 도메인(로드 밸런서), Redirect HTTP to HTTPS, GET POST PUT, 북미 유럽 아시아 중동 , 대체 도메인 적고, ssl인증서 등록 

 

5. Route53 -> 호스팅 영역 -> 레코드 생성 ->CloudFront에서 적은 도메인, 별칭 CloudFront 선택 후 생성해둔거 선택후 만들기 -> 시간이 지나면 HTTPS 연결 완료

*Get요청은 CloudFront에서 설정한 도메인으로 요청가능 하지만 작성 수정 삭제는 불가능(EC2도메인으로 해야함)

 

Route53

클라우드 프론트에서 대체 도메인설정시 Route53도 같은 도메인 적어야지 클라우드프론트 주소를 끌어올 수 있음

 

라우터53에서 도메인 구입 후 진행 할 때

certificate manager에 들어가서 인증서 요청하기 -> 구매해둔 도메인 적기(ex. example.com,*.example.com)

인증서 클릭 후 route53에서 레코드 생성(시간 지난 후 발급 완료)

cloudfront들어가서 편집하기 선택후 인증서 등록 후

route53에서 원하는 도메인주소 설정 후 cloudfront주소 끌어오면 설정 완료.

 

다른 도메인 사이트에서 구매 후 사용 할 때(ex.가비아)

 

Route53에서 호스트 영역 생성 해준다.

생성 후 나오는 네임서버 전부를 가비아의 도메인 통합 관리 툴에서 넣어준다.(ex. ns-927.awsdns-548.net)

(적용되기까지 1~2일 정도 소요 될 수도 있음)

certificate manager에 들어가서 인증서 요청하기 -> 구매해둔 도메인 적기(ex. example.com,*.example.com)

인증서 클릭 후 route53에서 레코드 생성(시간 지난 후 발급 완료)

cloudfront들어가서 편집하기 선택후 인증서 등록 후

route53에서 원하는 도메인주소 설정 (www.ex.com OR *.ex.com) -> cloudfront주소 끌어오면 설정 완료.

가비아와서 DNS설정에 타입 CNAME,  호스트 aws, 값 발급받은CNAME값 넣어주면 됨

 

IAM에서 CloudFront S3설정

사용자 추가 누른뒤 -> 이름,엑세스키 방식 -> 기존정책 직접연결 클릭  AmazonS3FullAccess,CloudFrontFullAccess 검색 후 추가 하기 그리고 엑세스키 ID와 비밀 엑세스키 복사해서 사용(따로 저장해놔두됨)

 

S3 CORS오류 뜰때(버킷에 권한 맨 아래에 CORS 편집 후 붙혀넣기)

[
    {
        "AllowedHeaders": [
            "*"
        ],
        "AllowedMethods": [
            "HEAD",
            "GET",
            "POST"
        ],
        "AllowedOrigins": [
            "*"
        ],
        "ExposeHeaders": [
            "ETag"
        ]
    }
]