Question

我正在尝试从angularjs应用程序实现跨源调用，然后我收到以下错误。

请求标头字段预检响应中的Access-Control-Allow-Headers不允许授权。

但是，当我进行Ajax调用时，它可以正常工作。 HTTP post调用如何在angularjs中工作？

Ajax调用

$.ajax({ 
            type: 'POST', 
            url: getAccessTokenUrl, 
            data: JSON.stringify(clintdata), 
            dataType: 'json', 
            contentType: "application/json; charset=utf-8", 
            success: function(resultData) { 
                console.log(resultData);    
            }, 
            error: function (request, status, error) { 
               console.log(status);  
            } 
        });

Angularjs HTTP调用

$http({
          method: 'POST',
          url: getAccessTokenUrl,
          data: clientdata,
          headers: {
            'Authorization': undefined,
            'Auth-Token': undefined
          }
        }).then(function(res){
            console.log(res);
        }, function(err){
            console.log(err);
        });

我有一些默认设置。授权适用于其他REST

$http.defaults.headers.common['Content-Type'] = 'application/json;charset=utf-8;' ;
  $http.defaults.headers.common['Auth-Token'] = 'X-Requested-With';
  $http.defaults.headers.common['Authorization'] = $('#Authorization').val();

Answer 1

Access-Control-*标头是响应标头。它们来自服务器以响应请求。您不会将它们应用于您的请求标题。

如果您的jQuery请求正常工作而不添加任何其他标头，那么您的AngularJS请求应该可以正常工作。

AngularJS中的等效jQuery请求（包括删除您通过默认设置设置的授权和 Auth-Token 标头）是

$http.post(getAccessTokenUrl, clientdata, {
  headers: {
    Authorization: undefined,
    'Auth-Token': undefined
  }
}).then(response => {
  console.log(response.data)
})

或长版

$http({
  method: 'POST',
  url: getAccessTokenUrl,
  data: clientdata,
  headers: {
    Authorization: undefined,
    'Auth-Token': undefined
  }
}).then(...)

默认使用AngularJS ......

POSTS请求为application/json content-type
将数据属性序列化为JSON
期待JSON回复
使用$http对象解析response承诺，将响应正文解析为JSON到data属性

Answer 2

删除以下设置

 $http.defaults.headers.common['Auth-Token'] = 'X-Requested-With';
$http.defaults.headers.common['Authorization'] = $('#Authorization').val();

从Interceptor

动态添加授权标头

request: function(config) {
if (angular.isUndefined(config.skipInterceptor) || !config.skipInterceptor) {
// add Authorization token
}
return config;
}

像这样的Http调用

$http.post('your url', {
skipInterceptor: true
})

CORS邮件调用在Angularjs中无效

2 个答案: