OpenWeatherMap API HTTPS 拒绝 javascript

15 浏览
0 Comments

OpenWeatherMap API HTTPS 拒绝 javascript

我正在通过免费的编码营地尝试使用OpenWeatherMap API构建一个天气应用，但是它不起作用。我正在使用CodePen，因为需要在此上面提交，并且必须使用https来使用地理位置。这成为一个问题，因为我得到了这个错误信息。

混合内容：页面“https://s.codepen.io/boomerang/8658fc75197c1c3799d7eb446c1be54c1475174843341/index.html?editors=0010”通过HTTPS加载，但请求了不安全的XMLHttpRequest端点“http://api.openweathermap.org/data/2.5/weather?lat=54.757753799999996&lon=-1.6074879&APPID=APIIDHERE”。该请求已被阻止；内容必须通过HTTPS提供。

由于某种原因，我认为如果将API调用更改为HTTPS，它可能会起作用，但然后我得到了这个错误

GET https://api.openweathermap.org/data/2.5/weather?lat=54.757775699999996&lon=-1.6074815999999998&APPID=APIIDHERE net::ERR_CONNECTION_REFUSED

我已经使用了一个API密钥，但我在这里隐藏了它。

我尝试了一些在其他帖子中看到的修复方法，但迄今为止都没有起作用：/

我正在使用以下代码进行请求

function updateLoc (lat, long) {
    var url = "https://api.openweathermap.org/data/2.5/weather?" + 
        "lat=" + lat + 
        "&lon=" + long + 
        "&APPID=" + APPID;
    sendRequest (url);
}
function sendRequest (url) {
    var xmlhttp = new XMLHttpRequest ();
    xmlhttp.onreadystatechange = function () {
        if (xmlhttp.readystate == 4 && xmlhttp.status == 200) {
            var data = JSON.parse (xmlhttp.responseText);
            var weather = {};
            weather.icon = data.weather.icon;
            weather.dir = data.wind.deg;
            weather.wind = data.wind.speed;
            weather.temp = data.main.temp;
            weather.loc = data.name;
            weather.hum = data.main.humidity;
            update (weather);
        }
    };
    xmlhttp.open ("GET", url, true);
    xmlhttp.send ();
}

任何帮助将不胜感激 🙂

0

3 答案

0 Comments

问题的出现原因：OpenWeatherMap API不支持免费的SSL证书。

解决方法：使用代理请求或使用其他服务。或者尝试使用https://pro.openweathermap.org代替原来的API地址。如果想继续使用API提供的功能，可以尝试在普通的http连接下使用codepen，或者尝试使用其他浏览器。如果需要获取地理位置信息，可以尝试寻找其他获取坐标的方法。

0
0 Comments

问题的原因是由于OpenWeatherMap API仅支持HTTP协议，而不支持HTTPS协议。这导致在使用HTTPS协议时，会出现HTTPS refusal错误。

解决方法是通过在API的URL前面添加https://cors-anywhere.herokuapp.com/来绕过这个问题。这样，API的URL就变成了类似下面的形式：

https://cors-anywhere.herokuapp.com/http://api.openweathermap.org/data/2.5/forecast/daily?q=Bamenda&appid=****myid

通过这种方式进行API调用，就可以将其视为安全的HTTPS请求，从而解决了HTTPS refusal的问题。

0
0 Comments

OpenWeatherMap API HTTPS拒绝javascript的问题可能出现的原因是代码中的错误拼写。从上面的内容可以看出，问题出在代码中将"readystate"拼写为"readyState"。下面是解决该问题的方法。

在JavaScript中，XMLHttpRequest对象的属性名称是readyState，而不是readystate。因此，需要将代码中的错误拼写进行修正。以下是修改后的代码示例：

// 创建XMLHttpRequest对象
var xhttp = new XMLHttpRequest();
// 监听请求状态的变化
xhttp.onreadystatechange = function() {
  if (this.readyState == 4 && this.status == 200) {
    // 请求成功的处理逻辑
    console.log("请求成功");
  } else {
    // 请求失败的处理逻辑
    console.log("请求失败");
  }
};
// 发送请求
xhttp.open("GET", "https://api.openweathermap.org/data/2.5/weather?q=London&appid=your_api_key", true);
xhttp.send();

通过将错误拼写修正为正确的"readyState"，代码应该能够成功发送HTTPS请求到OpenWeatherMap API，并根据返回的状态进行相应的处理。

以上是关于OpenWeatherMap API HTTPS拒绝javascript的问题的原因和解决方法。修正代码中的错误拼写，即可正常发送HTTPS请求并处理返回的数据。

0