Question

我在从远程服务器上使用AngularJS获取远程JSON文件时遇到了麻烦，即使我得到它，也找不到使用数据的方法。

这是角度代码：

 var artistControllers = angular.module('artistControllers', ['ngAnimate']);

artistControllers.controller('ListController', ['$scope', '$http', function($scope, $http) {
    $http.json('http://remotehost.mobi/temp.json').
        success(function(data){
            console.log('success');
            console.log(data);
    }).
        error(function(data, status ){
            console.log('error');
            console.log('status');

    });
}]);

通常我得到的只是所有类型的错误：

当试图从PHP脚本获取动态JSON时，我需要发送一个回调，有时可以工作，但回调会激活一个函数这超出了范围，因此与我的需求无关。
尝试从.json文件加载JSON时（如示例中所示）我得到了错误。
使用$ http.get时，我总是获得跨域安全性消息。

我正在寻找一种从远程服务器加载json数据的方法，该服务器由PHP动态生成，带有角度JS控制器并在该控制器内部使用。

由于

Answer 1

您需要更改服务器以允许CORS（请参阅this）或使用$http.jsonp并将响应更改为JSONP格式（JSON正文包含在回调函数调用中）。

如果您不控制远程服务器，则可以通过您自己的服务器代理请求，使其不再是跨域服务器。

Answer 2

启用CORS的代理示例为corsproxy.com

CORE比jsonp更安全，因为它无法执行javascript代码。从好的方面来说，你可以更好地控制状态转换/超时/进度以及使用CORS进行堕胎，因为它现在是ajax

现在唯一的风险是你信任corsproxy.com来读取正在通过的数据吗？ updown？

您唯一需要做的就是将http://替换为http://www.corsproxy.com/（不要认为它适用于https ...）

var artistControllers = angular.module('artistControllers', ['ngAnimate']);

artistControllers.controller('ListController', ['$scope', '$http', function($scope, $http) {
    $http.json('http://www.corsproxy.com/kinneret.mobi/temp.json').
        success(function(data){
            console.log('success');
            console.log(data);
        }).
        error(function(data, status ){
            console.log('error');
            console.log('status');
        });
}]);

Answer 3

感谢您的帮助。我想我的问题有点不同，这就是我发布这个解决方案的原因。

Evantualy我添加了一个新的标题，以允许交叉来源到我的PHP，动态生成JSON代码：

header('Access-Control-Allow-Origin: *');
header('content-type: application/json; charset=utf-8');

这在函数编码之前正确并返回json。我添加的另一件事是在发回之前格式化JSON。我发现发送“原始”未格式化的JSON会导致意外问题。从PHP 5.4开始，您可以将JSON_PRETTY_PRINT添加到json_encode：

echo  json_encode($data_array, JSON_PRETTY_PRINT);

在角度代码中，我检查了许多组合，包括@Endless建议使用corsproxy.com，但发现经过这些调整后你可以简单地使用$http.get。

希望如果有人遇到这个跨域政策的奇怪问题，这会有所帮助。

无法通过AngularJS $ http.json / get从远程服务器获取JSON

3 个答案: