Javascript 无法访问回调AngularJS中的JSON响应

在我的“网络”选项卡中，我看到回复返回，但由于某种原因，我无法访问数据

以下是直接链接：

使用角度1.2 rc2。尝试了几种不同的方法

$http

var url = "https://github.com/users/gigablox/contributions_calendar_data?callback=JSON_CALLBACK";
$http.jsonp(url).success(function(data){
    console.log(data);
});  

$resource

var handle = $resource('https://github.com/users/gigablox/contributions_calendar_data',{},{
  get:{
    method:'JSONP',
    isArray: false, //response is wrapped as an array. tried true and false
    params:{callback:'JSON_CALLBACK'}
  }
});

handle.get().$promise.then(
function(data){
    console.log(data);
}).
function(error){
    console.log(error); //undefined but 200 OK on response?
});

---

这里的问题是您正在请求一个平面文件，因此服务器没有在

jsonp\u callback

querystring参数指定的javascript函数调用中包装数据。进一步的CORS阻止您直接使用$http/xhr获取文件

通常，如果使用$http.jsonp，指定的回调函数需要驻留在全局范围内，然后需要“重新角度化”响应数据

下面是一个使用wordpress api的示例：

HTML

<div ng-controller="MyCtrl" id='ctl'>
  <h2 ng-show="data">Data from callback</h2>
  <pre>{{data}}</pre>

  <h2 ng-show="success">Success</h2>
  <pre>{{success}}</pre>

  <h2 ng-hide="data">Error</h2>
  <pre>{{error}}</pre>
</div>

---

因此，如果JSONP和CORS都不可能，那么必须使用@ebt所指出的服务器端代理来解决。angularjs+php示例：

PHP:

---

使用调试。。在这两种情况下，在成功行上放置一个断点，并查看变量以查看它们所包含的内容。然后告诉我们您看到的是回调触发？@Jason在

$resource

错误回调中，它将返回未定义的数据属性。。。但是我的网络标签中的响应是200 OK。奇怪的是

angular.callbacks.\u 0（）

函数没有包装响应。正如您将在该直接链接中看到的那样，响应类型是一个数组，因此我尝试了falging

isArray:true

。不，谢谢你，杰森，谢谢你的回复。我已经用你的小提琴把wordpress的URL换成了我自己的，但仍然遇到同样的问题：是的，正如我所说的，你不能使用来自github页面的数据。这是一个平面页面，它不会被包装在javascript回调中。哦，我明白了。因此，在框架的范围内，这是不可能做到的？这是github的事情，github返回的文件的内容类型为application/json，但它没有将返回的数据包装在函数调用中。下面是关于JSONP的更多信息：我明白了，他们的服务器不支持该特定资源的JSONP或CORS。非常感谢。甚至没有棱角。就像问题问的那样。

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

function MyCtrl($scope, $http) {
    $scope.name = 'Superhero';
var url = "http://public-api.wordpress.com/rest/v1/sites/wtmpeachtest.wordpress.com/posts?callback=jsonp_callback";

$http.jsonp(url).then(
        function(s) { $scope.success = JSON.stringify(s); }, 
        function(e) { $scope.error = JSON.stringify(e); } );
}

function jsonp_callback(data) {
    var el = document.getElementById('ctl');
    var scope = angular.element(el).scope();
    scope.$apply(function() {
        scope.data = JSON.stringify(data);
    });
}

$http.get('proxy.php').then(
    function(res){
        console.info(res);

    }, function(error){
        console.info(error);
    }
);

$url = 'api url';
$returned_content = get_data($url);

header('Content-Type: application/json');
echo $returned_content; //assumption the returned content is json format

function get_data($url) {
    $ch = curl_init();
    $timeout = 5;
    curl_setopt($ch, CURLOPT_URL, $url);
    curl_setopt($ch, CURLOPT_RETURNTRANSFER, 1);
    curl_setopt($ch, CURLOPT_CONNECTTIMEOUT, $timeout);
    $data = curl_exec($ch);
    curl_close($ch);
    return $data;
}