Sprint - 도메인 연결과 CDN 및 HTTPS 적용

# 학습 목표

• HTTPS로 웹 애플리케이션을 배포
• CloudFront, Certificate Manager, Elastic Load Balancer, Route53 등의 서비스에 대해서 이해
• 모든 테스트를 통과하고, 제출해

 

# 해결 과제

HTTPS를 적용하기 위해서는 어떤 아키텍처와 어떤 AWS 서비스가 필요한지 구상

• 구상한 내용을 draw.io 등을 이용해 다이어그램으로 그리고, 해당 이미지파일을 S3에 httpsdiagram 이라는 이름으로 업로드
• 이때 해당 객체에 대한 퍼블릭 액세스를 허용해야 테스트를 통과

• .env파일에 HTTPS 적용을 위한 환경설정으로 적절하게 작성
• npm run test2 명령을 사용해 테스트가 통과하는지 확인
• 실제로 웹 애플리케이션이 브라우저 상에서 HTTPS 프로토콜로 작동하는지 확인

 

# 실습 자료

Repository

 

# 과제 항목별 진행 상황

✏️ 1. Certificate Manager를 통한 도메인 인증서 발급

Step 1 : Route 53에서 도메인 구매

- 도메인 선택 후 장바구니 추가 (도메인 가격 참고)

- 도메인에 대한 연락처 입력

- 도메인 옵션 선택 후 주문

- 주문 완료 내용 및 도메인 등록 진행 (이메일 인증 받아야 함, 시간 소요)

 

Step 2 : 구매한 도메인을 기준으로 인증서를 발급 받기

- 인증서는 프론트엔드 ①Cloudfront 사용 리전인 us-east-1과 ②백엔드 Load Balancer 사용리전인 ap-northeast-2에서 발급

 

콘솔에서 DNS 검증

- https://console.aws.amazon.com/acm/에서 ACM 콘솔열어 인증서 요청에서 퍼블릭 인증서 > DNS 검증으로 요청

※ 주의 : 도메인명을 기입할 때 wildcard로 기입할 수 있으며 (ex. *.example.com), 만일 정확히 입력한다면 정확히 매칭되는 도메인에만 인증서가 발급됨 

- 인증서 목록에서 검증 보류 중(Pending validation) 상태인 구성하려는 인증서 ID(Certificate ID)를 선택

- 도메인(Domains) 섹션에서 Route 53 검증 선택

- Route 53에 레코드 생성(Create record in Route 53) 버튼을 선택한 다음 레코드 생성(Create records)을 선택

- 인증서 상태(Certificate status) 페이지가 DNS 레코드가 생성됨(Successfully created DNS records)이라고 표시되는 상태 배너와 함께 오픈되며 새 인증서의 상태가 최대 30분 동안 계속 검증 보류 중(Pending validation)으로 표시 가능

 

 

✏️ 2. 백엔드 HTTPS 적용

Step 1 :  대상 그룹(target group)을 등록

1. https://console.aws.amazon.com/ec2/에서 Amazon EC2 콘솔에서서  탐색 창의 Load Balancing 아래에서 Target Groups를 선택

2. [Create target group]을 선택

3. 기본 구성(Basic configuration) 아래에서 대상 유형(Target type)을 인스턴스로 유지

4. 대상 그룹 이름(Target group name)에 새로운 대상 그룹의 이름을 입력

5. 기본 프로토콜(HTTP) 및 포트(80)를 유지

6. 사용자의 인스턴스를 포함하는 VPC를 선택하고 프로토콜 버전을 HTTP1로 유지

7. Health checks(상태 확인)에는 기본 설정

8. 다음(Next)을 선택

9. 대상 등록(Register Targets) 페이지에서 다음 단계를 완료. 로드 밸런서를 생성하기 위한 선택적 단계, 로드 밸런서를 테스트하고 대상으로 트래픽을 라우팅하고 있는지 확인하려면 대상을 등록해야 함

10. 사용 가능한 인스턴스(Available instance)에서 인스턴스를 하나 이상 선택

11. 기본 포트 80을 유지하고 아래에서 보류 중인 것으로 포함(Include as pending below)을 선택

12. [Create target group]을 선택

 

Step 2 : 로드밸런서(Application Load Balancer) 생성

로드 밸런서 유형 선택

1. https://console.aws.amazon.com/ec2/(Amazon EC2 콘솔)의 탐색 모음에서 로드 밸런서의 리전을 선택 EC2 인스턴스에 사용한 리전과 동일한 리전을 선택

2. 탐색 창의 Load Balancing에서 로드 밸런서를 선택

3. 로드 밸런서 생성(Create Load Balancer) 선택

4. Application Load Balancer에서 생성을 선택

 

로드 밸런서 및 리스너 구성

1. 로드 밸런서 이름(Load Balancer name)에 로드 밸런서의 이름을 입력. 예: my-alb.

2. [Scheme] 및 [IP address type]은 기본값으로 유지

3. 네트워크 매핑(Network mapping)에서 EC2 인스턴스에 사용한 VPC를 선택

- 2개 이상의 가용 영역과 영역당 1개의 서브넷을 선택

- EC2 인스턴스를 시작할 때 사용한 각 가용 영역에서 가용 영역을 선택한 후 해당 가용 영역에 대한 하나의 퍼블릭 서브넷을 선택

3. 보안 그룹의 경우 이전 단계에서 선택한 VPC의 기본 보안 그룹을 선택(보안 그룹은 로드 밸런서가 리스너 포트 및 상태 확인 포트에서 등록된 대상과 통신하는 것을 허용하는 규칙이 포함되어야 함)

4. 리스너 및 라우팅(Listeners and routing)에 대해 기본 프로토콜과 포트를 유지하고 목록에서 대상 그룹을 선택

- HTTP 리스너 선택

- HTTPS 리스너 선택

5. 기본 작업(Default action)에 타겟 그룹 구성에서 생성하고 등록한 대상 그룹을 선택

6. 구성을 검토하고 로드 밸런서 생성(Create load balancer)을 선택

 

로드 밸런서 테스트

1. 로드 밸런서가 생성되었다는 통보를 받은 후 [Close]를 선택

2. 탐색 창의 Load Balancing 아래에서 Target Groups를 선택하고 새로 생성한 대상 그룹을 선택

4. [Targets]를 선택하고 인스턴스가 준비되었는지 확인. (healthy 상태여야 테스트 가능, unhealthy 관련 레퍼런스)

5. 탐색 창의 Load Balancing에서 로드 밸런서를 선택 후 새로 생성한 로드 밸런서를 선택

6. [설명(Description)]을 선택하고, 로드 밸런서의 DNS 이름(예: my-load-balancer-1234567890abcdef.elb.us-east-2.amazonaws.com)을 복사해 브라우저에서 접속해 EC2 서버에 정상적으로 접속 확인

 

Step 3 : 콘솔을 사용하여 HTTPS 리스너 추가

1. https://console.aws.amazon.com/ec2/에서 Amazon EC2 콘솔 탐색 창에서 [Load Balancers]를 클릭 > 로드 밸런서를 선택

3. Listeners(리스너) 탭에서 Add listener(리스너 추가)를 선택

4. 프로토콜 : 포트에서 HTTPS를 선택하고 기본 포트를 유지하거나 다른 포트를 입력.

(선택 사항) 사용자를 인증하려면 Default actions(기본 작업)에서 Add action(작업 추가), Authenticate(인증)를 선택하고 요청된 정보를 제공. 자세한 내용은 Application Load Balancer를 사용하여 사용자 인증 단원을 참조

5. 기본 작업에서 다음 중 하나를 수행.

- 전달을 선택하고 대상 그룹을 선택

- 리디렉션을 선택하고 URL과 상태 코드를 입력. 자세한 내용은 리디렉션 작업 참고

- 고정 응답 반환을 선택하고 응답 코드, ID 제공업체(선택 사항) 및 응답 본문(선택 사항)을 입력. 자세한 내용은 고정 응답 작업 참고

6. [Security policy]에서 기본 보안 정책을 유지 권장

7. 기본 SSL/TLS 인증서에 대해 다음 중 하나를 수행.

- AWS Certificate Manager을 사용하여 인증서를 생성하거나 가져온 경우 ACM에서 시작을 선택하고 인증서를 선택

- IAM을 사용하여 인증서를 업로드한 경우 [IAM에서(From IAM)]을 선택하고 인증서를 선택

8. 추가(Add)를 선택

 

Additional : HTTP 요청을 HTTPS로 리디렉션하는 HTTP 규칙 생성

1. Amazon EC2 콘솔 >사이드바의 로드 밸런싱 에서 로드 밸런서를 선택 .

2. 로드 밸런서를 선택한 다음 HTTP Listener를 선택

3. 규칙 아래에서 규칙 보기/편집을 선택 

4. 모든 HTTP 요청을 HTTPS로 리디렉션하도록 기존 기본 규칙을 수정하려면 규칙 편집을 선택

5. Then 아래에서 기존 조건을 삭제. 그런 다음 Redirect to 조치 로 새 조건을 추가

 > HTTPS 의 경우 443 포트를 입력 

 > 나머지 옵션은 기본값을 유지

6. 저장하려면 확인 표시 아이콘을 선택

 

Application Load Balancer의 보안 그룹이 443에서 트래픽을 허용하도록 설정

1. 작업 , 인바운드 규칙 편집을 선택 하여 보안 그룹을 수정

2. 규칙 추가를 선택 

3. 유형 에서 HTTPS 를 선택 

4. 소스 에서 사용자 지정 (0.0.0.0/0 또는 소스 CIDR) 을 선택 

5. 저장

 

✏️ 3. 프론트엔드 CDN 및 HTTPS 적용

Step 1 : CloudFront 배포 생성

1. https://console.aws.amazon.com/cloudfront/v3/home 에서 CloudFront 콘솔 > Create Distribution(배포 생성)을 선택

2. 오리진에서 [오리진 도메인]에 대해 이전에 생성한 [S3]를 (로드밸런서 등도 가능) 선택

3. 오리진의 다른 설정은 기본값을 그대로 사용

4. [기본 캐시 동작]의 설정은 기본값을 그대로 사용(캐시 동작 설정을 참조)

5. 뷰어 프로토콜 정책에서 [Redirect HTTP to HTTPS] 설정

(cf. 만일 초기 설정을 하지 못했을 경우 최종 사용자와 CloudFront 간의 통신에 HTTPS 요구 섹션을 참조)

6. 나머지 [설정]에 모든 기본값을 적용( 배포 설정 섹션을 참조)

7. 페이지 맨 아래에서 배포 생성(Create distribution)을 선택 후 배포 상태가 배포가 되기까지 몇 분 정도 소요

8. CloudFront가 배포에 할당하는 도메인 이름 확인 (ex) d111111abcdef8.cloudfront.net와 유사

 

Step 2 :  CloudFront를 통해 콘텐츠에 액세스

- CloudFront가 배포에 할당하는 도메인 이름으로 접속 시 연결한  [Application Load Balancer]를 통해 EC2 웹 서버 접근

cf.) 한 단계 더 나아가 사용자 지정 도메인 이름(예: d111111abcdef8.cloudfront.net 대신 www.example.com)을 사용하도록 CloudFront 배포를 구성 가능(사용자 지정 URL 사용 섹션을 참조)

 

Step 3 :  CloudFront에 ACM 인증서를 적용해 발급받은 대체 도메인과 연결

CloudFront에서 대체 도메인 이름 추가

1. AWS Management Console에 로그인한 다음 https://console.aws.amazon.com/cloudfront/v3/home에서 CloudFront 콘솔 > 업데이트하려는 배포의 ID를 선택

2. [General] 탭에서 [Edit]를 선택

3. Alternate Domain Names (CNAMEs)대체 도메인 이름을 추가. 도메인 이름을 쉼표로 구분하거나 각각의 이름을 새 줄에 입력

4. SSL 인증서 (us-east-1이 없을 시 발급받아야 하며, 도메인 명을 wildcard로 발급 *.xxx.click) 

(옵션) Clients Supported다음 옵션을 선택(CloudFront에서 HTTPS 요청을 제공하는 방식 선택)

5. HTTPS 사용(Use HTTPS) - 사용자 정의 SSL 인증서(Custom SSL Certificate)를 선택하고 목록에서 위 인증서를 선택

6. 예, 편집 선택

 

Default root object 지정

1. https://console.aws.amazon.com/cloudfront/v3/home에서 CloudFront 콘솔 > 상단 창의 배포 목록에서 업데이트하려는 배포를 선택

2. 설정 창의 일반 탭에서 편집을 선택

3. 편집 설정 대화 상자에서 기본 루트 객체 필드에 기본 루트 객체의 파일 이름을 입력 (ex. index.html과 같이 객체 이름만 입력하고 / 추가하지 말 것)

4. Save changes(변경 사항 저장)를 선택

 

Step 4 : Route 53의 호스팅영역 설정

선행 조건

- 등록된 도메인 이름(Amazon Route 53을 도메인 등록 대행자로 사용하거나 다른 등록 대행자를 사용 가능)

 > Route 53을 도메인의 DNS 서비스로 사용 시 Route 53이 도메인의 DNS 서비스로 자동 구성(Amazon Route 53을 기존 도메인의 DNS 서비스로 만들기 단원을 참조)

- Amazon CloudFront 배포에 HTTPS가 필요하도록 공인 인증서를 요청.(AWS Certificate Manager에서 공인 인증서 및 DNS 검증 요청을 참조)

- CloudFront 배포. 배포에는 CloudFront가 배포에 할당한 도메인 이름 대신 URL에 사용하려는 도메인 이름과 일치하는 대체 도메인 이름이 포함되어야 함

 

Amazon Route 53을 구성하여 CloudFront 배포로 트래픽을 라우팅.

1. CloudFront에서 배포에 할당한 도메인 이름을 가져오고 IPv6가 활성화되어 있는지 확인.

- AWS Management Console에 로그인한 다음 https://console.aws.amazon.com/cloudfront/v3/home에서 CloudFront 콘솔 > ID열에서 트래픽을 라우팅할 배포의 연결된 이름을 선택(확인란이 아님).

- 일반(General) 탭에서 배포 도메인 이름(Distribution domain Name) 필드의 값 가져오기

- 일반(General) 탭의 설정(Settings) 섹션에서 편집을 선택하고 스크롤하여 IPv6 필드를 확인하여 배포에 IPv6가 활성화되어 있는지 확인

- IPv6가 활성화되어 있으면 배포를 위해 2개의 별칭 레코드를 만들어야하므로 (하나는 IPv4 트래픽을 배포로 라우팅하고, 하나는 IPv6 트래픽을 라우팅하기 위함)  취소 선택 (배포의 생성 또는 업데이트 시 지정하는 값 주제의 IPv6 활성화를 참고)

2. AWS Management Console에 로그인한 후 https://console.aws.amazon.com/route53/에서 Route 53 콘솔 > 탐색 창에서 호스팅 영역(Hosted zones)을 선택

3. 트래픽을 CloudFront 배포로 라우팅하는 데 사용할 도메인의 호스팅 영역의 연결된 이름을 선택

4. Create Record Set(레코드 세트 생성)를 선택 > 마법사를 사용하여 레코드를 생성하거나 빠른 생성으로 전환(Switch to quick create)을 선택

5. 아래 사항 설정

- 라우팅 정책 : 해당 라우팅 정책을 선택, 단순 라우팅 (자세한 내용은 라우팅 정책 선택 섹션을 참조)

- 레코드 이름 : 트래픽을 CloudFront 배포로 라우팅하는 데 사용할 도메인 이름을 입력 (빈칸으로 두는 것 OK) ※ 주의: CloudFront 배포 대체 도메인명 == 현재 Route53 레코드 등록의 레코드 이름이 일치되어야 함

- 레코드 유형 : A - IPv4 주소(A – IPv4 address)를 선택

- 값/트래픽 라우팅 대상 : CloudFront 배포에 대한 별칭(Alias to CloudFront distributions)을 선택 us-east-1 리전이 기본으로 선택됨

 > 배포를 생성할 때 CloudFront가 배포에 할당한 도메인 이름을 선택

- 대상 상태 평가 : 기본값인 [No]

(옵션) 배포에 대해 IPv6가 활성화되어 있고 두 번째 레코드를 생성하는 경우, AAAA - IPv6 address를 선택

6. [레코드 생성(Create records)]을 선택

 

✏️ 4. Route53 레코드 등록

Step 1 : CloudFront와 동일하게 ALB의 별칭 레코드를 Route53 호스팅 영역에 생성

 

Step 2 : 백엔드는 https://api.yourdomain.click으로 접속 시, 로드밸런서로 연결

Step 3 : 프론트엔드는 https://www.yourdomain.click으로 접속 시, Cloudfront(S3)로 연결

Step 4 : client test2 통과 확인