2

Hola estoy aprendiendo el funcionamiento de JSON con javascript consumiendo datos de una api del clima, pero cuando lo ejecuto me muestra el navegador en blanco. Este ejemplo lo saque de aca, queria saber en que estoy fallando que no puedo correr el ejemplo, gracias. http://www.weblantropia.com/2015/05/19/weather-script-realmente-simple-con-php-o-javascript-y-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>
3
  • 1
    Hola @Diego, bienvenido a Stackoverflow ¿Podrías abrir la consola del navegador y verificar si aparece algún error? Si es así, ¿qué error te muestra?
    – learnercys
    el 21 abr. 2016 a las 23:43
  • Cuando voy a la URL indicada recibo este JSON de vuelta: {"cod":401, "message": "Invalid API key. Please see http://openweathermap.org/faq#error401 for more info."}. No me extrañaría que el problema fuera ese :P
    – Alvaro Montoro
    el 21 abr. 2016 a las 23:46
  • Todo código jquery se debería ejecutar dentro de un document.ready()
    – Wilfredo
    el 21 abr. 2016 a las 23:48

3 respuestas 3

1

Inicialmente pensé que el problema era que te faltaba la API porque cuando voy a la URL del AJAX recibo el siguiente mensaje:

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

Pero hay algo más. Me parece que no estás cargando bien la biblioteca de jQuery, porque cuando la cargo, recibo un mensaje de alerta con "Unauthorized". No tener protocolo podría ser un problema si ejecutas la página desde local (con el protocolo file://), trata de cambiar el enlace a la jQuery para que tenga el protocolo http:

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

Ahora te debería funcionar (o al menos deberías recibir el mensaje de "Unauthorized" porque te seguiría faltando la API key)

1
  • Gracias si era eso, saludos.
    – Diego
    el 22 abr. 2016 a las 2:31
0

El problema es que no tienes una API Key valida para acceder a este servicio.

la llamada debería ser:

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

revisa como obtener el API Key

http://openweathermap.org/appid

además recuerda agregar el protocolo http:// para acceder al script jquery:

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

5
  • Creo que hay algo más que sólo eso. Si ejecuto el código de arriba recibo un mensaje de alerta ("Unauthorized") que @Diego parece no recibir. Me parece que OP está intentando ejecutar el fichero html desde local (con el protocolo file://) y entonces no se carga bien jQuery (porque está sin protocolo) y por eso le sale la página en blanco (pero le saldrá un error en la consola)
    – Alvaro Montoro
    el 21 abr. 2016 a las 23:55
  • Bueno ese parece ser otro problema, pero no podrá usar la API sin tener una llave.
    – Jorgesys
    el 22 abr. 2016 a las 0:03
  • Cierto. Pero ese otro problema es el verdadero problema y el problema de la llave vendría después: si lo único que le faltara fuese la llave, recibiría un mensaje de error que ahora mismo no recibe. Por algún motivo parece que no se realiza la llamada AJAX
    – Alvaro Montoro
    el 22 abr. 2016 a las 0:08
  • De hecho acabo de notar lo que comentas no tiene el protocolo http:// para llamar al jquey!
    – Jorgesys
    el 22 abr. 2016 a las 0:16
  • Eso no sería un problema si la página estuviera en un servidor (porque entonces tomaría el protocolo http o https de la página), pero fallaría si no está en un servidor. Por eso pienso que está ejecutando la página en local directamente abriendo el fichero (src=//... no funciona cuando la página se sirve con file://)
    – Alvaro Montoro
    el 22 abr. 2016 a las 0:24
-1

Falta colocarlo así:

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

Además debes tener tu key id, el cual lo obtienes dándote de alta en la página.

1

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.