使用 JSONP 从 Yahoo Finance 加载报价答案

【问题标题】：Loading quotes from Yahoo Finance using JSONP使用 JSONP 从 Yahoo Finance 加载报价
【发布时间】：2015-10-15 07:24:30
【问题描述】：

我希望它会这么简单。但是不，警报永远不会被调用。请帮忙。

$.getJSON("http://finance.yahoo.com/webservice/v1/symbols/allcurrencies/quote?format=json&view=basic&callback=?", function(result){
   //response data are now in the result variable
   alert(result);
});

我在Yahoo JSONP Ajax Request Wrapped in callback function 上尝试了接受的答案但这对我也不起作用:(

我从中做了一个 jsfiddle，但没有运气。

var quote;
$(".price").text("please");
$(document).ready(function() {
    $.ajax({
        url: "http://query.yahooapis.com/v1/public/yql?q=select%20*%20from%20yahoo.finance.quotes%20where%20symbol%3D%22AAPL%22&format=json&diagnostics=true&env=store%3A%2F%2Fdatatables.org%2Falltableswithkeys&callback=quote",
        dataType: "jsonp",
        jsonp: "callback",
        jsonpCallback: "quote"
    });

    quote = function(data) {
        $(".price").text("$" + data.query.results.quote.AskRealtime);
    };
});

https://jsfiddle.net/ustj6eob/

【问题讨论】：

Yahoo JSONP Ajax Request Wrapped in callback function的可能重复
查看当您访问 JS Fiddle URL 时在浏览器的错误控制台中收到的错误消息。
错误信息只是因为使用了 https。将链接更改为jsfiddle.net/ustj6eob 并且错误消息消失但仍然从未调用回调:(

标签： javascript jquery callback jsonp

【解决方案1】：

我发现 ajax 调用不起作用的原因是 Query 会自动为您在 URL 的末尾添加一个时间戳，确保永远不会缓存 ajax 请求。 Yahoo Finance Web 服务不支持 timestamp 参数。

需要添加以下行：

$.ajaxSetup({'cache':true});

这是完整的代码：

var quote;
$.ajaxSetup({'cache': true});
$(document).ready(function () {
    $.ajax({
        url: "http://finance.yahoo.com/webservice/v1/symbols/allcurrencies/quote?format=json&view=basic",
       dataType: "jsonp",
       jsonp: "callback",
       jsonpCallback: "quote"
    });

    quote = function (data) {
        var arrayLength = data.list.resources.length;
        var restext = '';
        for (var i = 0; i < arrayLength; i++) {
            restext += "<br>" + data.list.resources[i].resource.fields.name;
        }
        $('#res').html(restext);
    };
});

http://jsfiddle.net/teshg0kn/3/

我也让它在纯 JS 中工作。

function getQuote(obj) {
    var arrayLength = obj.list.resources.length;
    for (var i = 0; i < arrayLength; i++) { 
        document.getElementById("ip").innerHTML += "<br>" + obj.list.resources[i].resource.fields.name;
    }
}
var url = "http://finance.yahoo.com/webservice/v1/symbols/allcurrencies/quote?format=json&view=basic&callback=getQuote"
var script = document.createElement('script');
script.setAttribute('src', url);
document.getElementsByTagName('head')[0].appendChild(script);

http://jsfiddle.net/teshg0kn/2/

【讨论】：

虽然这可能是一个很好的一般提示，但我不明白这如何回答您最初发布的问题。

【解决方案2】：

您在小提琴中做错的是两件事：当小提琴使用https 时通过http 访问框架并且没有在标头中加载脚本（这给jsonp 访问全局query 对象带来了麻烦） .

养成使用//而不是http或https访问脚本的习惯，然后浏览器会为您选择正确的协议：

var quote;
$(".price").text("please");
$(document).ready(function() {
    $.ajax({
        url: "//query.yahooapis.com/v1/public/yql?q=select%20*%20from%20yahoo.finance.quotes%20where%20symbol%3D%22AAPL%22&format=json&diagnostics=true&env=store%3A%2F%2Fdatatables.org%2Falltableswithkeys&callback=quote",
        dataType: "jsonp",
        jsonp: "callback",
        jsonpCallback: "quote"
    });

    quote = function(data) {
        $(".price").text(data.query.created);
    };
});

https://jsfiddle.net/anm6ebsp/

【讨论】：