caching - 缓存的非 CORS 响应与新的 CORS 请求冲突

Question

要点:

我有一个页面使用从 s3 加载图像的标签(HTML img 标签)，并且我有一个使用 xmlhttprequest 的页面。标记加载在没有 CORS header 的情况下进行缓存，因此 xmlhttprequest 会看到缓存的版本，检查其 header 并因跨源错误而失败。

详细信息:

编辑:在 safari 5.1.6 和 chrome 21.0.1180.89 中均失败。在 Firefox 14 中运行良好。

使用 S3 的新 CORS，我设置了一个 CORSRule，如下所示:

<CORSRule>
  <AllowedOrigin>*</AllowedOrigin>
  <AllowedMethod>GET</AllowedMethod>
  <AllowedMethod>HEAD</AllowedMethod>
  <MaxAgeSeconds>0</MaxAgeSeconds>
  <AllowedHeader>*</AllowedHeader>
</CORSRule>

如果我从 S3 请求图像而没有在请求 header 中设置原点，我会在响应中返回没有任何 CORS header 的图像。

此获取的缓存和后续 CORS 请求(在请求 header 中设置来源的请求)会被拒绝，因为浏览器使用缓存中的非 CORS 版本。

解决这个问题的最佳方法是什么？我可以设置一些东西，以便非 CORS 版本永远不会被缓存吗？我是否应该通过将 ?some_flag 附加到请求的 url 来区分 CORS 请求？

理想情况下，即使请求不包含“origin”，我也会让 S3 始终发回所需的 CORS header 。

Answer 1

我也遇到了同样的问题。正如 @monsur 所说，问题是 S3 没有设置“Vary: Origin” header ，尽管它应该设置。不幸的是，据我所知，没有办法让 S3 发送该 header 。但是，当您需要 CORS 时，您可以通过向请求添加查询字符串参数(例如 ?origin=example.com)来解决此问题。查询字符串强制浏览器不使用缓存的资源。

理想情况下，当启用 CORS 时，cloudfront 和 S3 会发送 Vary:Origin header ，并且/或 Webkit 会隐式改变 Origin header ，我认为 Firefox 会这样做，因为它不存在此问题。