Yahoo JSONP Ajax請求在回調函數中包裝

Question

我知道我可以用jquery，.ajax和jsonp進行跨域ajax調用。我打電話給雅虎股票報價api。一切正常，結果正在返回（我可以看到使用Fiddler。）問題是我得到一個js錯誤雅虎是未定義的。我認爲它有問題，因爲JSON是在回調函數內形成的，所以它的json語法不正確。我能做些什麼來解決它？謝謝！以下是代碼：

 $.ajax({ 
      type: 'GET', 
      dataType: 'jsonp', 
      jsonp: 'callback', 
      jsonpCallback: 'YAHOO.Finance.SymbolSuggest.ssCallback', 
      data:{ 
       query: request.term 
      }, 
      url: 'http://autoc.finance.yahoo.com/autoc', 
      success: function (data) { 
       alert("yes"); 
      }, 
      error: function (xhr, ajaxOptions, thrownError) { 
       alert(xhr.status); 
       alert(thrownError); 
      } 
     }); 

Answer 1

以下是工作示例：請參閱callback =？在我的查詢結束，使其工作。 這個例子可以作爲獨立的html複製過去。

https://github.com/cirs/PortfolioApp/blob/master/PortfolioApp-Step1-GetData.html

Answer 2

這是我如何得到它的工作：

我用.jsonp的阿賈克斯，而不是因爲你需要把它的URL參數。 您還需要在代碼中定義Yahoo回調函數的名稱。 這裏是一個鏈接，解釋如何使用其Web服務使用雅虎回調函數。

http://developer.yahoo.com/javascript/json.html#callbackparam

下面是代碼：

<script type="text/javascript"> 
    // this variable must be defined this way 
    var YAHOO = { 
     Finance: { 
      SymbolSuggest: {} 
     } 
    }; 

    $(document).ready(function(){   
     var query; 

     query = 'Yahoo';   
     if (query.length > 0) 
     { 

      $.ajax({ 
       type: "GET", 
       url: "http://d.yimg.com/autoc.finance.yahoo.com/autoc", 
       data: {query: query}, 
       dataType: "jsonp", 
       jsonp : "callback", 
       jsonpCallback: "YAHOO.Finance.SymbolSuggest.ssCallback", 
      }); 
      // call back function 
      YAHOO.Finance.SymbolSuggest.ssCallback = function (data) { 
      alert(JSON.stringify(data)); 
      } 
     } 

    }); 


    </script> 

Answer 3

我想添加這個答案，因爲它看起來像user209245's answer以上（這是2011年）將不再有效。以下是我做的：

1. 使用YQL Console打造你想要得到的，例如股票查詢蘋果：

   從yahoo.finance.quotes其中symbol = 「AAPL」

2. 確保JSON選擇並指定JSONP回調，例如選擇* quote
3. 單擊測試的REST查詢

4. 插件，它爲您生成這樣的：

   var quote; 
   
   $(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); 
       }; 
   }); 
   

   那麼你的頁面上的.price<div>將顯示：

   $543.21 
   

當然，一旦你獲得了數據，你可以顯示你想要的任何東西;我只是用價格作爲例子，因爲那正是我需要的。

Answer 4

這裏有一個修正版本，爲我工作：

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

    window.quote = function(data) { 
     console.log(data); 
    }; 
}); 

Answer 5

下面是這個JS提琴： https://jsfiddle.net/vham369w/1/

使用$.getJson代替$.ajax

JS

$(document).ready(function() { 
    var symbol = 'AAPL' 
    var url = "https://query.yahooapis.com/v1/public/yql?q=select%20*%20from%20yahoo.finance.quotes%20where%20symbol%3D%22"+symbol+"%22&format=json&diagnostics=true&env=store%3A%2F%2Fdatatables.org%2Falltableswithkeys"; 
    $.getJSON(url + "&callback=?", null, function(data) { 
     console.log(data); 
     $("#realtime").text("$" + data.query.results.quote.AskRealtime); 
     $("#ask").text("$" + data.query.results.quote.Ask); 
    }); 
}); 

HTML

Ask: 
<div id="ask"> 
    loading ask 
</div> 
Realtime (null if market is closed): 
<div id="realtime"> 
    loading realtime 
</div>