javascript - GET 请求不在代码笔中获取数据但在浏览器选项卡上工作

Question

This是我很久以前做的一个简单天气应用程序的代码笔。但是，它现在不起作用。当我将 api 粘贴到浏览器选项卡时，我正在获取数据，但在 Codepen 中它不起作用。

var api = "http://api.openweathermap.org/data/2.5/weather?
q=Lam%20Tin,HK&appid=23a5271ef6a94716ac17ec27e9f4bcd8";
$.getJSON(api, function(data) {
  console.log(data);
});

Answer 1

错误

The page at 'https://codepen.io/iamanoopc/pen/JEjYKR?editors=0011' was loaded over HTTPS, but requested an insecure XMLHttpRequest endpoint 'http://api.openweathermap.org/data/2.5/weather?q=Lam%20Tin,‌​HK&appid=23a5271ef6a‌​94716ac17ec27e9f4bcd‌​8'. This request has been blocked; the content must be served over HTTPS.

解释

错误显示得非常清楚。HTTPS，但请求了不安全的 XMLHttpRequest。是安全域服务器 https。您的 http 调用不安全.出于安全原因。他们将阻止您的请求This request has been blocked;内容必须通过 HTTPS 提供

备用

尝试使用不安全的 http 域服务器片段，例如 jsbin

Demo与 Jsbin