在（例如 Angular）SPA 中使用预签名的 url 会破坏浏览器缓存

Usage of presigned urls in a (e.g. Angular) SPA blows up browser cache

在我们的项目中，我们决定使用预签名 url 作为基本身份验证机制。

减少了我们的设置涉及

我们使用预先签名的 urls 从客户端直接上传和下载文件到存储服务器。

上传流程（简化）：

到目前为止一切顺利。最大的问题是 "download" 流程。

这很好用，但会使浏览器缓存达到数 GB 的 RAM。

发生这种情况是因为在多次调用中生成的预签名 url 不相同，并且在每个请求的授权部分（例如，持有新的生命周期）不同。当用户在分页列表中向前和向后单击时，客户端将收到不同的 url，浏览器缓存将它们视为不同的图像。

到目前为止，这似乎是浏览器端的正确行为（不同的 url 等于不同的图像）。

到目前为止，这似乎是 api 方面的正确行为（新调用将 return 新的生命周期）。

是否有任何预期的方法来处理这个问题？

流量本身是错误的吗？

当运行多个 api 实例时，除了实施集中式预签名 url 缓存外，还有什么方法可以解决这个问题？

可能有人也可以为我可以使用的有意义的标签提供建议。

当前流中对 pre-signed 资源的每个请求都会 browser/client 向 S3 发出新请求。

因此，在生成预签名 URL 时，无需指定额外的响应 header 来控制客户端中的缓存策略，就无法享受浏览器缓存的优势。对于 no-cache 的 pre-signed 请求，可以在响应 header 中设置 Cache-Control 响应 header。 ¹

我建议更好的流程是让 pre-signed URL 的到期时间在 5 到 15 分钟之间，并设置 Cache-Control在pre-signedURL到max-age:<expire-time-in-secs>的响应header秒中。

使用这个新流程，您需要确保 API 服务器仅 returns 在到期时间后 pre-signed URLS 的新列表还保留服务器端缓存。您可以缩短 API 服务器的响应时间，并避免为浏览器对缓存资源的不必要请求提供服务。