JSON es un formato utilizado para el intercambio de información entre sistemas. Utiliza Javascript como lenguaje y sintaxis para la definición de objetos, en archivos de texto que son transferidos fácilmente por Internet. Poco a poco se ha ido incorporando al uso habitual en el desarrollo web por su facilidad de uso y su integración en lenguajes de programación habituales, como PHP. En este artículo vamos a presentar una práctica con JSON en PHP basada en el uso del API de Panoramio.

Panoramio es un popular servicio de Google, como probablemente sabremos, que permite subir imágenes localizadas geográficamente en los mapas de Google. Panoramio dispone de un API para la integración de las fotografías de su base de datos en otras aplicaciones web, de manera que cualquier persona puede presentar fotos de lugares del mundo subidas por los usuarios de Panoramio, en su propio sitio web.

El API de Panoramio utiliza JSON como formato de intercambio de la información de las fotos. Por medio de este API podemos construir URL, que solicitadas al sitio de Panoramio, nos devuelven un JSON con los datos de las fotografías, es decir, su título, autor, URL del archivo gráfico, etc. Gracias a la integración de JSON en la mayoría de los lenguajes de programación de aplicaciones web, desde casi todas las plataformas de programación para el desarrollo, se pueden obtener fácilmente las fotos y presentarlas en un sitio web.

Como venimos explicando en el Manual de Trabajo con JSON en PHP, este lenguaje de programación dispone de varias funciones que sirven para consumir archivos JSON y convertirlos en objetos PHP con los que podemos trabajar. Podemos ver como es de práctico el JSON al utilizar el API de Panoramio y cómo en pocas líneas de código podemos acceder a Panoramio y consultar su base de datos de fotografías y mostrarlas en nuestra página web.

Pasos del script PHP para consultar el API de Panoramio

Para crear un programa en PHP que consulte el API de Panoramio tenemos que realizar varios pasos:

1. Conectar con una URL de Panoramio, enviando los datos sobre la localización desde donde queremos obtener fotos, para recibir un JSON con los datos de dichas fotos.
2. Procesar el JSON, para obtener un objeto PHP con los datos de las fotografías.
3. Hacer un bucle para recorrer las fotografías del objeto, para mostrar las fotografías obtenidas en nuestra página.

Todos estos pasos son sencillos, pero necesitaremos alguna idea sobre distintas partes de PHP, pero afortunadamente en Desarrollo web .com tenemos artículos para obtener la base de conocimientos necesaria para realizar cualquiera de estos pasos.

Conectar con una URL de Panoramio:

Esto lo tenemos que hacer con las funciones de trabajo con archivos de texto que dispone PHP, pues la lectura de ficheros se hace con las mismas funciones que la lectura de URLs, tal como explicamos en el artículo Leer ficheros con PHP.

Primero tenemos que crear una URL para la consulta en el API de Panoramio, que tendrá una forma como esta:

http://www.panoramio.com/map/get_panoramas.php?order=popularity&set=full&from=0&to=5&minx=-0.35&miny=39.44&maxx=-0.34&maxy=39.46&size=medium

Esto nos devolvería fotos:

• por orden de popularidad,
• desde la foto encontrada en posición 0 hasta la posición 5 de ese ranking por popularidad,
• entre unas coordenadas (minx, miny) y (maxx, maxy), o lo que es lo mismo (mínima longitud y latitud) y (máxima longitud y latitud),
• de tamaño medio

Las fotos están indicadas, como se decía, en texto con código Javascript en formato JSON. Así pues, si accedemos a esa URL obtendremos el JSON de respuesta.

Para obtener el texto que devuelve Panoramio al acceder a esa URL tenemos que leerlo con las funciones de archivos. Utilizaremos una función ya explicada en el artículo Leer ficheros con PHP

function leer_contenido_completo($url){
   $fichero_url = fopen ($url, "r");
   $texto = "";
   while ($trozo = fgets($fichero_url, 1024)){
      $texto .= $trozo;
   }
   return $texto;
}

Así pues, con una llamada a esta función, enviando la URL que deseamos consultar, podríamos obtener el JSON con las fotos.

$URL_API_PANORAMIO = "http://www.panoramio.com/map/get_panoramas.php?order=popularity&set=full&from=0&to=5&minx=-0.35&miny=39.44&maxx=-0.34&maxy=39.46&size=medium";

$contenido_url = leer_contenido_completo($URL_API_PANORAMIO);

Procesar el JSON:

Como ya vimos en el artículo Consumir un JSON desde PHP, PHP dispone de la función json_decode() que devuelve un objeto PHP resultante de procesar el JSON enviado como un string por parámetro. En nuestro ejemplo podríamos hacer lo siguiente:

$JSON_PANORAMIO_PHP = json_decode($contenido_url);

En la variable $JSON_PANORAMIO_PHP tendremos el objeto PHP resultante de la decodificación del JSON recibido en el contenido de la URL.

Hacer un bucle para recorrer las fotografías del objeto

Ahora nos queda el paso más sencillo para los que ya tienen cierta experiencia con PHP, hacer un recorrido de todas las fotos que hayamos recibido. Ese recorrido deberá tener en cuenta el formato del objeto que se recibe en el JSON. Ese objeto tiene los siguientes atributos:

• count (con el número de fotos encontradas en todo panoramio entre las coordenadas dadas, que no tiene por qué corresponder con el subconjunto de fotos recibidas.
• photos (que es un array con todas las fotos recibidas. Cada foto es otro objeto, que tiene los datos de esa foto en particular)
• has_more (con un boleano que indica si hay o no otras fotos disponibles para este punto)

Entonces nuestro bucle PHP tiene que hacer un recorrido al array de fotografías que hay en el atributo "photos" del objeto PHP. Podría tener esta forma:

for ($i=0; $i<count($JSON_PANORAMIO_PHP->photos); $i++){
   $foto_actual = $JSON_PANORAMIO_PHP->photos[$i];
   echo "<p>";
   echo "<img src='" . $foto_actual->photo_file_url . "' width='" . $foto_actual->width . "' height='" . $foto_actual->height . "'>";
   echo "<br>";
   echo "<small>" . $foto_actual->photo_title . ", por " . $foto_actual->owner_name . "</small>";
   echo "</p>";
}

Este recorrido se podría haber hecho de otra forma, pero nos sirve perfectamente un bucle for. Además, quizás vosotros colocaríais las fotos con otro estilo, para adaptarlas al diseño de vuestra página.

Si se desea, podemos ver las fotos de Panoramio que hay en esa localización, que corresponde con la Ciudad de las Ciencias y las Artes de Valencia.

Código PHP completo

A continuación para una referencia más completa, podemos ver el código completo de la página PHP que hemos creado para hacer este ejemplo de trabajo con JSON en PHP.

<html>
<head>
   <title>Consumir JSON del API de Panoramio desde PHP</title>
</head>

<body>

<?

function leer_contenido_completo($url){
   $fichero_url = fopen ($url, "r");
   $texto = "";
   while ($trozo = fgets($fichero_url, 1024)){
      $texto .= $trozo;
   }
   return $texto;
}
$URL_API_PANORAMIO = "http://www.panoramio.com/map/get_panoramas.php?order=popularity&set=full&from=0&to=5&minx=-0.35&miny=39.44&maxx=-0.34&maxy=39.46&size=medium";

$contenido_url = leer_contenido_completo($URL_API_PANORAMIO);

echo $contenido_url;

$JSON_PANORAMIO_PHP = json_decode($contenido_url);

echo "<hr>";

//echo $JSON_PANORAMIO_PHP->count; //esto muestra el número de fotos totales que existen en Panoramio en esa localización
for ($i=0; $i<count($JSON_PANORAMIO_PHP->photos); $i++){
   $foto_actual = $JSON_PANORAMIO_PHP->photos[$i];
   echo "<p>";
   echo "<img src='" . $foto_actual->photo_file_url . "' width='" . $foto_actual->width . "' height='" . $foto_actual->height . "'>";
   echo "<br>";
   echo "<small>" . $foto_actual->photo_title . ", por " . $foto_actual->owner_name . "</small>";
   echo "</p>";
}
?>
</body>
</html>

Podemos ver el script en marcha en una página aparte.