Question

我正在尝试在AngularJS中创建一个服务，它会从网站上获取JSON数据。我用一种工厂方法包装服务，如下所示

App.factory('httpService', function($http) {
    delete $http.defaults.headers.common['X-Requested-With'];
    return {
        getData : function() {
            var url = "http://www.reddit.com/.json?callback=JSON_CALLBACK";
            return $http.jsonp(url).then(
                function(result) {
                    return result;
                });
        }
    }
});

我遇到的问题是我收到错误Uncaught SyntaxError: Unexpected token :。当我使用get()代替json()时，我收到501 / CORS错误。

我尝试获取数据的网址是： http://api.4chan.org/b/1.json http://www.reddit.com/.json

以下是我的jsfiddle与其余代码的链接。

http://jsfiddle.net/fatgamer85/adPue/3/

有没有人知道如何解决这个问题？

编辑：我已设法获取数据并解决了问题。感谢sza

以下是我所使用的代码，如果有人感兴趣的话

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

myApp.factory('myXHRService', function($http) {
    delete $http.defaults.headers.common['X-Requested-With'];
    return {
        getData : function(url) {
            return $http.jsonp(url).then(
                function(result) {
                    return result.data;
                }
            );
        }
    }
});

myApp.controller('MainCtrl', function($scope, myXHRService) {
    $scope.xhrData = {};
    $scope.data = {};
    $scope.url = "http://www.reddit.com/.json?jsonp=JSON_CALLBACK";
    myXHRService.getData($scope.url).then(function(data) {
        var xhrData = angular.fromJson(data);
        $scope.xhrData = xhrData.data.children;
    });
});

myApp.config(function($httpProvider){
    $httpProvider.defaults.useXDomain = true;
    delete $httpProvider.defaults.headers.common['X-Requested-With'];
});

这里的主要区别是URL参数jsonp中的回调，除此之外，一切都运行正常，花花公子。

Answer 1

我认为它可能与Reddit.com的API端点问题有关。如果你尝试这个API，它将使用jsonp

var url = "http://www.reddit.com/top.json?jsonp=JSON_CALLBACK";

对于API /.json，我建议您实现服务器端代码以检索数据，尽管它返回有效的JSON，但无法通过域正确访问。

用于XHR的AngularJS服务

1 个答案: