概要
CodeCommitにファイルをコミットすると、CodePipelineが変更を検知し、自動でS3にデプロイが実行されるCI/CD環境を構築する
実装方法
S3バケットの作成
バケットの作成
aws s3 mb s3://ci-cd-handson --region ap-northeast-1
make_bucket: ci-cd-handson
Webサイトホスティングの設定
Webサイトホスティングの有効化
aws s3 website s3://ci-cd-handson/ --index-document index.html --error-document error.html
バケットポリシーの設定
aws s3api put-bucket-policy --bucket ci-cd-handson --policy file://policy.json
ファイル: policy.json
※ Resourceには作成したS3バケットのARNを指定する
{
"Version": "2012-10-17",
"Statement": [
{
"Effect": "Allow",
"Principal": "*",
"Action": "s3:GetObject",
"Resource": "arn:aws:s3:::ci-cd-handson/*"
}
]
}
ファイルのコピー
aws s3 cp ./index.html s3://ci-cd-handson/
aws s3 cp ./error.html s3://ci-cd-handson/
ファイル: index.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>index.html</title>
</head>
<body>
ci-cd-handson index.html
</body>
</html>
ファイル: error.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>error.html</title>
</head>
<body>
ci-cd-handson error.html
</body>
</html>
サイトにアクセスする
curl http://ci-cd-handson.s3-website-ap-northeast-1.amazonaws.com/
CodeCommitの設定
リポジトリの作成
aws codecommit create-repository --repository-name ci-cd-handson
出力結果
{
"repositoryMetadata": {
"accountId": "xxx",
"repositoryId": "c8fb8d08-bea8-4cce-a7a4-3698a6a2b4ba",
"repositoryName": "ci-cd-handson",
"lastModifiedDate": "2020-11-02T17:04:22.671000+09:00",
"creationDate": "2020-11-02T17:04:22.671000+09:00",
"cloneUrlHttp": "https://git-codecommit.ap-northeast-1.amazonaws.com/v1/repos/ci-cd-handson",
"cloneUrlSsh": "ssh://git-codecommit.ap-northeast-1.amazonaws.com/v1/repos/ci-cd-handson",
"Arn": "arn:aws:codecommit:ap-northeast-1:xxx:ci-cd-handson"
}
}
PCからCodeCommitにアクセスするための設定
認証情報ヘルパーを使用してアクセスできるようにする
AWS CLI 認証情報ヘルパーを使用して Linux, macOS, or Unix で AWS CodeCommit リポジトリへの HTTPS 接続をセットアップする手順 - AWS CodeCommit
git config --global credential.helper '!aws codecommit credential-helper [email protected]'
git config --global credential.UseHttpPath true
↑のコマンド実行すると ~/.gitconfig に設定が追記される
gitconfigにusername/emailを設定していない場合には↓も合わせて設定する
git config --global user.name "名前"
git config --global user.email "メールアドレス"
gitをcloenしてみる
git clone https://git-codecommit.ap-northeast-1.amazonaws.com/v1/repos/ci-cd-handson
s3にコピーしたindex.htmlとerror.htmlをcloneしたディレクトリに保存
cp index.html error.html ./ci-cd-handson/
CodeCommitにファイルをpushする
cd ci-cd-handson
git add .
git commit -m "initial commit"
git push origin master
CodePipelineの作成
AWSコンソールよりCodePipelineのメニューにアクセスする
パイプラインの設定を選択する
下記の項目を入力し、「次に」をクリックする
- パイプライン名 : ci-cd-handson-s3
- ロール名 (自動入力) : AWSCodePipelineServiceRole-ap-northeast-1-ci-cd-handson-s3
ソースステージを追加する
下記の項目を入力し、「次に」をクリックする
- ソースプロバイダー : AWS CodeCommit
- リポジトリ名 : ci-cd-handson
- ブランチ名 : master
ビルドステージを追加する
S3バケットにファイルを配置するだけなので、「ビルドステージをスキップ」をクリックする
※ 警告メッセージが表示されるが、そのまま「スキップ」をクリックする
デプロイステージを追加する
下記の項目を入力し、「次に」をクリックする
- デプロイプロバイダー : S3
- リージョン : アジアぱパシフィック(東京)
- バケット: ci-cd-handson
- デプロイする前にファイルを抽出する : チェックを入れる
レビュー
これまで設定した内容が表示されるので、内容を確認し、問題なければ「パイプラインを作成する」をクリックする
しばらくすると、パイプラインが作成される
この時点でS3にアクセスしても、ソールコードを変更していないので。以前と同じ内容が表示される
curl http://ci-cd-handson.s3-website-ap-northeast-1.amazonaws.com/
新しいコードのデプロイ
index.htmlを修正して、CodeCommitにpushする
ファイル: index.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>index.html</title>
</head>
<body>
ci-cd-handson index.html
deployed by codecommit!!
</body>
</html>
git add .
git commit -m "fix"
git push origin master
CodeCommitへの変更をCodePipelineが検知し、デプロイが実行される
デプロイ完了後、再度S3にアクセスすると、コンテンツが更新されていることが確認できる
curl http://ci-cd-handson.s3-website-ap-northeast-1.amazonaws.com/
出力結果
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>index.html</title>
</head>
<body>
ci-cd-handson index.html
deployed by codecommit!!
</body>
</html>
参考
AWS Hands-on for Beginners - AWS Code サービス群を活用して、CI/CD のための構成を構築しよう! | AWS
コメント