はじめに
CodeCommitへのアクションをトリガーにCodeBuildでビルドを行い、コンテンツをS3へ配置するパイプラインを実装しました。
実装していく中でハマったことなど共有しつつ最終的にどう実装したのか共有できればと思います。
パイプライン構成
パイプラインでやりたいこととしては以下の通りとなります。
- CodeCommitの変更をトリガーにCodePipelineを動作させる
- YarnでVueのコードをビルドしたい
- ビルドした結果を特定のS3に配置したい
そのため当初はシンプルに以下のパイプラインで実装しました.
CodeBuildでコンテンツのビルドを行い、CodePipelineの機能を使ってS3へビルドしたコンテンツを配置する構成になります。
ただこの構成でデプロイは正常に行えましたが、デプロイ後のコンテンツにcurlでアクセスしてみるとCodeBuildのメタデータ(x-amz-meta-codebuild-buildarn)が付与されていることを発見しました。
メタデータには外に公開したくないCodeBuildのプロジェクトARNが含まれており、これが外部から見えてしまうのはよくありません。

参考: CodeBuild のビルド仕様に関するリファレンス
修正したパイプライン構成
削除する方法を公式ドキュメント等で探しましたが見つからなさそうだったのでパイプラインの構成を変えることにしました。
修正後のパイプライン構成は以下の通りです。
CodeCommitの変更をトリガーにCodePipelineを動作させるところは変わらず、ビルドとデプロイに関して修正しています。
- ビルド
- アーティファクト機能を使わずaws cliにてビルドしたコンテンツをS3の一時ファイル置き場に配置
- デプロイ
- CodePipelineのS3デプロイ機能は使用しない
- ビルド時に配置したS3の一時ファイル置き場からコンテンツを配置したいS3バケットへコンテンツを再配置

ビルド、デプロイの修正
CodePipeline: ビルドアクション
CodeBuildを使用することには変わりありませんが、ビルド後手動承認を挟む都合上アーティファクトを手動作成するようにyamlを修正しています。
またアーティファクトを手動で処理するためにどうファイル名をデプロイアクションへ受け渡すか考えていたところ、CodePipelineの名前空間を使ってできるらしいとのことなのでこれを使用しています。
変数を一意に参照できるようにするには、変数を名前空間に割り当てる必要があります。
名前空間に変数のセットを割り当てた後、次の構文で名前空間と変数キーを使用して、アクション設定で変数を参照できます。#{namespace.variable_key}
ビルドアクションで修正したyaml以下の通りです。
CodePipelineで名前空間の設定を行い、CodeBuildで変数指定を行なっています。
- CodePipeline: ビルドアクション

- CodeBuild
env/exported-variablesを使用することで変数をエクスポートすることができ、CodePipelineのアクションを跨いだ変数の受け渡しができるようです。
version: 0.2
env:
exported-variables:
- BuildID
phases:
install:
runtime-versions:
nodejs: 18
commands:
- echo "Installing yarn..."
- cd app
- npm install -g yarn
pre_build:
commands:
- echo "Running package install..."
- yarn install
build:
commands:
- echo "Building the Vue..."
- yarn run build
post_build:
commands:
- "export BuildID=`echo $CODEBUILD_BUILD_ID | cut -d: -f2`"
- zip -r $BuildID.zip ./dist
- aws s3 mv $BuildID.zip s3://$ARTIFACT_BUCKET
CodePipeline: デプロイアクション
aws cliを使ったコンテンツ配置を行うためにCodeBuildプロジェクトを新しく作成し、デプロイアクションを修正しています。
- CodePipeline
環境変数にビルドアクションで設定した変数を入力することでCodeBuildのプロジェクトで使用できるようになります。

- CodeBuild
version: 0.2
phases:
install:
runtime-versions:
nodejs: 18
build:
commands:
- mkdir $BuildID && cd $BuildID
- echo "Download Contants..."
- aws s3 cp s3://$ARTIFACT_BUCKET/$BuildID.zip .
- unzip ./$BuildID.zip && cd dist
post_build:
commands:
- echo "Deploy Contants..."
- aws s3 sync . s3://$S3_BUCKET
さいごに
修正後の構成でデプロイされたコンテンツにはCodeBuildのメタデータが付与されなくなりました。
コンテンツビルド後に手動承認を行いたかったのでビルドとは別のCodeBuildでデプロイを行なっていますが、デプロイ前の手動承認アクションが不要であればビルドで使用したCodeBuildのyamlでそのままコンテンツを配置するのがよいと思います。
似たような構成でのデプロイを考え中の方の助けになればと思います。