angularjs – 在Access-Control-Request-Headers下添加$http标头

发布时间：2020-12-17 17:53:56 所属栏目：安全来源：网络整理

导读：每当我尝试向我的$http请求添加自定义请求标头时,标头不会显示在请求中,而是来自Access-Control-Request-Header,如Access-Control-Request-Headers：accept,testHeader 请参阅以下chrome的网络选项卡中的输出： Request Headers: OPTIONS /v/xyx/abc/query?q

每当我尝试向我的$http请求添加自定义请求标头时,标头不会显示在请求中,而是来自Access-Control-Request-Header,如Access-Control-Request-Headers：accept,testHeader
请参阅以下chrome的网络选项卡中的输出：

Request Headers: 
    OPTIONS /v/xyx/abc/query?q=SELECT%20duration%20FROM%20TimeTable HTTP/1.1
    Host: example.com
    Connection: keep-alive
    Access-Control-Request-Method: GET
    Origin: http://localhost
    User-Agent: XXXXXXXX Chrome XXXXXXX
    Access-Control-Request-Headers: accept,testHeader
    Accept: */*
    Referer: http://localhost/test/
    Accept-Encoding: gzip,deflate,sdch
    Accept-Language: en-US,en;q=0.8

然而,我期待的是：

Request Headers: 
    OPTIONS /v/xyx/abc/query?q=SELECT%20duration%20FROM%20TimeTable HTTP/1.1
    Host: example.com
    Connection: keep-alive
    Access-Control-Request-Method: GET
    Origin: http://localhost
    User-Agent: XXXXXXXX Chrome XXXXXXX
    Accept: application/json
    testHeader: zdhfguwe87fg8378287efijb8
    Referer: http://localhost/test/
    Accept-Encoding: gzip,en;q=0.8

如何防止这种情况发生并在Request header下显示标题？

请参阅Angularjs中我所遵循的$http服务的config：

//***TRIED BOTH OF THESE: 
//***TRY#1 $http.get(url,{headers:{"Accept": "application/json","testHeader": "zdhfguwe87fg8378287efijb8"}}).then(.......
//***TRY#2
      $http({
        method: 'GET',url: url,headers: {
          "Accept": "application/json","testHeader": "zdhfguwe87fg8378287efijb8"
        }
      })
      .then(
        function(){
          //success
          console.log(arguments);
        },function(){
          //fail
          console.log(arguments);
        });

解决方法

这是预期的行为,作为CORS预检的一部分,这是一个OPTIONS请求.一旦此请求成功,浏览器将使用自定义标头触发实际的GET请求,因为服务器已接受它们.

对于CORS请求,默认情况下仅批准一组有限的标头,因此要添加其他标头(包括您的自定义标头),CORS预检请求需要向服务器请求Access-Control-Request-Headers HTTP标头的权限.

见：https://developer.mozilla.org/en-US/docs/Web/HTTP/Access_control_CORS#Preflighted_requests

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!