AWS CloudFrontでエッジサーバのキャッシュを無効化する方法

AWS CloudFrontでエッジサーバのキャッシュを無効化する方法

CloudFront + S3という構成でウェブホスティングしているとします。CDNを利用すれば近くのエッジサーバにキャッシュされるので、ウェブブラウズが早くなりますが、要件によってキャッシュさせたくない場合があると思います。

CloudFrontでキャッシュ無効化する手順です。

S3でウェブホスティング

S3にindex.htmlでも配置してホスティングします。

キャッシュ無効化する際にS3のバケット自体のメタデータに以下を追加する必要があります。

ヘッダ
Cache-Control no-store

no-storeをメタデータで指定しておけば一切キャッシュしません。no-cacheではないので注意です。

実際はCloudBerry Explorerを使用しないとバケット単位にメタデータは設定できないのでオブジェクト(ここではindex.html)にメタデータを設定します。

AWS CloudFrontでエッジサーバのキャッシュを無効化する方法

CloudFrontの設定

CloudFrontの設定をします。S3と紐づけますが割愛します。

主にTTLを0にするという設定です。

AWS CloudFrontでエッジサーバのキャッシュを無効化する方法

最後に「Create Distribution」ボタンを押して作成します。※20分ほどかかります

AWS CloudFrontでエッジサーバのキャッシュを無効化する方法

上記画面のDomain Name欄のxxx.cloudfront.netをコピーして、xxx.cloudfront.net/index.htmlにブラウザからアクセスします。

AWS CloudFrontでエッジサーバのキャッシュを無効化する方法

こんな感じでアクセスできたらOKです。

キャッシュされていないことの検証

キャッシュされているかどうかは、ヘッダ情報のX-Cacheで判断ができます。

X-Cache 意味
Hit from cloudfront キャッシュされている
RefreshHit from cloudfront キャッシュされているがTTL切れ
Miss from cloudfront キャッシュされていない

参考サイト:CloudFront キャッシュ動作確認

curlコマンドを何度叩いてもMiss from cloudfrontであれば、キャッシュ無効化されていることの確認ができます。

スポンサーリンク
  • このエントリーをはてなブックマークに追加
  • Evernoteに保存Evernoteに保存
スポンサーリンク

コメントをどうぞ

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

CAPTCHA