AWS CloudFront如何更新现有的S3文件？

Question

我使用来自AWS的CloudFront，并且拥有一个S3静态网站。 我使用ReactJs，并且更改了大多数页面上的一些文本。 我现在的问题是我使用

npm运行构建

产生生产应用程序。 我想在S3存储桶中更新AWS上的内容（我之前上传了相同的文件），但是发生了两件事：

-当我以隐身方式访问时，一切正常，我得到了网站的更新版本

-当我使用以前用于访问网站的Web浏览器以普通模式访问时，仍会得到旧版本的文件。

我访问了AWS文档，并且有两个解决方案：

-等待24小时让CloudFront在边缘位置缓存文件

-使用文件的版本名称（例如，将image.jpg的名称更改为image_1.jpg； image_2.jpg等）

我肯定会选择第二种选择，这确实很耗时，但肯定少于24小时。 我应该更改生成的静态文件还是静态静态文件的名称？

还有其他解决方案吗？

在上传到AWS S3之前，我还没有尝试过创建一个文件夹（例如V1）并上传我的react文件。 进行更改时，我将文件夹称为V2，依此类推。

Answer 1

使用版本名称是最可靠的方法。 它使您可以完全控制缓存的行为，而不会弄乱CloudFront。 是的，每次有新版本更新文件名。 顺便说一句，如果您使用create-react-app引导了您的react应用，那么构建过程会默认执行该操作。 每次更改包时，它将为每个包命名一个唯一的哈希。 这样，您可以在浏览器和CF中利用长期缓存来保存文件。

您可能仍需要使每个部署的根index.html无效，因为其名称在版本之间不会更改。