【CI/CD】GitHub Actionsを使ってAWS S3へ静的ウェブサイトをデプロイしてみる

Last updated at 2023-05-24Posted at 2023-05-24

概要

GitHub Actionsの学習のためにテストしてみました。

やりたいこととしてはシンプルで

GitHubで管理しているhtmlファイルに変更を加える

　→　その変更内容がAWS S3上のhtmlファイルに反映される

です。

それを実現するために必要なサービスは

GitHub
GitHub Actions　※以下GHAと記載
AWS S3
OpenID Connect　※以下OIDCと記載
になります。

構成と運用フロー

運用フローとしては以下となります。

ユーザーがGitHub上のhtmlに変更を加え、その内容をマージ
マージをトリガーとしてGHAが起動
GHAがOIDC経由でAWS認証し、S3へのアクセス権限を持ったRoleを取得
GHAがS3へアクセスし、マージされたhtmlをデプロイ

構築

※本記事内で作成したウェブサイト、GitHubリポジトリ等は全て削除済のため
　現在はアクセス不可となっています

S3にhtmlを配置

test-gha-2023-s3というバケットを作成し、index.htmlを配置します。

静的ウェブサイトとして表示されればOKなので、index.htmlは簡素な内容でいきます。

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
</head>
 
<body>
     Hello World！ 
</body>
</html>

S3バケットのパブリックアクセスもろもろを設定し、ウェブサイトとして表示されました。

GitHubにhtmlを配置

test-gha-2023というリポジトリのmainブランチに同じindex.htmlを配置します。

OIDCの設定

AWSのIAMでGitHub向けのIDプロバイダを設定します。

ロールの設定

作成したIDプロバイダを使用して、GHAに付与するロールを作成します。

カスタム信頼ポリシーの内容はこちらです。

{
    "Version": "2012-10-17",
    "Statement": [
        {
            "Sid: "",
            "Effect": "Allow",
            "Principal": {
                "Federated": "arn:aws:iam::{AWSアカウントID}:oidc-provider/token.actions.githubusercontent.com"
            },
            "Action": "sts:AssumeRoleWithWebIdentity",
            "Condition": {
                "StringEquals": {
                    "token.actions.githubusercontent.com:aud": "sts.amazonaws.com"
                    "token.actions.githubusercontent.com:sub": "repo:{GitHubのowner}/test-gha-2023:ref:refs/heads/main"
                }
            }
        }
    ]
}

許可ポリシーは絞るのめんどいのでAdministratorAccessにしました（テストだし）。
当然ながら、実際には必要な権限のみに絞るべきです。

ロール作成完了。

GHAを設定

GHAで使用するymlを配置します。
test-gha-2023リポジトリのmainブランチにあるActionsタブを開き
set up a workflow yourselfをクリックします。

エディタ画面に遷移するのでDeployToS3.ymlを作成します。
（テストなので直コミットしています）

DeployToS3.ymlの中身はこちらです。

name: DeployToS3

on:
  push:
    branches:
      - main

jobs:
  deploy:
    runs-on: ubuntu-latest
    permissions:
      id-token: write
      contents: read

    steps:
    - name: Checkout repository
      uses: actions/checkout@v3

    - name: AWS set Credentials
      uses: aws-actions/configure-aws-credentials@v1
      with:
        aws-region: 'ap-northeast-1'
        role-to-assume: 'arn:aws:iam::{AWSアカウントID}:role/test-gha-2023-role'

    - name: Build and Deploy to S3
      run: aws s3 cp index.html s3://test-gha-2023-s3 --region ap-northeast-1

DeployToS3.ymlが作成され、これで全ての準備は整いました。