정적 웹 호스팅 (AWS Route53-CloudFront-S3 연결까지)

카테고리 없음

정적 웹 호스팅 (AWS Route53-CloudFront-S3 연결까지)

우장산날다람쥐 2024. 8. 21. 10:19

안녕하세요

이번에 제가 소개할 내용은 정적 웹 호스팅에 관한 이야기입니다.

이 글에서는 정적 웹 호스팅의 개념부터 AWS를 활용한 구현 방법까지 자세히 살펴보겠습니다.

저희가 사용할 웹 사이트는 주로 HTML, CSS, 및 JavaScript 파일로 구성되어 서버 측에서 동적인 처리가 필요하지 않습니다. 따라서 정적 웹 호스팅을 하는 것이 비용 효율적이며, 서버 관리의 부담을 줄일 수 있습니다.

또한, 정적 웹 호스팅은 보안이 강화된 환경을 제공하여 데이터 유출의 위험을 최소화하고, 빠른 로딩 속도를 통해 사용자 경험을 향상시킬 수 있습니다.

이러한 이유로, 우리 프로젝트의 요구사항에 가장 적합한 호스팅 방식이라고 할 수 있습니다.

정적 웹 호스팅을 하기 위해서는

정적 파일을 호스팅할 웹 서버가 필요합니다 → S3
도메인 이름을 호스팅 서버의 IP 주소와 연결해야 합니다. → Route53
HTTPS를 통해 사이트를 보호하고, 사용자와의 통신을 암호화해야 합니다. → ACM + CloudFront
사용자가 사이트에 접속할 수 있는 URL을 제공하기 위해 도메인 이름이 필요합니다. → Route53

AWS에는 이런 정적 웹 호스팅에 적합한 서비스들이 여러 가지 존재합니다.

이제부터 각 서비스를 하나씩 설명하겠습니다.

Route53

확장 가능한 고가용성의 DNS 웹 서비스입니다.

사용자 요청을 AWS 또는 온프레미스에서 실행되는 인터넷 애플리케이션에 연결하는 역할을 합니다.

Route53에는 여러 기능들이 있습니다.

도메인을 구매할 수 있습니다.
도메인에 대한 DNS 레코드를 생성하고 관리합니다.
- 레코드 : 특정 도메인을 관리하는 항목
- a레코드: 고정된 ip 주소에 도메인을 매핑한 것
- cname: 도메인 주소에 또 다른 도메인 주소를 매핑한 것
로드밸런싱 기능⇒여러 대의 서버에 트래픽을 분산⇒ 웹 어플리케이션의 성능을 최적화합니다.
자동화된 헬스 체크 : 서버가 다운되거나 장애가 발생하면 Route 53는 자동으로 트래픽을 정상적인 서버로 리다이렉트하여 가용성을 높입니다.
Route 53은 다양한 라우팅 정책을 제공하여 트래픽을 효율적으로 관리하고, 사용자에게 최적의 경로로 연결될 수 있도록 합니다.

CloudFront

정적 및 동적 웹 콘텐츠를 사용자에게 더 빨리 배포하도록 지원하는 웹 서비스입니다.

사용자 요청→지연 시간이 가장 낮은 엣지 로케이션으로 요청을 라우팅합니다.

cloudfront의 동작 순서는 다음과 같습니다.

사용자 요청 → dns 룩업 (url→ip) → 가까운 edge location 선택, 캐시 검사 → regional edge chache 검사 → origin server로 컨텐츠 요청 → edge location에서 캐싱 및 응답 → 사용자에게 컨텐츠 제공

이런 cloudfront를 사용하는 이유는 다음과 같습니다.

이미지 파일을 캐싱함으로써 데이터 처리 비용을 낮추기 위해서
- CloudFront를 통해 캐싱된 데이터 가져옴 → S3로 직접 접근 횟수 줄어듦 → 데이터 처리 비용이 낮아짐
지연 시간이 적고 전송 속도가 빠름

-- 다른 기술과의 비교

cloudfront를 사용하지 않는다면 원본 서버가 모든 트래픽을 처리해야 하는 부담이 생깁니다.

지리적 거리로 인한 지연, 병목 현상 발생 →페이지 로드 속도 느려짐
서버 부하 증가
보안 위험 증가, SSL/TLS를 서버에 직접 설정하고 갱신해야 함
비용 증가 (캐싱 못함→다 원본 서버로 요청)

+ACM

ACM(AWS Certificate Manager)은 CloudFront 배포에 연결됩니다. 이를 통해 CloudFront를 통해 제공되는 콘텐츠가 HTTPS를 통해 안전하게 전달됩니다.

ACM을 이용하면 다음과 같은 장점이 있습니다.

SSL/TLS 인증서의 발급, 배포, 갱신을 자동으로 처리 → 연마다 갱신할 필요 없음

무료→비용 효율적으로 HTTPS 구현 가능

비공개 키에 접근할 필요가 없기 때문에, 키 관리의 복잡성을 줄이고 보안을 강화할 수 있음

ref: https://docs.aws.amazon.com/ko_kr/AmazonCloudFront/latest/DeveloperGuide/Introduction.html

https://claudy.tistory.com/entry/AWS-CloudFront란

S3(Simple Storage Service)

완전 관리형, 독립형, 인터넷 액세스가 가능한 객체 스토리지 서비스입니다.

S3를 사용하면 다음과 같은 장점이 있습니다.

설정이 간단하고 안정적이며 대량의 트래픽을 처리할 수 있음
비용 효율성S3와 CloudFront를 함께 사용하면, S3에서 직접 데이터를 제공하는 대신 CloudFront가 자주 요청되는 파일을 캐싱하여, S3의 데이터 전송량과 요청 횟수를 줄여줌 → 비용 절감 가능
사용한 만큼만 비용을 지불하는 모델로, 데이터를 저장한 용량, 요청 횟수, 데이터 전송량에 따라 비용이 결정됨
높은 확장성S3는 전 세계 여러 리전에 걸쳐 배포된 데이터 센터에서 운영 →글로벌 사용자에게 빠른 데이터 접근성을 제공
저장하려는 데이터의 양이 증가하면 S3가 자동으로 용량을 확장
높은 내구성
S3에 저장된 데이터는 자동으로 동일한 AWS 리전 내에 있는 최소 세 개의 가용 영역(AZ)에 복제됨 → 하드웨어 장애, 네트워크 문제, 자연 재해 등으로 인한 데이터 손실을 방지
보안버킷 정책, ACL(Access Control Lists), IAM 정책을 통해 접근 권한 관리 가능
서버 측 암호화(SSE) 및 클라이언트 측 암호화를 지원
손쉬운 관리
S3에서 정적 웹 사이트를 호스팅하면 설정 및 관리가 쉽고 서버 유지, db 관리가 필요하지 않음

-- 다른 기술과의 비교

EBS(Elastic Block Storage) , EFS(Elastic File Storage)

EC2 인스턴스에 연결된 가상 디스크처럼 동작 → 인스턴스가 가동 중이어야만 데이터를 제공할 수 있음
주로 지속적으로 접근하는 데이터, 파일 시스템, 데이터베이스 등을 위해 설계된 스토리지 → 사용하지 않는 용량에도 비용이 발생할 수 있음
정적 콘텐츠를 효율적으로 제공하는 데 적합하지 않음

ref: https://somaz.tistory.com/179#google_vignette

https://www.smileshark.kr/post/amazon-s3-efs-ebs-which-aws-storage-service-to-use

지금까지 정적 웹 호스팅의 개념을 설명드렸으니, 이제는 실제로 구현하는 방법을 알아보겠습니다. 이번 단계에서는 AWS의 다양한 서비스를 활용하여 정적 웹사이트를 호스팅하는 방법을 단계별로 설명하겠습니다.

<Amazon S3 버킷의 정적 웹 사이트에 대한 도메인 사용>

1단계: 도메인 등록

메일 인증 완료 후

도메인 등록하고 nslookup먼저 하기

test.olyoung.com 도메인이 123.45.67.89 IP 주소와 올바르게 연결되어 있음

3. cname 발급 받고 nslookup 하기

3-1. acm 인증서 발급받기

인증서 발급 성공

cname으로 nslookup 성공

2단계: 루트 도메인에 대한 S3 버킷 생성

버킷 이름은 도메인 이름이랑 같아야 함

3단계: 선택 사항: 하위 도메인에 대한 다른 S3 버킷 생성

4단계: 웹 사이트 호스팅용 루트 도메인 버킷 설정

5단계: (선택 사항): 웹 사이트 리디렉션에 대한 하위 도메인 버킷 설정

6단계: s3에 파일 업로드

7단계: S3 퍼블릭 액세스 차단 설정 편집

모든 퍼블릭 액세스 차단을 선택 취소

8단계: 버킷 정책 연결

9단계: 도메인 엔드포인트 테스트(성공)

10단계: 도메인의 DNS 트래픽을 웹사이트 버킷으로 라우팅

11단계: 웹 사이트 테스트(성공)

<기존 Amazon S3 버킷에 CloudFront 추가>

ref: https://docs.aws.amazon.com/ko_kr/AmazonCloudFront/latest/DeveloperGuide/DownloadDistS3AndCustomOrigins.html#adding-cloudfront-to-s3

Amazon S3에서 콘텐츠를 이미 배포하고 있는 경우 CloudFront를 추가하려면

1. CloudFront 배포

S3 버킷의 이름을 오리진 서버로 지정

s3 정책 수정

{
    "Version": "2012-10-17",
    "Id": "Policy1724047533661",
    "Statement": [
        {
            "Sid": "Stmt1724047437143",
            "Effect": "Allow",
            "Principal": "*",
            "Action": "s3:GetObject",
            "Resource": "arn:aws:s3:::olyoung.com/*"
        },
        {
            "Sid": "AllowCloudFrontServicePrincipal",
            "Effect": "Allow",
            "Principal": {
                "Service": "cloudfront.amazonaws.com"
            },
            "Action": "s3:GetObject",
            "Resource": "arn:aws:s3:::olyoung.com/*",
            "Condition": {
                "StringEquals": {
                    "AWS:SourceArn": "arn:aws:cloudfront::992382409375:distribution/E3SGG2PN1FQJRB"
                }
            }
        }
    ]
}