无法读取来自雅虎财经的AngularJS $资源JSONP的回复

时间:2012-12-19 23:55:51

标签: resources jsonp angularjs yahoo-finance

我可以使用带有JSONP的Angular JS $资源从Google财经获取股票价格。这显示在:http://jsfiddle.net/8zVxH/1/

我需要历史价格,谷歌没有提供,但雅虎确实如此。我将上面的jsfiddle修改为:http://jsfiddle.net/curt00/BqtzB/

以下是代码:

angular.module('app', ['ngResource']);

function AppCtrl($scope, $resource) {

    var yqlURL="http://query.yahooapis.com/v1/public/yql?q=";

    var dataFormat="&format=json&env=store%3A%2F%2Fdatatables.org%2Falltableswithkeys";

    var symbol = 'GOOG';

    var startDate = '2012-12-05';
    var endDate = '2012-12-06';

    var historical_query = yqlURL+"select%20*%20from%20yahoo.finance.historicaldata%20where%20symbol%20%3D%20%22"+ symbol +"%22%20and%20startDate%20%3D%20%22"+ startDate +"%22%20and%20endDate%20%3D%20%22"+ endDate +"%22"+ dataFormat;

    $scope.yahooFinance = $resource(historical_query, 
                                 {callback:'JSON_CALLBACK'},
                                 {get: {method:'JSONP', isArray: false}});

    $scope.indexResult = $scope.yahooFinance.get();

}

它在浏览器控制台中生成错误消息:

获取http://query.yahooapis.com/v1/public/yql?q=select%20 *%20来自%20yahoo.finance.historicaldata%20其中%20symbol%20%3D%20%22GOOG%22%20%20startDate%20%3D%20%222012-12-05%22 %20和%20endDate%20%3D%20%222012-12-06%22&amp; format = json&amp; env = store%3A%2F%2Fdatatables.org%2Falltableswithkeys?callback = angular.callbacks._0 400(错误请求)< / p>

有人知道如何让它发挥作用吗?

我知道Jquery的getJSON可以与这个Yahoo查询一起使用,但据说AngularJS的'$资源更快更有效。

3 个答案:

答案 0 :(得分:3)

使用angular的$ http服务。

使用角度服务$ http的函数jsonp,它很容易实现。

<强>服务

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

app.factory('service', function($q, $http) {

    return {
        getHistoricalData: function(symbol, start, end) {
            var deferred = $q.defer();
            var format = '&format=json&env=store%3A%2F%2Fdatatables.org%2Falltableswithkeys&callback=JSON_CALLBACK';
            var query = 'select * from yahoo.finance.historicaldata where symbol = "' + symbol + '" and startDate = "' + start + '" and endDate = "' + end + '"';
            var url = 'http://query.yahooapis.com/v1/public/yql?q=' + encodeURIComponent(query) + format;

            $http.jsonp(url).success(function(json) {
                var quotes = json.query.results.quote;
                // filter + format quotes here if you want
                deferred.resolve(quotes);
            });
            return deferred.promise;
        }
    };
});

<强>控制器

function Ctrl($scope, service) {
    $scope.symbol = "GOOG";
    $scope.items = [];
    $scope.startDate = '2012-12-05';
    $scope.endDate = '2012-12-06';

    $scope.getData = function() {
        $scope.items = [];

        var promise = service.getHistoricalData($scope.symbol, $scope.startDate, $scope.endDate);

        promise.then(function(data) {
            $scope.items = data;
        });
    };
    $scope.getData();
}​

我在jsFiddle上创建了一个工作示例。

答案 1 :(得分:1)

作为angularjs noob,这为我修好了。

更改了我的jsonp

JSON_CALLBACK({"term_jg_1":{"query":"Julia.......

angular.callbacks._0({"term_jg_1":{"query":"Julia...

答案 2 :(得分:0)

感谢大家提供建议。

@ asgoth的建议看起来很光滑,但我无法让它在我的AngularJS网络应用程序上运行。

我用$ http.jsonp替换了$ resource,现在它可以工作了。例如:

var query = 'select * from csv where url=\'http://ichart.yahoo.com/table.csv?s=' + symbol + '&a=' + (date.month - 1) + '&b=' + date.day + '&c=' + date.year + '&d=' + (date.month - 1) + '&e=' + date.day + '&f=' + date.year + '&g=d&ignore=.csv\'';
var url = 'http://query.yahooapis.com/v1/public/yql?q=' + fixedEncodeURIComponent(query) + '&format=json&callback=JSON_CALLBACK';

    $http.jsonp(url, {timeout: 30000}).success(function(json) {
        var result = json.query.results.row;
        //  process result
    }