$.getJson 失败，尽管 weatherapp 链接正常工作答案

【问题标题】：$.getJson fails although the weatherapp link works correctly$.getJson 失败，尽管 weatherapp 链接正常工作
【发布时间】：2016-06-13 19:36:18
【问题描述】：

我正在https://www.freecodecamp.com/challenges/show-the-local-weather做这个项目

如果您需要，我的完整项目在这里：https://codepen.io/tugrulz/pen/beEmJb?editors=0010

function fetchWeather() {

  var ap = "http://api.openweathermap.org/data/2.5/weather?";
  var key = "&appid=061f24cf3cde2f60644a8240302983f2";
  var lat = "35";
  var lon = "139";
  var api = ap + "lat=" + lat + "&lon=" + lon + key;

  $(".location").html(api);

$.getJSON(api, function(data) {
      alert("sa");
      $(".location").html("oldu mu?");
    })
   .done(function() {
    alert( "second success" );
  })
  .fail(function(error) {
    alert( error );

  })
  .always(function() {
    alert( "complete" );
  });
}

打印：http://api.openweathermap.org/data/2.5/weather?lat=35&lon=139&appid=061f24cf3cde2f60644a8240302983f2

问题是，我打印的链接在 chrome 中正确工作，但 getJSON 不起作用。它的失败功能有效。

我该怎么办？知道如何打印错误消息吗？打印（错误）；没有帮助。既不是涉及 getJson 的 try and catch 语句。

【问题讨论】：

你确定你打电话给fetchWeather()。看看这个CodePen。它基本上是您的代码，我将响应名称写入 div。所以它起作用了。
是的，我这样做了，但它处于就绪状态，我使用引导程序，但当我更改它们时，这些都没有改变。有趣的。我会用你的作为模板，但我仍然很好奇项目之间有什么区别。
我真的不知道我们的两个版本有什么区别。我更新了我的笔，将fetchWeather() 调用包含在$(document).ready() 中，它仍然有效。

标签： javascript json frontend

【解决方案1】：

我运行了你的 codepen 项目，在我的控制台中我得到了错误

The page at 'https://codepen.io/tugrulz/pen/beEmJb?editors=0011' was loaded over HTTPS, but requested an insecure XMLHttpRequest endpoint 'http://api.openweathermap.org/data/2.5/weather?lat=35&lon=139&appid=061f24cf3cde2f60644a8240302983f2'. This request has been blocked; the content must be served over HTTPS.

Codepen 阻止了 api，因为它不是https 地址。它没有打印错误，因为请求甚至从未发送到气象服务。

【讨论】：