Github Action을 활용해 ElasticBeanstalk로 자동 배포하기

저번에는 Github Action을 활용하여 프론트 부분을 자동 배포해보았고,

이번에는 Gihub Action을 활용하여 백엔드 서버를 자동 배포해보려고 한다.

 

IAM 권한 추가

먼저 IAM 사용자에 AdministratorAccess-AWSElasticBeanstalk 권한을 추가해준다.

벡엔드 코드를 Github에 업로드

1. 인증키 코드에 넣기

s3 = boto3.client('s3',
		aws_access_key_id=os.environ["AWS_ACCESS_KEY_ID"],
		aws_secret_access_key=os.environ["AWS_SECRET_ACCESS_KEY"]
		)

 

2. 환경변수 관리

AWS_ACCESS_KEY_ID, AWS_SECRET_ACCESS_KEY 과 같은 환경변수들은 코드에 그대로 넣지 않아요 보안상 위험하기 때문에 서버에 환경변수로 설정하고 코드에 환경변수를 읽어들이는 부분을 넣는다.

import os

os.environ["AWS_ACCESS_KEY_ID"]

 

3. CORS 허용

CORS는 Cross-Origin Resource Sharing 이라는 의미이다. 쉽게 설명해서 다른 도메인간에 API 통신을 허용한다는 뜻이다. 프론트와 백엔드 간의 도메인이 다르기 때문에 API 통신을 하려면 CORS를 허용해 주어야 한다!

from flask_cors import CORS
cors = CORS(application, resources={r"/*": {"origins": "*"}})

 

Github 레파지토리에서 Secrets 값 설정

Settings > Secrets으로 들어가서 AWS Key를 저장한다.

./github/workflows/main.yml에 배포 스크립트 추가

name: gitaction-elasticbeanstalk
on:
  push:
    branches:
      - main
jobs:
  build:
    runs-on: ubuntu-latest

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

      - name: Set up Python 3.8
        uses: actions/setup-python@v1
        with:
          python-version: "3.8"

      - name: Generate deployment package
        run: zip -r deploy.zip . -x '*.git*'

      - name: Get timestamp
        uses: gerred/actions/current-time@master
        id: current-time

      - name: Run string replace
        uses: frabert/replace-string-action@master
        id: format-time
        with:
          pattern: '[:\.]+'
          string: "${{ steps.current-time.outputs.time }}"
          replace-with: '-'
          flags: 'g'

      - name: Deploy to EB
        uses: einaregilsson/beanstalk-deploy@v16
        with:
          aws_access_key: ${{ secrets.AWS_ACCESS_KEY_ID }}
          aws_secret_key: ${{ secrets.AWS_SECRET_ACCESS_KEY }}
          application_name: python-app
          environment_name: Pythonapp-env
          version_label: "python-${{ steps.format-time.outputs.replaced }}"
          region: ap-northeast-2
          deployment_package: deploy.zip

ElasticBeanstalk에 환경변수 설정!!

구성 > 소프트웨어 수정 > 환경속성에서 환경 변수를 설정할 수 있다.

아래와 같이 환경변수를 설정 후 적용을 누른다.

EB 배포를 위한 준비

이전에 EC2에 배포할 때는 pip install 명령어로 라이브러리를 수동으로 설치해주었다.

하지만 ElasticBeanstalk 서비스에서는 라이브러리 설치도 알아서 진행한다. 따라서 설치할 라이브러리 목록을 만들고 레파지토리에 포함시켜주어야한다.

터미널에 pip install로 설치 후 아래 명령어를 입력하면 requirements.txt 파일에 라이브러리 목록이 자동으로 들어간다.

pip freeze > requirements.txt

 

이제 Github 레파지토리에 push를 완료한다!

 

프론트와 백엔드 연결하기

이전 게시물에서 프론트로는 Github Action과 AWS Cloudfront를 연동했었다. 이제 백엔드도 연동을 완료했으므로 프론트 코드를 살짝 변경해주면 프론트와 백엔드 연결까지 완료된다.

function save() {
            var form_data = new FormData($('#upload-file')[0]);
            $.ajax({
                type: 'POST',
                url: '{EB URL}/fileupload',
                data: form_data,
                processData: false,
                contentType: false,
                success: function (data) {
                    alert("파일이 업로드 되었습니다!!");
                },
            });
        }

 

 

 

 

참고: 스파르타코딩클럽 핵심쏙쏙AWS