Pronóstico del tiempo utilizando OpenWeatherMap mediante PHP

En este tutorial vamos a crear una aplicación web que mostrará la previsión del tiempo de una ciudad en concreto utilizando una API. Para ello, utilizaremos el servicio que nos brinda OpenWeatherMap y la implementaremos en nuestra aplicación web mediante PHP. Es decir, concretamente lo que haremos será extraer la información que nos proporcionará la API y mostrarla en la aplicación.

Esta es una de las mejores APIs para obtener información sobre el tiempo. Nos proporciona un gran volumen de datos relacionados con el clima de manera regular. Es un servicio completamente gratuito con acceso limitado. Para un uso básico, como va a ser el nuestro, es más que suficiente. Si quieres algo más avanzado, tendrás que pasar por caja. Integrar esta API en una aplicación PHP es muy sencillo. Simplemente tendrás que seguir estos tres pasos:

  • Obtener la key de la API
  • Localizar el ID de la ciudad
  • Obtener la información del tiempo enviando la key de la API y el ID de la ciudad

Obtener la key de la API

Para obtener la key de la API debes registrarte en OpenWeatherMap. Una vez registrado, podrás acceder a los ajustes de tu perfil. Debajo del formulario de ajustes hay un menú con muchas pestañas. Haz click en la pestaña API keys y copia la key de la API. Esta key la utilizaremos más tarde...

Localizar el ID de la ciudad

Haciendo clic en este enlace, te descargarás un listado de ciudades comprimido. Descomprime el fichero para acceder al listado. Como ves viene en formato JSON y contiene un array de localizaciones. Cada elemento del array contiene geodatos como la latitud, la longitud, el país, la provincia, el nombre de la ciudad...

PHP para mostrar el pronóstico del tiempo

Este código PHP llama al servicio de OpenWeatherMap para obtener la previsión del tiempo. Junto a la llamada, tendremos que enviar también la key que hemos copiado antes de la API y, como no, el ID de la ciudad que queremos mostrar.

Para ello utilizaremos cURL. La respuesta CURL estará en formato JSON. Al decodificar la respuesta JSON, podemos obtener los datos meteorológicos y poblarlos en el navegador.

<?php
$apiKey = "API KEY";
$cityId = "CITY ID";
$googleApiUrl = "http://api.openweathermap.org/data/2.5/weather?id=" . $cityId . "&lang=en&units=metric&APPID=" . $apiKey;

$ch = curl_init();

curl_setopt($ch, CURLOPT_HEADER, 0);
curl_setopt($ch, CURLOPT_RETURNTRANSFER, 1);
curl_setopt($ch, CURLOPT_URL, $googleApiUrl);
curl_setopt($ch, CURLOPT_FOLLOWLOCATION, 1);
curl_setopt($ch, CURLOPT_VERBOSE, 0);
curl_setopt($ch, CURLOPT_SSL_VERIFYPEER, false);
$response = curl_exec($ch);

curl_close($ch);
$data = json_decode($response);
$currentTime = time();
?>

HTML para mostrar el pronóstico

Este código HTML muestra la previsión del tiempo ya con el JSON decodificado.

<!doctype html>
<html>
<head>
<title>Forecast Weather using OpenWeatherMap with PHP</title>
</head>
<body>
    <div class="report-container">
        <h2><?php echo $data->name; ?> Weather Status</h2>
        <div class="time">
            <div><?php echo date("l g:i a", $currentTime); ?></div>
            <div><?php echo date("jS F, Y",$currentTime); ?></div>
            <div><?php echo ucwords($data->weather[0]->description); ?></div>
        </div>
        <div class="weather-forecast">
            <img
                src="http://openweathermap.org/img/w/<?php echo $data->weather[0]->icon; ?>.png"
                class="weather-icon" /> <?php echo $data->main->temp_max; ?>°C<span
                class="min-temperature"><?php echo $data->main->temp_min; ?>°C</span>
        </div>
        <div class="time">
            <div>Humidity: <?php echo $data->main->humidity; ?> %</div>
            <div>Wind: <?php echo $data->wind->speed; ?> km/h</div>
        </div>
    </div>
</body>
</html>

COMPARTE ESTE ARTÍCULO

COMPARTIR EN FACEBOOK
COMPARTIR EN TWITTER
COMPARTIR EN LINKEDIN
COMPARTIR EN WHATSAPP
ARTÍCULO ANTERIOR