S3でクラウドフロントでホストされている静的サイトのindex.htmlのキャッシュを無効にするにはどうすればよいですか？

Question

私は、s3上でクラウドフロントdistを使って私の角型アプリケーションをホストしました。私はファイルのリビジョンアップ（grunt filerevを使用して）を行って、古いコンテンツを取得しないようにします。しかし、どうすればindex.htmlファイルをバージョンアップするべきですか？他のすべてのファイルはindex.html内で参照されるため、その必要があります。

静的サイトとして使用するようにバケットを設定しました。だから、私はURLのバケットを参照すると、index.htmlを取得します。

Cloudfrontでは、min TTLを0に設定する必要があるため、コンテンツを配信するために常に起源に当たると言います。しかし、私はすべてのファイル（index.htmlを除く）をファイルリビジョンしているので、これは必要ありません。私はこれらのファイルのためにcdnキャッシングを利用することができます。

彼らはまた、私は私のindex.htmlに

<meta http-equiv="Cache-Control" content="public, must-revalidate, proxy-revalidate, max-age=0"/> 

を以下を追加してみました。しかしあなたがアップロードしたら、これが反映されていない単一のオブジェクトを無効にするために、0に最大エージングヘッダーを設定することを言いますs3。 s3cmdまたはdashboardを使用してs3にヘッダーを明示的に設定する必要はありますか？ index.htmlが変更され、アップロードされるたびにこれを行う必要がありますか？

cmdを使用して1つのファイルを無効にすることはできますが、繰り返しプロセスがあることに気づいています。それはs3に展開するだけで大​​丈夫です。

Answer 1

自分の質問に答えます。 s3cmd toolを使用して私のサイトをS3に配備しました。あなたのdistフォルダとS3バケットの間の差分を変更したすべてのファイルのCloudFrontキャッシュを無効にするオプションがあります。これにより、インデックスファイルを含むすべてのファイルのキャッシュが無効になります。新しい生産の変化を反映させるには通常15〜20分程度かかります。 brew install s3cmd：MacOSの上で、あなたが経由でこのツールをインストールすることができます。ここでは

は、コマンド

s3cmd sync --acl-public --reduced-redundancy --delete-removed --cf-invalidate [your-distribution-folder]/* s3://[your-s3-bucket] 

^{注意です。}

これが役に立ちます。

まず、実際に展開するためのコード：

aws s3 sync ./ s3://bucket-name-here/ --deleteあなたがs3cmdを使用している場合、受け入れ答えは正しいが

Answer 2

ラムダを使用してプロセスを自動化することができます。特定のイベント（S3の新しいファイル）に応答して特定のアクション（あなたの場合はオブジェクトの無効化）を実行する関数を作成することができます。ここ

詳細情報： https://aws.amazon.com/documentation/lambda/

Answer 3

は、私がAWS CLIを使用していた、私がしたので、どのような次の2つのコマンドでした

aws cloudfront create-invalidation --distribution-id <distribution-id> --paths /index.html

Answer 4

：

その後、CloudFrontの上の無効化を作成しますs3cmd syncを使用し、--cf-invalidateオプションを使用する場合は、設定に応じて--cf-invalidate-default-indexも指定する必要があります。manページから

：

When using Custom Origin and S3 static website, invalidate the default index file.

また、これは同期を介して更新するかどうそうにかかわらず、スキップされます、あなたのインデックス文書、最も可能性が高いのindex.htmlを、無効にすることを保証します。

Answer 5

あなたはS3でローカルディレクトリを同期すると、あなたがこれを行うことができます：

aws s3 sync ./dist/ s3://your-bucket --delete 

aws s3 cp \ 
    s3://your-bucket s3://your-bucket \ 
    --exclude 'index.html' --exclude 'robots.txt' \ 
    --cache-control 'max-age=604800' \ 
    --metadata-directive REPLACE --acl public-read \ 
    --recursive 

最初のコマンドは普通の同期で、2番目のコマンドは、index.html以外のすべてのファイルのキャッシュ制御を返すためにS3を可能にし、 robots.txt。

次に、SPAを完全にキャッシュできます（index.htmlを除く）。