$.getJSON 和 $.ajax 无法返回 JSON 对象答案

【问题标题】：$.getJSON and $.ajax fail to return a JSON object$.getJSON 和 $.ajax 无法返回 JSON 对象
【发布时间】：2017-06-12 20:09:29
【问题描述】：

我正在 freecodecamp.com 上进行“本地天气”前端开发挑战，但在对某些天气 API 进行 API 调用时遇到了一些问题。挑战围绕着获取用户的位置，然后调用天气 API 来显示他们所在地区的天气。我尝试使用Dark Sky API 和OpenWeatherMap API，但它们都没有返回任何东西。我可以将两个 API 链接放入我的浏览器，它们都显示我需要的信息，但是当我将它们放入我的 javascript 时，它们无法返回信息。这是我目前对 $.ajax 和 Dark Sky 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);
        }    
    });
  });
  }
});

提前致谢！

【问题讨论】：

你定义了 jquery 吗？
您的浏览器控制台或网络监视器是否提供有关请求或包含此 sn-p 的脚本文件的任何错误或警告？

标签： javascript jquery json ajax api

【解决方案1】：

这应该是 CORS 错误

使用dataType: "JSONP" 使其工作

一个有效的 JSFiddle 示例 here

更多信息请见What is JSONP All about

【讨论】：

不能简单地将请求方式改为JSONP；服务器可能支持也可能不支持。
我不确定 Pointy 是否正确，但我更改了 long 变量并添加了 dataType：“JSONP”，我的代码工作了。

【解决方案2】：

更改经度变量的名称。 Long 是 javascript 中的保留字。看到这个：https://www.w3schools.com/js/js_reserved.asp

【讨论】：

【解决方案3】：

请将此代码复制并粘贴到您的 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 保留字符串。

【讨论】：