添加自定义请求标头答案

【问题标题】：Adding custom request header添加自定义请求标头
【发布时间】：2013-11-13 22:29:59
【问题描述】：

我有一个 API。我正在尝试使用 Ajax Jquery 向我的 api 发送请求，但遇到问题。下面是我的 Ajax 请求。我以 JSON 格式发送数据，另外我需要添加两个请求标头（signedInUserId 和 accessToken）。但这行不通。

  $.ajax( {
                        type: "PUT",
                        contentType: 'application/json',
                        dataType: 'json',
                        beforeSend: function(xhr) { 
                            xhr.setRequestHeader("signedInUserId", "1");
                            xhr.setRequestHeader("accessToken", "testtoken");
                          },
                        url: "url to my api",
                        data: JSON.stringify(data), 
                        success: function( response ) { 
                                 // $('#successMessage').html(response);
                        },
                        complete: function() {
                            //message
           }
                    });

虽然，如果我发送没有自定义标头（signedInUserId 和 accessToken）的请求并且在我的 api 控制器中我注释了自定义标头参数，它的工作绝对正常。下面是我的 api 控制器代码。

    @RequestMapping(value = "test.json", method = { PUT })
public @ResponseBody
Map<String, ? extends Object> test(HttpSession session, @RequestHeader Integer signedInUserId, @RequestHeader String accessToken, @RequestBody MyTestModel myTestModel) {

// working

}

我很困惑为什么我发送自定义标头时它不起作用，发送自定义标头是否有问题？

编辑：以下是我的请求和响应标头。

       Request URL:http URL....
       Request Method:OPTIONS
       Status Code:200 OK
       Request Headersview parsed
       OPTIONS /Url/url/add.json HTTP/1.1
       Host: local host:8080
       Connection: keep-alive
       Access-Control-Request-Method: PUT
       Origin:url
       User-Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_8_4) AppleWebKit/537.36   (KHTML, like Gecko) Chrome/30.0.1599.101 Safari/537.36
       Access-Control-Request-Headers: accept, accesstoken, signedinuserid, content-       type
       Accept: */*
       Referer: url
       Accept-Encoding: gzip,deflate,sdch
       Accept-Language: en-US,en;q=0.8
       Response Headersview parsed
       HTTP/1.1 200 OK
       Server: Apache-Coyote/1.1
       Access-Control-Allow-Origin: *
       Access-Control-Allow-Methods: GET, OPTIONS, POST, PUT, DELETE
       Access-Control-Allow-Headers: Content-Type, x-requested-with
       Access-Control-Max-Age: 1800
       Allow: GET, HEAD, POST, PUT, DELETE, TRACE, OPTIONS
       Content-Length: 0
       Date: Sun, 03 Nov 2013 19:11:20 GMT

【问题讨论】：

什么不起作用....在浏览器控制台中检查请求以查看状态、发送的内容（包括标头）、返回的内容等。在对 ajax 进行故障排除时需要隔离客户端与服务器
好吧，在 Firefox 上，它只是握手，之后不发送 PUT 请求，也不返回任何错误/响应。在 Chrome 上，我收到此错误：“Access-Control-Allow-Headers 不允许请求标头字段 accessToken。”
所以在您的网络选项卡中，您根本看不到任何指向在 ajax 中设置的 url？
用标题和响应更新了我的问题。当我按下按钮时，我可以看到它请求 url，但请求失败/取消并显示此错误“XMLHttpRequest 无法加载 localhost:8080/test/quote/add.json。Access-Control-Allow-Headers 不允许请求标头字段 accessToken。”
这发生在 chrome 中 ^ 但在 Firefox 中，它在 OPTION requets 后没有做任何事情。

标签： jquery ajax api spring-mvc xmlhttprequest

【解决方案1】：

显然问题是由于服务器响应中允许的标头。在我的服务器设置中，响应的允许标头如下：

response.addHeader("Access-Control-Allow-Headers", "Content-Type, x-requested-with");

所以，我在允许的标头中添加了两个标头 accessToken 和 signedInUserId，响应标头现在如下所示：

response.addHeader("Access-Control-Allow-Headers", "Content-Type, accessToken, signedInUserId, x-requested-with");

我猜这就是为什么请求没有超出预检请求 (OPTION) 的问题，因为服务器发送的响应标头中不允许我发送的标头。如果我错了，请纠正我。

【讨论】：