Home / Questions / 8277
Accepted
Diego
Asked: 2020-04-22 15:36:41 +0800 CST 2020-04-22 15:36:41 +0800 CST

Why doesn't the browser show me anything?

  • 772

Hi, I'm learning how JSON works with javascript consuming data from a weather api, but when I run it it shows me a blank browser. I took this example from here, I wanted to know what I'm doing wrong that I can't run the example, thanks. http://www.weblantropia.com/2015/05/19/weather-script-really-simple-with-php-or-javascript-and-json-update/

<!DOCTYPE html>
<html>
<head>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"> </script>
</head>
<body>
<script>
var vars;
var temp_c;
var temp_f;

$.ajax({
type: "GET",
url: "http://api.openweathermap.org/data/2.5/weather?q=London, uk",
dataType: "json",
success: function (data) {
vars = data.main;
temp_c = vars.temp - 273.15;
temp_f = 1.8 * (vars.temp - 273.15) + 32;
},
error: function (jqXHR, textStatus, errorThrown) {
alert(errorThrown);
}
});
</script>

</body>
</html>
javascript

3 Answers

  1. Best Answer

    Initially I thought the problem was that you were missing the API because when I go to the AJAX URL I get the following message:

    {"cod":401, "message": "Invalid API key. Please see http://openweathermap.org/faq#error401 for more info."}

    But there is something else. It seems to me that you are not loading the jQuery library correctly, because when I load it, I get an alert message with "Unauthorized". Not having protocol could be a problem if you run the page from local (with protocol file://), try changing the link to the jQuery to have the http protocol:

    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"> </script>

    Now it should work for you (or at least you should get the "Unauthorized" message because you would still be missing the API key)

    • 1

  2. The problem is that you don't have a valid API Key to access this service.

    the call should be:

    http://api.openweathermap.org/data/2.5/forecast/city?id=524901&APPID={APIKEY}

    check how to get the API Key

    http://openweathermap.org/appid

    also remember to add the http:// protocol to access the jquery script:

    src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js">

    • 0

  3. It needs to be placed like this:

    <script src ="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>

    You must also have your key id, which you obtain by registering on the page.

    • -1