본문 바로가기
카테고리 없음

cloudFront

by redeyes 2022. 2. 13.

cloud front 

  1. Amazon S3 버킷 또는 고유 HTTP 서버와 같은 오리진 서버를 지정하고, CloudFront는 이로부터 파일을 가져온 다음 전 세계 CloudFront 엣지 로케이션에 배포합니다.
  2. 오리진 서버는 객체의 최종 원본 버전을 저장합니다. HTTP를 통해 콘텐츠를 서비스하는 경우 오리진 서버가 Amazon S3 버킷 또는 웹 서버 같은 HTTP 서버입니다. HTTP 서버는 Amazon Elastic Compute Cloud(Amazon EC2) 인스턴스나 사용자가 관리하는 서버에서 실행할 수 있습니다. 이 서버를 사용자 지정 오리진이라고도 합니다.

결국 cdn을 얘기하는 듯 하다. 아무래도 s3의 리즌이 아시아여서 유럽이나 미국 등등 에서는 접속시 조금 더 오래 걸리니 캐쉬로 나눠서 리즌에 배포하겠다는 내용이다.

s3도메인만 추가하고 이름은 편하게 쓴다음 바로 생성하자.

 

도메인이름이 cloudFront로 배포중인 주소이다. 원본 주소는 s3오리진 서버 주소.

 

(강사님께서 말씀하시길 2021도 자료 기준 ..)

cloudFront의 좋은점은 s3의 도메인의 경우 접속할때마다 과금?이 된다고 하는데 cloudfront로 접속 하면 오리진을 사용하는게 아니기 때문에 과금이 없다고 하네요. (추후에 가격적인면에서 매력이있다로 정정하셨는데 여튼 그렇답니다.)

(2-2프론트 구성해보기 10분 전후)

 프리티어기간동안에 대한 계산은 구글링.... (....)

 

s3에서 index.html을 기본 으로 설정을 안했거나 cloudfront 도메인으로 접속했는데

 accessdenied가 뜬다면

 

cloudFront 생성한 객체의 deit settings(편집)을 들어가서 위와같이 기본 루트를 적용해보자.

 

이후 cloudfront의 도메인으로 접속하면 정적 웹호스팅은 마무리되었다 바로이어서

 

깃 허브 action을 사용해보자

(CICD 파이프라인.)

 

일단 IAM에 권한을 추가해보자 계정생성이나 관련 정보는 구글링이나 해당 티스토리 

https://redeyes1234.tistory.com/34 IAM 부분을 참고.. 해도 됩니다.

 

권한은

기존 정책 연결에서 cloudFront full access

 

추가 후에 

깃 허브 액션을 이용하자

 깃 허브 Repositories를 하나 파자 이름은 자유 퍼블릭으로 생성 readme도 하나 만들어주자

 

파이참 프로젝트에 .github/workflows/main.yml 하나를 만들어 주고 안에 스크립트를 작성해준다. screats.AWS.... 은 깃액션에서 설정 해 줄 것이니 아래와같이 접근한다. 나머지 설정은 ... 모르겟다..

name: my-front
on:
  push:
    branches:
      - main
jobs:
  build:
    runs-on: ubuntu-latest
    env:
      AWS_ACCESS_KEY_ID: ${{ secrets.AWS_ACCESS_KEY_ID }}
      AWS_SECRET_ACCESS_KEY: ${{ secrets.AWS_SECRET_ACCESS_KEY }}
      AWS_REGION: 'ap-northeast-2'

    steps:
      - name: Checkout source code.
        uses: actions/checkout@master

      - name: Upload binary to S3 bucket
        uses: jakejarvis/s3-sync-action@master
        with:
          args: --acl public-read --exclude '*' --include 'index.html'
        env:
          AWS_S3_BUCKET: ${{ secrets.BUCKET_NAME }}

      - name: Invalidate cache CloudFront
        uses: chetan/invalidate-cloudfront-action@master
        env:
          DISTRIBUTION: ${{ secrets.DISTRIBUTION_ID }}
          PATHS: '/index.html'
        continue-on-error: true

 

깃 세팅으로 넘어와서 

 

accesskeyid : iam key id

secretaccesskey : iam secrete key

bucket_name : s3 버킷이름

distributionid : cloudFront 생성한 객체 id

 

저장후 파이참에서 깃 푸쉬