Bitbucket PipelinesでS3とCloudFrontにウェブサイトをデプロイする
この記事では、静的ウェブサイトをS3バケットにデプロイし、自動的にキャッシュ無効化を行う方法を学ぶ。

BitbucketはAtlassian製品であり、Gitベースのコードストアと、Jiraを使用するコラボレーションチーム向けに最適化されたCI/CDツールだ。Bitbucketでコードを変更し、リビジョンと履歴を保持する場合、デプロイメントのための自動化も必要になる。
CI/CDはすべての自動化のためのもので、Continuous Integration(継続的インテグレーション)とContinuous Delivery(継続的デリバリー)を意味する。この記事では、CIとCDを同時に使用する。
「Bitbucketの使い方」は省略し、世界中に配信するためにCloudFrontを使用しているAWS S3への継続的デプロイメントのためのBitbucket Pipelinesについて紹介する。
静的ホスティングがサポートされたS3バケットを作成したら、ローカルフォルダからS3バケットにsyncする必要がある。通常、ローカルフォルダをS3バケットに100%同期するにはaws s3 sync LOCAL_FOLDER/ s3://STATIC_HOSTING_ENABLED_BUCKET_NAME --deleteコマンドを実行する。
配信にCloudFrontを使用している場合、ウェブサイトにアクセスすると古いコンテンツが表示される。その理由は、CloudFrontがすべてのエッジロケーションですべてのコンテンツをキャッシュし、エッジロケーションからコンテンツを配信しているからだ。新しいコンテンツのために「キャッシュを無効化」し、エッジロケーションで再キャッシュする必要がある。
S3とCloudFrontに使用するIAMポリシー
最大限のセキュリティのために、IAMポリシーには最大限の制限と最小限の許可を設定するのが本当に好きだ。以下のポリシーを確認できる:
S3バケットIAMポリシー
{
"Version": "2012-10-17",
"Statement": [
{
"Sid": "S3BucketPolicy",
"Effect": "Allow",
"Action": [
"s3:PutObject",
"s3:GetObject",
"s3:ListBucket",
"s3:DeleteObject"
],
"Resource": [
"arn:aws:s3:::BUCKET_NAME",
"arn:aws:s3:::BUCKET_NAME/*"
],
"Condition": {
"ForAnyValue:IpAddress": {
"aws:SourceIp": [
"34.199.54.113/32",
"34.232.25.90/32",
"34.232.119.183/32",
"34.236.25.177/32",
"35.171.175.212/32",
"52.54.90.98/32",
"52.202.195.162/32",
"52.203.14.55/32",
"52.204.96.37/32",
"34.218.156.209/32",
"34.218.168.212/32",
"52.41.219.63/32",
"35.155.178.254/32",
"35.160.177.10/32",
"34.216.18.129/32",
"3.216.235.48/32",
"34.231.96.243/32",
"44.199.3.254/32",
"174.129.205.191/32",
"44.199.127.226/32",
"44.199.45.64/32",
"3.221.151.112/32",
"52.205.184.192/32",
"52.72.137.240/32"
]
}
}
}
]
}デプロイメントはBitbucket Pipelinesで実行され、これらのIPアドレスはBitbucket PipelinesのアウトバウンドIP用だ。リファレンスはこちら: https://support.atlassian.com/bitbucket-cloud/docs/what-are-the-bitbucket-cloud-ip-addresses-i-should-use-to-configure-my-corporate-firewall/
CloudFrontキャッシュ無効化IAMポリシー
Bitbucket Pipelines経由でCloudFrontキャッシュ無効化コマンドを実行するには、以下のIAMポリシーを使用できる。S3 Sync操作が許可されている同じAWSユーザーにこのポリシーをアタッチできる。
{
"Version": "2012-10-17",
"Statement": [
{
"Sid": "CloudFrontCacheInvalidationPolicy",
"Effect": "Allow",
"Action": "cloudfront:CreateInvalidation",
"Resource": "arn:aws:cloudfront::ACCOUNT_ID:distribution/CF_DISTRIBUTION_ID",
"Condition": {
"ForAnyValue:IpAddress": {
"aws:SourceIp": [
"34.199.54.113/32",
"34.232.25.90/32",
...
]
}
}
}
]
}Bitbucket Pipelines
以前に、CI/CD操作用のBitbucket Pipelinesを実行するためのAWSユーザーを既に作成している。今度は環境変数をリポジトリに設定する時だ。AWS_ACCESS_KEY_IDとAWS_SECRET_ACCESS_KEYで十分だ。

パイプラインファイル
このステップでは、S3 SyncとCloudFrontキャッシュ無効化を実行するためのbitbucket-pipelines.ymlファイルを作成する。
pipelines:
branches:
main:
- step:
name: Deploy to S3 Bucket
deployment: Production
script:
- pipe: atlassian/aws-s3-deploy:1.1.0
variables:
AWS_ACCESS_KEY_ID: $AWS_ACCESS_KEY_ID
AWS_SECRET_ACCESS_KEY: $AWS_SECRET_ACCESS_KEY
AWS_DEFAULT_REGION: AWS-REGION
S3_BUCKET: 'S3_BUCKET_NAME'
DELETE_FLAG: 'true'
LOCAL_PATH: './'
- pipe: atlassian/aws-cloudfront-invalidate:0.1.1
variables:
AWS_ACCESS_KEY_ID: $AWS_ACCESS_KEY_ID
AWS_SECRET_ACCESS_KEY: $AWS_SECRET_ACCESS_KEY
AWS_DEFAULT_REGION: AWS-REGION
DISTRIBUTION_ID: CLOUDFRONT-DIST-IDmainブランチに新しいコミットがあると、パイプラインがトリガーされ、すぐに実行を開始する。その後、Bitbucketリポジトリのルートパス"/"がS3バケットに同期され、キャッシュ無効化が即座に実行されて、新しいウェブサイトがすべてのエッジロケーションに適用される。
この記事が役立つことを願っている。質問があれば、コメントを残してほしい。できるだけ早く返信する。
Ercan の他のサイト
同じ著者、別の領域のサイトが2つ。