jQuery跨域请求响应头

Question

我正在使用html数据类型进行跨域ajax请求。如果我包含下面这行代码，它们可以正常工作。

Access-Control-Allow-Origin

来自服务器的响应中。问题是我需要获取服务器响应中的某些标头，但无论我做什么，除了“内容类型”之外的响应标头都返回null。

jQuery发出请求，检索包括标头在内的响应（我可以从流量中看到），但它不会解析它。

我尝试使用

crossDomain: true

这并没有起到帮助作用。以下是来自服务器的示例响应。

Access-Control-Allow-Origin:*
Cache-Control:private
Content-Encoding:gzip
Content-Length:514
Content-Type:text/html; charset=utf-8 
X-MYRESPONSEHEADER:1

如果请求和响应文档在同一台服务器上。

 success: function (data, status, xhr) {
        totalRows = xhr.getResponseHeader("X-MYRESPONSEHEADER");

运行良好。我也尝试将$.ajax分配给变量，例如：

var jQxhr = $.ajax(.....

我不明白为什么它不能被解析，因为jQuery实际上发出请求并获取响应。

有什么想法吗？我有什么遗漏吗？

更新或Dragon的评论

发送到请求的标头

HTTP/1.1 200 OK
Cache-Control: private
Content-Type: text/html; charset=utf-8
Content-Encoding: gzip
Vary: Accept-Encoding
Server: Microsoft-IIS/7.5
Access-Control-Allow-Origin: *
Access-Control-Allow-Headers: X-MYRESPONSEHEADER
Access-Control-Allow-Methods: POST
Access-Control-Allow-Methods: GET
X-MYRESPONSEHEADER: 24
X-AspNet-Version: 4.0.30319
X-Powered-By: ASP.NET
Date: Wed, 29 Feb 2012 11:34:21 GMT

内容长度：514

- nLL

Answer 1

如果你正在使用 AWS S3（我认为这适用于其他情况），问题可能是缺少 CORS 配置标签。我遇到了类似的问题，缺少了配置。下面是我的完成配置：

<?xml version="1.0" encoding="UTF-8"?>
<CORSConfiguration xmlns="http://s3.amazonaws.com/doc/2006-03-01/">
    <CORSRule>
        <AllowedOrigin>http://localhost:3000</AllowedOrigin>
        <AllowedMethod>GET</AllowedMethod>
        <AllowedMethod>POST</AllowedMethod>
        <MaxAgeSeconds>3000</MaxAgeSeconds>
        <AllowedHeader>*</AllowedHeader>
        <ExposeHeader>*</ExposeHeader>
    </CORSRule>
</CORSConfiguration>

AllowedHeader设置了Access-Control-Request-Headers头，而ExposeHeader设置了Access-Control-Expose-Headers头。如果没有这些头信息，浏览器将不允许JavaScript使用返回的头信息。

- Steven Soroka

---

S3出现错误：ExposeHeader“*”包含通配符。我们目前不支持ExposeHeader的通配符。 - Dane W

同样的问题——通配符无法使用。但在我的情况下，我只需要浏览器公开位置标头，这个答案使用显式定义的标头就可以解决。 - Ben Alavi

Answer 2

要读取服务器响应中除content-type以外的标头，服务器必须提供Access-Control-Expose-Headers，例如：

Access-Control-Expose-Headers: X-MYRESPONSEHEADER 

@dragon的回答提到Access-Control-Allow-Headers，它仅控制客户端在向服务器发起请求时可以发送哪些标头。

这里有一个有用的CORS教程：http://www.html5rocks.com/en/tutorials/cors/

- tekumara

Answer 3

您需要在服务器响应中添加另一个CORS特定的头部Access-Control-Allow-Headers。在这种情况下，

Access-Control-Allow-Headers: X-MYRESPONSEHEADER

参考：https://developer.mozilla.org/zh-CN/docs/Web/HTTP/CORS

- dragon

---

它对我没用。你认为我需要将$.ajax分配给一个变量吗？ - nLL

@nLL 你可以为每个发出的两个请求添加完整的请求/响应头吗？第一个请求是OPTIONS，第二个请求是GET/POST。 - dragon

我不会手动执行任何OPTIONS请求，也没有看到jQuery这样做。这是流程的一部分吗？如果是，那么jQuery怎么知道呢？ - nLL

这是一个过程的一部分，在某些情况下，浏览器在进行跨域调用之前会按照规范执行此操作。请注意，jQuery不会发起此调用 - 浏览器会这样做。更多信息，请参见https://developer.mozilla.org/en/http_access_control#Preflighted_requests。 - dragon

Access-Control-Allow-Headers 只控制可以发送哪些请求头，不影响响应头。 - Tal Lev-Ami

Answer 4

这是适合我的配置。我把它放在Java过滤器过滤方法中。有些标题只需要与预检请求（method =“OPTIONS”）一起发送，无需每次都发送它们。

请注意，“Authorization”标头还需要“Access-Control-Allow-Credentials”。

 HttpServletResponse resp = (HttpServletResponse) res;
 resp.addHeader("Access-Control-Allow-Origin", "http://your_domain:your_port");
 resp.addHeader("Access-Control-Allow-Credentials", "true");
 if (((HttpServletRequest) req).getMethod().equals("OPTIONS")) {
       resp.addHeader("Access-Control-Allow-Methods", "GET, POST, PUT, DELETE");
      resp.addHeader("Access-Control-Allow-Headers", "Authorization");
      return;
  }

- vinga