如何从跨域Ajax请求访问Content-Length标头？

Question

我的JavaScript应用程序需要在使用Ajax下载之前确定资源的长度.通常这不是问题,你只需要发一个HEAD请求并解压缩Content-Length.

var xhr = $.ajax({type:"HEAD", url: "http://own-domain/file.html"})
xhr.getResponseHeader("Content-Length")  
// "2195"

但是,资源存储在客户端的不同服务器上.(我控制的服务器).所以我使用CORS来制作跨域ajax请求,并设置服务器以响应HEAD请求的预检请求和带有自定义标头的GET/POST请求.

这在主要方面工作得很好,但Content-Length在使用CORS时,我似乎找不到从HEAD响应中提取的方法:

var xhr = $.ajax({type:"HEAD", url: "http://other-domain/file.html"})
xhr.getResponseHeader("Content-Length")
// ERROR: Refused to get unsafe header "Content-Length"

我已经在预检或响应中尝试设置各种标题,例如

Access-Control-Expose-Headers: Content-Length

规范似乎建议应该提供它.但无论我做什么,我似乎都无法向客户端提供Content-Length标头.有什么建议？

(Chrome 8)

Answer 1

我遇到了同样的问题,直到我在其他地方找到一个线程,教我在我的.htaccess上添加这一行:

Header add Access-Control-Expose-Headers "Content-Length"

然后BOOM,它得到了修复.

Answer 2

我发现所有浏览器中的 CORS 响应标头支持都有问题。在 Chrome/Safari 中，我只在 getAllResponseHeaders() 的结果中看到简单的响应标头（http://www.w3.org/TR/cors/#terminology），即使“Access-Control-Expose-Headers”标头也是如此在响应中设置。在 Firefox 3.6.13 中， getAllResponseHeaders() 不返回任何内容（甚至不返回简单的响应标头）。作为一种解决方法，我想您可以重载一个简单的响应标头以包含内容长度，但这可能会导致其他问题，并且仍然无法修复 Firefox。