如果我使用XMLhttprequest调用API,它可以正常工作。但是当我使用angularjs(1.5.6)时,我得到了CORS错误

时间:2018-03-02 15:38:53

标签: angularjs http cors xmlhttprequest

首先,我已将我的localhost端口3000列入白名单以获取跨源请求。我正在构建一个MEAN堆栈应用程序。我正在尝试使用$ http服务来使用API​​。

myApp.controller('minuteController', function($scope,$http) {
$scope.submitButton = function() {
    $http({
        method: 'POST',
        url: 'https://url.example.com/server/oauth/token?grant_type=password&username=username&password=pass1234&origin=local',
        headers: {'Authorization':'Basic asdsadsads=','Content-Type': 'application/json; charset=UTF-8','Accept':'application/json, text/plain,*/*'}
    })
    .then(function successCallback(response) {
        $scope.dataDisplay = response.data;
        console.log(dataDisplay);
    });
}
});

如果我使用相同的细节来制作XMLHttpRequest,它可以正常工作。以下是有效的代码。

 var xmlhttp = new XMLHttpRequest();
var url = "https://url.example.com/server/oauth/token?grant_type=password&username=username&password=pass1234&origin=local";

xmlhttp.onreadystatechange = function() {
    if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
        var myObject = JSON.parse(xmlhttp.responseText);
        alert(myObject);
    }
};

xmlhttp.open("POST", url, true);
xmlhttp.setRequestHeader("Content-Type","application/json;charset=UTF-8");
xmlhttp.setRequestHeader( "Accept","application/json, text/plain, */*");
xmlhttp.setRequestHeader( "Authorization","Basic asdsadsads=");
xmlhttp.send();

errors I see in my console

Working HTTP request

Not Working HTTP request

1 个答案:

答案 0 :(得分:1)

终于找到了问题。它通过在data: ''

的参数中添加$http.来解决我的问题