2011-05-06 79 views
7

我想在客戶端進行跨域請求,因此我選擇了JSONP。我是JSONP的新手,並且想要使用JavaScript而不是jQuery向http://somedomain.com發出請求。如果我在JavaScript中使用JSONP獲取樣本片段來製作和處理請求,那麼對我的開發將會非常有幫助。使用JavaScript製作和處理JSONP請求

+0

大量的信息在這裏:http://en.wikipedia.org/wiki/JSONP – sje397 2011-05-06 06:51:00

回答

11

這裏有一個小例子從谷歌電子表格中獲取數據:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" 
    "http://www.w3.org/TR/html4/strict.dtd"> 

<html lang="en"> 
<head> 
    <title>jsonp</title> 
</head> 
<body> 
    <span></span> 
    <script> 
     //this function is the callback, it needs to be a global variable 
     function readResponse(response){ 
      document.getElementsByTagName('SPAN')[0].innerHTML = response.feed.entry.length + ' entries returned'; 
      console.log(response); 
     } 
     (function(){ 
      //note the "readResponse" at the end 
      var src = 'http://spreadsheets.google.com/feeds/list/o13394135408524254648.240766968415752635/od6/public/values?alt=json-in-script&callback=readResponse', 
       script = document.createElement('SCRIPT'); 
      script.src = src; 
      document.body.appendChild(script); 
     })(); 

    </script> 
</body> 
</html> 

一個意見與此相關的例子。如果你想玩你自己的谷歌電子表格,你需要共享它作爲公共,併發布它。

+0

偉大的例子!這是另一個..它是一個JSBin,可以用來[從JSONP中撥弄](http://jsbin.com/omujex/10/edit)來自維基百科。它在[這個答案]中被引用(http://stackoverflow.com/questions/15293680/fetch-random-excerpt-from-wikipedia-javascript-client-only/15293681#15293681)。 – rkagerer 2013-03-08 14:10:23