Question

我要添加名为＆＃34; access-token＆＃34;我所有的http请求都是这样的：

var app= angular.module("MainModule", ["ngRoute"]);

app.run(function($http){
    $http.defaults.headers.common['access-token'] =ACCESSTOKEN;
})

并在我的服务中：

 service.get= function (x) {
    console.log(ACCESSTOKEN)
    return $http({
      method: "GET",
      headers: {
        'Content-Type': 'application/json',
        'access-token': ACCESSTOKEN
      },
      crossDomain: true,
      url: GETSERVICE.replace("{id}", x),
      dataType: 'json'
    }).then(function (response) {
      if (response.data) {
        return response.data;
      } else {
        return $q.reject(response.data);
      }
    }, function (response) {
      return $q.reject(response.data);
    });

  }

问题是我无法看到网络中的标题。没有我的标题只有OPTION请求。

我的后端cors配置如下：

response.setHeader("Access-Control-Allow-Origin", "*");
response.setHeader("Access-Control-Allow-Credentials", "true");
response.setHeader("Access-Control-Allow-Methods", "GET, POST, PUT, PATCH, DELETE, UPDATE, OPTIONS");
response.setHeader("Access-Control-Max-Age", "3600");
response.setHeader("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept, access-token");

chain.doFilter(req, res);

任何想法如何解决？

TY

编辑1：这是没有修改标题的OPTION请求

Accept: */*
Accept-Encoding: gzip, deflate, br
Accept-Language: it-IT,it;q=0.9,en-US;q=0.8,en;q=0.7
Access-Control-Request-Headers: access-token
Access-Control-Request-Method: GET
Cache-Control: no-cache
Connection: keep-alive
Host: localhost:8081
Origin: http://localhost:9080
Pragma: no-cache
User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/65.0.3325.181 Safari/537.36

和whit修改标题（工作）：

Accept: */*
Accept-Encoding: gzip, deflate, br
Accept-Language: it-IT,it;q=0.9,en-US;q=0.8,en;q=0.7
Access-Control-Request-Headers: access-token
Access-Control-Request-Method: GET
access-token: 1520963789861
Cache-Control: no-cache
Connection: keep-alive
Host: localhost:8081
Origin: http://localhost:9080
Pragma: no-cache
User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/65.0.3325.181 Safari/537.36

whit修改标题我在请求中有令牌

Answer 1

CORS的存在是为了保护API，以便随机客户端不会对它们进行调用。

JavaScript必须具有权限才能调用这些API。浏览器应该完成与CORS相关的所有繁重任务。但唯一的要求是服务器应该为客户端的OPTIONS请求返回以下HTTP标头：

Access-Control-Allow-Origin: <Origin fetched from the request>
Access-Control-Allow-Methods: GET, POST, PUT, PATCH, DELETE, DELETE
Access-Control-Allow-Headers: <ACCESS-CONTROL-REQUEST-HEADERS fetched from request>

如果这不是一个选项，那么在客户端，可以添加以下代码以防止所有OPTIONS请求，这会危及安全性：

app.config(['$httpProvider', function ($httpProvider) {
  $httpProvider.defaults.headers.common = {};
  $httpProvider.defaults.headers.post = {};
  $httpProvider.defaults.headers.put = {};
  $httpProvider.defaults.headers.patch = {};
  $httpProvider.defaults.headers.get = {};
}]);

请参阅：https://en.wikipedia.org/wiki/Cross-origin_resource_sharing

Answer 2

OPTIONS请求被调用＆＃34; preflight request＆＃34;。它仅检查您的客户端是否有权发送请求（当服务器具有已配置的CORS时）。如果服务器响应积极，那么您的浏览器会自动发送包含您提供的所有标题的完整请求。

Answer 3

$ httpProvider或$ http module：

//with the provider, in the app.config():
$httpProvider.defaults.headers.post['Content-Type'] = 'application/json; charset=utf-8';

$http.defaults.headers.common['Content-Type'] = 'application/json; charset=utf-8';

Answer 4

好的，我会告诉你这是什么问题。

编写我在跨域调用的其余api的和蔼可亲的人也在空指针的OPTION请求中检查了令牌的值。

解决了为选项请求添加过滤器的问题。

所有

的TY

使用角度

4 个答案: