brunch

You can make anything
by writing

C.S.Lewis

by Master Seo Sep 15. 2019

154. S3와 CloudFront로 글로벌 서비스하기

<1> S3에 홈페이지 올리기

<2>  CloudFront로 글로벌 서비스하기 



<1> S3에 홈페이지 올리기


1. test1.serverchk.com 사이트 만들어보자.

Bucket name : test1.serverchk.com



2. Block all public access 체크 해지함.

 public 하게 접속 가능하도록 됨.


3. Static website hosting 설정을 함.

홈페이지를 만들기 위함.


4. 기본으로 읽는 파일 이름을  index.html이라고 입력한다.




5. index.html 파일을 올린다.


index.html 내용

<h1> cdn-site1.serverchk.com </h1>

<img src="1.jpg" alt="111" width="300">


6. index.html 클릭해서 나오는 URL로 접속해보자.

Access Denied 나온다.



7. Bucket Policy에 일반 사용자가 접속할 수 있도록  Bucket Policy를 준다.



8. 정책 입력 시 필요한 ARN은  Buckets >  test1.serverchk.com Bucket을 클릭 > 

오른쪽에 ARN정보가 나온다.


{

    "Version": "2012-10-17",

    "Statement": [

        {

            "Sid": "AddPerm",

            "Effect": "Allow",

            "Principal": "*",

            "Action": "s3:GetObject",

            "Resource": "arn:aws:s3:::test1.serverchk.com/*"

        }

    ]

}


9. DNS 설정한다.

s3의  web hosting url 이  DNS이름이다.

route53에  test1.serverchk.com의  cname으로 지정한다.





<2>  CloudFront로 글로벌 서비스하기 


CloudFront는 CDN 서비스이다.


1. Web에 대해 CDN을  적용 해보자.



2. 생성


3. 생성 완료

CDN 생성이 되면, Deployed 로 표시된다.

Domain name에서 접속 도메인을 확인한다.



4. index.html을 CDN 적용으로 변경한다.


<h1> cdn-site1.serverchk.com </h1>

<img src="http://d1t035q7j149m0.cloudfront.net/1.jpg" alt="111" width="300">


업로드시 Grant public read access to this object(s) 선택으로 변경해 업로드 한다.



5. index.html을  수정해  적용해 본다.


<h1> cdn test 2  </h1>

<h1> cdn-site1.serverchk.com </h1>

<img src="http://d1t035q7j149m0.cloudfront.net/1.jpg" alt="111" width="300">



6.  CDN을 사용하지 않을 경우 (CDN disable이나 삭제할경우)는   index.html을 수정해줘야 한다.


7.  캐쉬로 인해 문제가 될때 캐쉬 무효화 기능 사용한다.




8.  CDN을 사용하지 않을 경우는 임시로 Disable하거나  필요없을 경우 Delete로 삭제하도록 한다.




감사합니다.

브런치는 최신 브라우저에 최적화 되어있습니다. IE chrome safari