Question

我的代码如下

$scope.LoadSearchResults = function () {
        $scope.hotels = '';
        $scope.allData = '';
        var mydata = '';
        $http({
            url: 'myurl',
            Authorization : 'code',
            method: 'POST',
            header: { 'Content-type': 'text/json' }
        })
        .success(function (mydata) {
           $scope.hotels = JSON.parse(JSON.stringify(mydata.SearchResponse.Hotels.Hotel));
           $scope.allData = JSON.parse(JSON.stringify(mydata.SearchResponse.Hotels.Hotel));

           $scope.AllLocality($scope.allData);
        })
        .error(function (mydata) {
            $scope.hotels = "Failed";
            console.log(JSON.stringify(mydata));
        });        
    }

并且收到错误是＆＃34;阻止跨源请求：同源策略禁止在http://example.com/some-page读取远程资源。（原因：CORS标题＆＃39; Access-Control-Allow-Origin＆＃39;缺失）。＆＃34;

我怎么能解决这个问题？

Answer 1

这不是一个角度问题。

原因是您正在触发跨源请求（例如，您的应用程序位于域上，而url: 'myurl'指定的请求是针对不同的域），并且HTTP不允许它，除非权限是由服务器通过向响应添加CORS头来接收请求。

要解决您的问题，请在此处查看以下四个选项之一（我相信您可以根据具体设置找到更多选项）：

让您的应用将请求发送到同一个域，这通常是首选且最安全的方法（例如，托管角度代码的Web应用程序也负责通过$http响应您正在执行的xhr）
如果您可以控制服务器如何创建响应，那么添加此类标题应该相当容易（我不能在此处添加示例，因为它完全依赖于您正在使用的Web服务器或应用程序网关）
如果您无法控制服务器响应（最重要的是它的标题），您可以在中间添加自己的服务器作为请求代理，从而使您的JS应用程序向您的请求发出请求服务器（不会引发CORS问题）和服务器本身向第三方提供商发出代理请求
如果您只需要GET请求（从您的代码段看起来并非如此），如果服务器支持此类请求，您可以使用有角度的$http JSONP。

Answer 2

嗨，我遇到了同样的问题，但是现在我通过以下方法解决了它：

header('Access-Control-Allow-Origin: *');
header("Access-Control-Allow-Headers: X-API-KEY, Origin, X-Requested-With, Content-Type, Accept, Access-Control-Request-Method, Authorization");
header("Access-Control-Allow-Methods: GET, POST, OPTIONS, PUT, DELETE");

请在控制器上将标头传递给parent :: __ construct（）;

无法通过角度获得API的响应？

2 个答案: