lunes, 28 de enero de 2019

Extraer contenido de páginas web y XML con Node.js y jQuery

A veces necesitamos obtener información a partir del contenido de páginas web: imágenes, enlaces, índices, atributos, etc. Existen muchas formas de hacer esto, y las más comunes hacen uso de algún lenguaje interpretado (como Python y Powershell) y alguna librería para procesar XML o el DOM de HTML, pero eso requiere algún grado de experticia en dichas herramientas.

Sin embargo, hay una librería vieja y confiable con la que muchos programadores, en especial los web, están familiarizados, para manipular el DOM de los documentos HTML: jQuery. Esta librería proporciona una gran facilidad para hacer uso de selectores estándar de CSS, así como funciones especiales de búsqueda de elementos. Así que, utilizando Linux como sistema operativo (por lo que no contaba con Powershell), y estando familiarizado con JavaScript/jQuery/Node.js, esta resultó ser la opción más rápida y fácil para mí.

Sin más preámbulo, esto es lo que podemos hacer para extraer información de una página web utilizando jQuery y Node.js:

  1. Creamos un proyecto nuevo con NPM. Para ello ejecutamos el comando npm init, el cual nos solicita información opcional del proyecto paso a paso. Podemos dejar todas las opciones por defecto, o ajustar lo que necesitemos según el caso. Para este ejemplo se modificó el Entry point de "index.js" a "leerHtml.js", para describir el contenido del script. También se cambió la licencia a MIT. El cambio de nombre y licencia solo son una convención personal, no son obligatorios. Por otra parte, cabe mencionar que para este ejemplo se utilizará Node v10.15.0 con NPM v6.4.1, que es la versión con soporte de largo plazo (LTS) al momento de escribir esta entrada.
  2. Instalamos los paquetes request-promise, jsdom y jquery. El primer paquete nos permitirá obtener el HTML desde la web; el segundo paquete nos servirá para modelar el DOM del documento HTML en JavaScript puro; y el tercero es el que utilizaremos para examinarlo y extraer contenido.
  3. Creamos el archivo leerHtml.js, en el que realizaremos el proceso de extracción de datos del HTML. Para este ejemplo, obtendremos los textos alternativos de todas las imágenes de un artículo de Wikipedia. Se listarán solamente aquellas imágenes que posean el atributo alt, y que este no se encuentre vacío. El código fuente y la descripción de cada paso se muestran a continuación:
  4. Cabe notar algunos puntos:
    • Es necesario crear el objeto jQuery a partir del DOM generado con JSDOM.
    • Los métodos auxiliares de jQuery, como find y each, nos retornan objetos HTML, por lo que es necesario crear objetos de jQuery a partir de estos. Tal es el caso de las variables imagen e imagenes, a las cuales fue necesario aplicar la función $.
  5. Finalmente, para ejecutar el script, escribimos en la terminal node leerHtml.js Podremos ver como se muestra en la línea de comandos el listado de los textos alternativos de las imágenes que se encontraron en la página web.


Esta técnica no solo es aplicable para páginas HTML descargadas desde la web, sino también para archivos cargados desde disco, así como para formato XML. A continuación se muestra un script llamado leerXml.js, para obtener de un archivo XML llamado "paises.xml", el listado de países cuyo código inicia con la letra "a":


Puede notarse que el proceso es muy similar, ya que XML es el superset de HTML, y es también soportado por JSDOM y jQuery. Para ejecutar el script, escribimos en la terminal el comando node leerXml.js, lo cual muestra el siguiente resultado:


El código fuente de este ejemplo se puede encontrar acá: https://github.com/guillegr123/node-jq-readxml

Related Articles

0 comentarios:

Publicar un comentario

Con la tecnología de Blogger.