對於使用cloudfront在S3上托管的靜態站點，如何使index.html的緩存無效？

Question

所以我在s3上使用cloudfront dist托管了我的角度應用程序。 我做文件修改（使用grunt filerev）以確保我永遠不會得到陳舊的內容。 但是，我應該如何對index.html文件進行版本控制。 它是必需的，因為所有其他文件都在index.html中引用。

我已將我的存儲桶配置為靜態站點。 因此，當我在url中引用存儲桶時，它只會獲取index.html。

Cloudfront說你應該將最小TTL設置為0，因此它總是會命中原點來提供內容。 但是，我不需要這個，因為我正在對我的所有文件進行文件修訂（index.html除外）。 我可以利用cdn緩存這些文件。

他們還說，為了使單個對象無效，請將max-age標頭設置為0.我嘗試將以下內容添加到我的index.html

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

但是，一旦您在s3上傳，這就不會反映出來。 我是否需要使用s3cmd或儀表板在s3上顯式設置標頭？ 每當index.html更改並上傳它時，我是否需要這樣做？

我知道我可以使用cmd使單個文件無效，但它是一個重復的過程，如果它只是通過在s3上部署就可以解決它本身。

Answer 1

雖然如果你使用的是s3cmd，但是接受的答案是正確的，我使用的是AWS CLI，所以我做的是以下兩個命令：

首先，要實際部署代碼：

aws s3 sync ./ s3://bucket-name-here/ --delete

然后，在CloudFront上創建失效：

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

Answer 2

回答我自己的問題。 我使用s3cmd工具將我的站點部署到S3，並且您可以提供一個選項來使所有已更改文件的CloudFront緩存無效（在dist文件夾和S3存儲桶之間進行差異）。 這會使更改的所有文件的緩存無效，包括索引文件。 通常需要大約15-20分鍾來反映生產中的新變化。

這是命令

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

^{注意：在macOS上，您可以通過以下方式安裝此工具： brew install s3cmd 。}

希望這可以幫助。

Answer 3

您可以使用Lambda自動執行流程。 它允許您創建一個函數，該函數將執行某些操作（在您的情況下為對象失效）以響應某些事件（S3中的新文件）。

更多信息： https ： //aws.amazon.com/documentation/lambda/

Answer 4

將本地目錄與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

第一個命令只是普通同步，第二個命令啟用S3以返回除index.html和robots.txt之外的所有文件的緩存控制。

然后您的SPA可以完全緩存（ index.html除外）。

Answer 5

如果使用--cf-invalidate s3cmd sync並使用--cf-invalidate選項，則可能還必須根據您的設置指定--cf-invalidate-default-index 。

從手冊頁：

使用Custom Origin和S3靜態網站時，使默認索引文件無效。

這將確保您的索引文檔（很可能是index.html）無效，否則無論是否通過同步更新，都將跳過該索引文檔。