从 HTTPS 页面使用 HTTP API答案

【问题标题】：Using HTTP API from HTTPS page从 HTTPS 页面使用 HTTP API
【发布时间】：2016-11-23 23:40:46
【问题描述】：

我是一名使用 Windows 10 家庭版的 freecodecamp 学生。 Codepen.io 是一个 http 站点的编辑器。 “当地天气”课程让我有一个来自开放天气地图的 api，它也是一个 http。当我第一次：

$.document.ready(function() {
  var api = "http://api.openweathermap.org/data/2.5                   /weather?id=2172797&appid=(I have my api key)";        
  $.getJSON(api, function(data) {
    alert(api, data.coord.lon);  
  });
});

我问过其他程序员，他们说代码是正确的。我也尝试过 AJAX：

function loadDoc() {
  var url = "http://api.openweathermap.org/data/2.5/weather?id=2172797& appid=(I have my api key)";
  var xhttp = new XMLHttpRequest();
  xhttp.onreadystatechange = function() {
    if (xhttp.readyState == 4 && xhttp.status == 200) {
      document.getElementById("demo").innerHTML = xhttp.responseText;
    }
  };
  xhttp.open("GET", "url", true);
  xhttp.send();
}

我没有收到数据，也没有收到“警报”响应。然后我通过电子邮件向 Codepen.io 回复：

我在这里看到的第一个问题是您通过 HTTPS 访问 Pen 并通过 HTTP 请求 Wikipedia API。发生这种情况时，您会收到混合内容警告。当您使用安全的 HTTPS URL 时，浏览器不允许您请求不安全的 URL。

然后我尝试在 chrome、mozilla 和 I.E. 中操作设置，但仍然没有响应。我曾与编码人员交谈过，发过电子邮件，打电话给 Centurylink，并与他们的程序员交谈过，已经打电话给 goDaddy 以获得证书，但现在我发现自己仍然没有解决方案。我一直在使用 Codepen 的编辑器进行作业（使用的是通过电子邮件发送给我的实际 http 站点）。我从 5 月 29 日开始研究这个问题，但我没有解决方案。

有人可以帮忙吗？谢谢。

【问题讨论】：

如果您希望 HTTPS 站点为开发目的获取非 HTTPS 资源，这可能是 How to get Chrome to allow mixed content? 的副本但是，当我手动更正 @987654325 时，codepen.io 似乎可以正常工作@ to http:// 所以这似乎没有必要。
我尝试了该方法，但仍然无法获得生成纬度和经度坐标的警报。而且我已经尝试在 chrome 上重置 http 设置。我还查看了其他编码器的代码，他们似乎没有这个问题。我不相信这是网站。

标签： javascript http https

【解决方案1】：

您可以使用一台服务器代理它：App AJAX =>您在后端调用 https 服务器（不是重定向）=>http API

【讨论】：