google-chrome - 缓存跨域 Assets 时,Chrome 应用程序缓存不发送 `Origin` header

标签 google-chrome cross-domain cors html5-appcache application-cache

我有一个要加载和操作图像的应用程序。浏览器要求图像与应用程序来自同一源,或者图像响应允许跨源访问。我的图像通过 CDN (AWS S3) 提供,并且它们被配置为提供正确的 Access-Control-Allow-Origin使用预期的 Origin 请求时的响应 header 标题:

GET /image.png HTTP/1.1
Accept: */*
Accept-Encoding: gzip, deflate, compress
Host: <aws host url here>
Origin: localhost:5000

HTTP/1.1 200 OK
Accept-Ranges: bytes
Access-Control-Allow-Methods: GET, HEAD
Access-Control-Allow-Origin: *
Cache-Control: max-age=315360000, no-transform, public
Content-Length: 3333
Content-Type: image/png
Server: AmazonS3
Vary: Origin, Access-Control-Request-Headers, Access-Control-Request-Method

这会正常工作,除了我的应用程序还具有能够离线运行的额外要求。为了实现这一点,我在我的应用程序缓存 list 中列出了我的 CDN Assets URL:
CACHE MANIFEST

CACHE:
http://<host url here>/image.png

我遇到的问题是,一旦从 appcache 加载 Assets ,我就开始收到 Cross-origin image load denied by Cross-Origin Resource Sharing policy错误。

我读过 Chrome is supposed to send the appcache manifest origin以及缓存填充请求,但基于我在 chrome://net-internals 中的粗略探索,这在我的情况下似乎不会发生。

这是我在 chrome://net-internals/#events 中看到的内容当发出缓存填充请求时:
HTTP_TRANSACTION_SEND_REQUEST_HEADERS
--> GET /image.png HTTP/1.1
    Host: <aws host url here>
    Connection: keep-alive
    Accept-Encoding: gzip,deflate,sdch
    Accept-Language: en-US,en;q=0.8

HTTP_TRANSACTION_READ_RESPONSE_HEADERS
--> HTTP/1.1 200 OK
    Cache-Control: max-age=315360000, no-transform, public
    Accept-Ranges: bytes
    Content-Type: image/png
    Content-Length: 3333
    Server: AmazonS3

Chrome 似乎没有使用 Origin 发出请求 header ,这意味着 CDN 不知道使用 CORS header 进行响应。结果(我认为),Chrome 缓存了 vanilla 非跨域访问响应,并从 appcache 提供它。

非常欢迎任何建议或见解!谢谢阅读。

最佳答案

恐怕没有答案。
您链接的错误未解决 - 它已存档,因为几年过去了,项目成员没有采取任何行动。
跨源应用程序缓存请求不包含 Origin header 。

您可以在 crbug.com 创建新问题并且可能会受到更多关注。但是,除非我误解了 thread (请参阅第二个兼容性风险段落),我想我读到 Chrome(也许还有 Safari?)是唯一支持应用程序缓存 list 中的跨源子资源的浏览器。
如果您将您的请求添加到应用程序缓存规范中,那么所有浏览器(假设有共识和支持)将来可能会支持这一点。
改进非标准行为(以非标准方式)可能不是可行的方法,因此我不会指望 Chrome 在没有规范更新的情况下实现您的请求。
另请注意,应用程序缓存已经赢得了一些非常负面的声誉,而 Google 和 Mozilla 现在正在插入的方式是 Service Worker (在 Chrome 40 和 Opera 24 中实现,并在 Firefox 中积极开发)。

关于google-chrome - 缓存跨域 Assets 时,Chrome 应用程序缓存不发送 `Origin` header ,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/22792808/

相关文章:

css - Chrome 认为它是 IE,正在评估条件

silverlight - WCF Silverlight跨域问题

javascript - 为跨域请求覆盖 ​​XMLHttpRequest

Javascript 跨子域 XMLHTTPRequest

javascript - Knockout - Chrome 中的绑定(bind)错误

javascript - 为什么 Chrome 调试器认为封闭的局部变量未定义?

css - Safari 上的文字跑过 div

ruby-on-rails - Rails、REST 架构和 HTML 5 : Cross domain requests with pre-flight requests

apache - httpd 重复访问控制允许来源与 "Header always set"

angular - 标题未在 POST 响应中设置