$ .getJSON和$ .ajax無法返回JSON對象

我正在做freecodecamp.com上的「本地天氣」前端開發挑戰，並且在對某些天氣API進行API調用時遇到了一些麻煩。挑戰圍繞獲取用戶的位置，然後致電天氣API來顯示其所在區域的天氣。我試圖使用Dark Sky API和OpenWeatherMap API，但他們都沒有返回任何東西。我可以將兩個API鏈接放到我的瀏覽器中，它們都顯示我需要的信息，但是當我將它們放入我的javascript時，它們無法返回信息。這是我當前的嘗試與$阿賈克斯和陰暗的天空API：

$(document).ready(function() { 
 

 
    if (navigator.geolocation) { 
 
    navigator.geolocation.getCurrentPosition(function (position) { 
 
    
 
     var lat = position.coords.latitude; 
 
     var long = position.coords.longitude; 
 
    
 
    
 
    
 
    //$("#loc").html(lat + " " + long); 
 
    
 
     $.ajax({ 
 
     url: "https://api.darksky.net/forecast/96dd30a49debe62a67b208f705e3d706/" + lat + "," + long, 
 
     success: function(json) { 
 
      $("#loc").html("Your location: " + json.latitude + "," + json.longitude); 
 
      $("#temp").html("Temperature: " + json.currently.temperature); 
 
      $("#fc").html("Test " + json.minutely.summary); 
 
     }, 
 
    
 
     error: function(xhr, status, error) { 
 
      console.log("error", status, xhr, error); 
 
     }  
 
    }); 
 
    }); 
 
    } 
 
});

提前感謝！

來源

2017-06-12 audragon

你有jquery的定義嗎？ – prola

您的瀏覽器的控制檯或網絡監視器是否提供有關請求或包含此代碼段的腳本文件的任何錯誤或警告？ –

這應該是一個CORS錯誤

使用dataType: "JSONP"，使工作

一個工作的jsfiddle爲例here

更多信息

見 What is JSONP All about

來源

2017-06-12 20:17:54

您不能簡單地將請求方法更改爲JSONP;服務器可能會或可能不會支持它。 – Pointy

我不確定Pointy是否正確，但我更改了我的long變量並添加了dataType：「JSONP」，並且我的代碼正常工作。 – audragon

更改經度變量的名稱。 Long是JavaScript中的保留字。看到這一點：https://www.w3schools.com/js/js_reserved.asp

來源

2017-06-12 20:14:47 Simon

請複製並粘貼這段代碼放到你的IDE /文本編輯器中並測試它：

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> 

<script> 
$(document).ready(function() { 


    //if (navigator.geolocation) { 
    //navigator.geolocation.getCurrentPosition(function (position) { 

     //var lat = position.coords.latitude; 
     var lat = '27.268416'; 
     var longTest = '-82.463198'; 



    //$("#loc").html(lat + " " + long); 

     $.ajax({ 
     url: "https://api.darksky.net/forecast/96dd30a49debe62a67b208f705e3d706/" + lat + "," + longTest, 
     dataType: 'JSONP', 
     success: function(json) { 
      $("#loc").html("Your location: " + json.latitude + "," + json.longitude); 
      $("#temp").html("Temperature: " + json.currently.temperature); 
      $("#fc").html("Test " + json.minutely.summary); 
     }, 
     success: function(data) { 
      console.log(data); 
     }, 
     error: function(xhr, status, error) { 
      console.log("error", status, xhr, error); 
     }  
    }); 
    //}); 
    //} 
}); 
</script>

我註釋掉了if語句並硬編碼了一些座標來測試你的代碼。有用。我得到一個對象。只要您的if語句執行並且您的代碼替換了經度和緯度的值，您應該很好。請不要使用JS保留字符串。

來源

2017-06-12 20:39:52

$ .getJSON和$ .ajax無法返回JSON對象

回答

相關問題