#はじめに
Cloudfrontのキャッシュ削除は、AWSコンソールから操作しますが、チームで開発時やお客さんに納品後、お客さん側でキャッシュ削除する場合、キャッシュ削除するためだけにIAMユーザーを作成するのは手間だったり不都合があったため、S3に配置したhtmlでEC2を操作できる仕組みを作成しました。
ただし、メンバー以外に操作されないよう、S3にはCloudfront OAI、CloudFrontとApiGatewayにはBasic認証をかけてます。
#構成図
CloudFrontのキャッシュ削除のコンソール画面用のhtmlをS3に配置して、CloudFrontで配信し、S3からアクセスできないよう制限します。
#完成ページ
↓クリックすると、CloudFrontのキャッシュ削除され、画面遷移します。
#前提条件
- キャッシュしたいCloudfrontを作成ずみ
#流れ
- Lambda作成
- ApiGatewayを設定
- htmlを作成
- htmlをS3にアップロード
- Cloudfrontからページを読み込むように設定
- WebページにBasic認証を有効化する
- htmlからLambda実行後、htmlページにリダイレクトさせる
#Lambdaを作成
###1. 関数の作成
- 一から作成
- 関数名を入力:
cloudfront-cache-clear - ランタイムはnode.js python どちらでも
- アクセス権限は、既存のロールで、先程作成したロールを選択し、lambda作成
###2. コード編集
下記のコードをコピペして、デプロイをします
node.jsの場合
const AWS = require('aws-sdk');
const cf = new AWS.CloudFront();
// 削除するディストリビューションID
const distributionId = process.env['distributionId'];
exports.handler = async (event, context) => {
const timestamp = new Date().getTime().toString();
const params = {
DistributionId: distributionId,
InvalidationBatch: {
CallerReference: timestamp,
Paths: {
Quantity: 1,
Items: ['/weather/sea/*'],},
}
};
const data = await cf.createInvalidation(params).promise();
// Lambda実行後、リダイレクトさせる場合
// context.succeed({Location: 'https://xxxxx.cloudfront.net/result.html'});
};
Pythonの場合
import boto3
import time
import os
def lambda_handler(event, context):
client = boto3.client('cloudfront')
invalidation = client.create_invalidation(
DistributionId=os.environ['distributionId'],
InvalidationBatch={
'Paths': {
'Quantity': 1,
'Items': [
'/*'
]
},
'CallerReference': str(time.time())
})
# Lambda実行後、リダイレクトさせる場合
# header_location = ("https://aaaaaa.cloudfront.net/")
# result = {"Location": header_location}
# return result
参考記事
###3. 設定から環境変数を変更
環境変数は、キー：distributionId とし、キャッシュ削除したいディストリビューションIDを値と設定する
###4. IAMロールに、CreateInvalidationを追加します。
###5. タイムアウト時間を伸ばす
一般設定のタイムアウトをデフォルト値3秒であり、タイムアウトでエラーになるのを防ぐため、20秒に変更します。
###6. テストを実行
#ApiGatewayを設定
- REST APIの構築をクリックします
1. 以下の設定で作成します
- ソースを作成します
-
リソース名（
cache）を入力し、リソースを作成をクリックします
-
GETメソッドを作成します
先程作成したLambda関数を紐付けて作成します。
-
テストをクリックし、Lambdaが起動していることを確認します。
-
APIをデプロイすると（ステージ名は
prod）、URLの呼び出しが表示されます。
呼び出しURLのprodの後ろに、cacheを加え、URLに遷移するとキャッシュが削除されます。
例↓
https://aaaaaa.execute-api.ap-northeast-1.amazonaws.com/prod/cache
#html作成
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>
</head>
<body>
<a href="https://aaaaaa.execute-api.ap-northeast-1.amazonaws.com/prod/cache">
キャッシュを全削除します
</a>
</body>
</html>
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>
</head>
<body>
<p>キャッシュ削除されました</p>
<a href="https://aaaaaa.cloudfront.net/">戻る</a>
</body>
</html>
#残りの作業
残りの作業は以下の通りです。
以前にも同様の作業を行いましたので、こちらの記事を参考に進めていただければと思います。
⑤htmlをS3にアップロード
⑥Cloudfrontからページを読み込むように設定
⑦WebページにBasic認証を有効化する
⑧htmlからLambda実行後、htmlページにリダイレクトさせる