如何讓CloudFront永不緩存S3存儲桶上的index.html

我有一個S3存儲桶上託管的React應用程序。代碼使用yarn build縮小（這是一個基於創建反應的應用程序）。該build文件夾看起來像：如何讓CloudFront永不緩存S3存儲桶上的index.html

build 
├── asset-manifest.json 
├── favicon.ico 
├── images 
│   ├── map-background.png 
│   └── robot-icon.svg 
├── index.html 
├── js 
│   ├── fontawesome.js 
│   ├── packs 
│   │   ├── brands.js 
│   │   ├── light.js 
│   │   ├── regular.js 
│   │   └── solid.js 
│   └── README.md 
├── service-worker.js 
└── static 
    ├── css 
    │   ├── main.bf27c1d9.css 
    │   └── main.bf27c1d9.css.map 
    └── js 
     ├── main.8d11d7ab.js 
     └── main.8d11d7ab.js.map

我再也不想index.html被緩存，因爲如果我更新的代碼（使進制後綴main.*.js更新），我需要的用戶下次訪問回暖的<script src>更改爲index.html指向更新的代碼。

在CloudFront中，我似乎只能排除路徑，排除「/」似乎不能正常工作。我在更改代碼時遇到了奇怪的行爲，如果我刷新了，我會看到它，但如果我退出Chrome並返回，出於某種原因，我看到過時的代碼。

我不想在每個代碼版本（通過CodeBuild）觸發無效。有沒有其他的方法？我認爲其中一個挑戰是，由於這是一個使用React Router的應用程序，我必須通過將錯誤文檔設置爲index.html並強制HTTP狀態200而不是403來做一些詭計。

來源

2017-08-17 ffxsam

如果您從不想要要緩存index.html，請僅在該文件上設置Cache-Control: max-age=0標頭。 CloudFront將向發出請求，回覆您的原始S3存儲桶請求，但聽起來像這是期望的行爲。

如果你想設置較長的到期時間和手動無效CloudFront的緩存，可以使用一個*或/*作爲無效路徑（不/如你所提到的）。但是，對於全球所有CloudFront邊緣節點來說，這可能需要長達15分鐘的時間才能反映您原點的變化。

來源

2017-08-17 11:44:46

你是在談論在S3對象元數據中添加該頭文件嗎？而且，無論URL路徑如何，我都不希望index.html緩存。我更關心緩存相關文件（JS文件，CSS，圖像）。 – ffxsam

是的：它在AWS文檔中被稱爲「系統定義的元數據」：http://docs.aws.amazon.com/AmazonS3/latest/user-guide/add-object-metadata.html –

很好，這是有幫助！在複製索引文件時，我已經設置了我的部署過程以使用'aws s3 cp --cache-control max-age = 0'。奇蹟般有效。 – ffxsam

如何讓CloudFront永不緩存S3存儲桶上的index.html

回答

相關問題