在JavaScript中爲Phonegap項目回溯json數據

Question

我試圖從WordPress博客中檢索JSON數據。我使用JSON API插件來獲取JSON對象。

請檢查我的代碼。它顯示錯誤狀態0.並且無法檢索數據。

var xmlhttp; 

window.onload = function(){ 

     document.addEventListener("deviceready",init,false); 
    } 
    function init(){ 

      xmlhttp = new XMLHttpRequest(); 

      xmlhttp.open("GET","http://www.foduu.com/api/get_recent_posts/", false); 
      xmlhttp.send(); 
      xmlhttp.onreadystatechange = dataReturn; 
    } 
    function dataReturn(){ 

      if(xmlhttp.readyState==4 && xmlhttp.status == 200){ 
       var jsonResponse = xmlhttp.responseText; 
       jsonResponse = eval("("+jsonResponse+")") 
       alert("jsonResponse.count_total"); 
      } 
      else 
      { 
       alert("could not connect and Status:" + xmlhttp.status); 
      } 
    } 

請幫我這個。

先謝謝您。

Answer 1

由於數據來自域（www.foduu.com），而不是您的頁面來自何處，因此該調用被視爲跨域調用。 XMLHttpRequest不會讓這樣的請求通過（出於安全目的）。有兩種方法來解決此限制，並且都要求服務器選擇加入。首先是使用CORS;第二個（在你的情況下工作，因爲你發出GET請求）是使用JSONP。

我試着用CORS頭（Origin）向站點發送一個請求（使用Fiddler），並且響應不包含任何與CORS有關的響應，所以這個服務特別不支持該協議。但是，它確實支持JSONP（如果您使用Fiddler發送請求到http://www.foduu.com/api/get_recent_posts/?callback=cb，您將看到一個包含在cb(...)調用中的響應）。

你應該做的是在你的頁面中使用它。通過創建<script>元素並將其添加到DOM中，您可以在「純粹」JavaScript中使用JSONP，但是如果使用jQuery等庫，可以更輕鬆地對服務進行JSONP調用，您會得到更簡單的結果。