Cómo extraer los mapas de sitio de una página web para mejorar la eficiencia

Utilizar información pública para el crecimiento de un negocio es una práctica habitual entre los empresarios de todo el mundo.

La inteligencia de precios, el seguimiento de la competencia, la optimización de ingresos y otras soluciones para ayudar a que tu negocio prospere se pueden obtener utilizando una herramienta de web scraping. Imagina cuánto tiempo llevaría copiar y pegar la información de cientos de productos en una tabla. Aquí es donde WebScrapingAPI cambia las reglas del juego.

Supongamos que quieres extraer los productos de un sitio web de forma masiva. Una forma de utilizar una herramienta de web scraping es seleccionar manualmente la URL de cada página de producto para que la herramienta la extraiga. Esto significa que debes investigar un poco en el sitio web y ver dónde se encuentra cada página de producto, etc.

Si el sitio web solo tiene unas pocas docenas de páginas, puede ser manejable, pero ¿y si el sitio web tiene cientos o incluso miles de páginas? El trabajo podría resultar un poco tedioso, llevar mucho tiempo y ser también desagradable.

¿Qué podemos hacer en una situación así?

Mapas del sitio. ¿Qué son?

Los mapas de sitio pueden ser beneficiosos cuando hablamos de SEO. Son como el plano de un sitio web, ya que ayudan a los motores de búsqueda a encontrar, rastrear o incluso indexar todo el contenido de tu sitio web.

Por lo general, los utilizan los sitios web de gran tamaño para estructurar mejor sus páginas y ayudar a los motores de búsqueda a identificar las páginas más importantes de entre las menos relevantes.

¿Podemos aprovechar estos mapas del sitio a nuestro favor al extraer datos? ¡Por supuesto! Descubramos cómo pueden ayudarnos a extraer el contenido de un sitio web de forma masiva.

Para poder utilizar WebScrapingAPI, necesitamos crear nuestra cuenta y obtener nuestra clave de acceso privada, que se utiliza para autenticarnos en la API. No tienes de qué preocuparte, ya que crear tu cuenta es gratis y no necesitas añadir tu tarjeta ni otra información personal.

Al iniciar sesión, se nos redirigirá al panel de control. Aquí veremos nuestra clave de acceso, que utilizaremos en unos momentos. Asegúrate de guardarla en un lugar seguro, pero si crees que tu clave privada se ha visto comprometida, siempre puedes restablecerla pulsando el botón «Restablecer clave API».

Para obtener más detalles sobre cómo funciona WebScrapingAPI y cómo se puede integrar en tu proyecto, siempre puedes consultar su documentación, y para probarlo, ¡el API Playground te ayuda a visualizar los resultados aún mejor!

Basta ya de presentación, veamos cómo podemos usar WebScrapingAPI para extraer datos mediante mapas del sitio.

Para este ejemplo, utilizaremos NodeJS como lenguaje de programación, pero puedes usar el lenguaje con el que te sientas más cómodo. A continuación, extraeremos el mapa del sitio y analizaremos las URL de los productos, extraeremos las páginas de los productos y almacenaremos los datos en un archivo CSV. De esta forma, puedes extraer datos de forma masiva utilizando WebScrapingAPI, pero si deseas extraer solo determinadas páginas, también puedes realizar solicitudes específicas.

En este ejemplo, analizaremos los mapas del sitio de Maplin, que se encuentran al final de su archivo robots.txt.

Al seguir la URL anterior, seremos redirigidos al XML que contiene los enlaces del mapa del sitio.

Si seguimos el primer enlace de arriba, llegaremos al mapa del sitio de diferentes páginas, ¡algunas de las cuales son páginas de productos! Esas son las páginas de las que extraeremos datos y los guardaremos en un archivo CSV para su uso posterior. Suena sencillo, ¿verdad?

Para extraer solo los datos que necesitamos, tenemos que saber dónde se encuentran. Para ello, visitemos la URL de los interruptores de iluminación inteligentes de arriba y utilicemos la herramienta de inspección del desarrollador.

Observamos que cada producto de la lista se encuentra bajo una etiqueta li con la clase ais-Hits-item.

Dentro de este nodo, vemos que el título y el precio se encuentran bajo la etiqueta h3 con la clase result-title y la etiqueta span con la clase after_special price, respectivamente.

Este paso es bastante sencillo; solo hay que instalar este conjunto de paquetes:

• jsdom: útil para el análisis de HTML.
• got: este paquete nos ayudará a realizar la solicitud HTTP a WebScrapingAPI.
• xml2js: analizará el XML y lo convertirá en un objeto para facilitar su uso.
• csv-writer: para almacenar los datos extraídos en un archivo CSV.

Para instalar todos estos paquetes, solo tienes que usar esta línea de comando en el terminal de tu proyecto:

npm install jsdom got xml2js csv-writer

Aquí utilizaremos una de las funciones de WebScrapingAPI para renderizar la página y esperar a que se cargue todo su contenido. De esta forma, podremos obtener más datos. No olvides añadir tu clave de acceso privada y la URL que deseas rastrear; en nuestro caso, la URL del mapa del sitio que contiene los enlaces a las páginas de productos.

const api_url = "https://api.webscrapingapi.com/v1"
const url = "https://www.maplin.co.uk/media/sitemap/maplin_uk-1-1.xml"
let params = {
   api_key: "XXXXX",
   url: url,
   render_js: 1,
   wait_until: 'networkidle2'
}

Tras obtener el resultado de la API, debemos convertir la cadena XML en un objeto.

const response = await got(api_url, {searchParams: params})

const parser = new xml2js.Parser()
parser.parseString(response.body, async function (err, result) { 
// the rest of the code 
}

El siguiente paso será recorrer las URL de los productos, crear una solicitud para cada una de ellas con el fin de extraer los datos del producto y seleccionar qué información necesitamos almacenar.

En este ejemplo no necesitaremos recorrer todas las URL del mapa del sitio, así que tomemos solo las URL de la posición 5 a la 10. A continuación, prepararemos los parámetros para la solicitud de la API y utilizaremos JSDOM para analizar el HTML resultante.

Para seleccionar el título y el precio del producto, vimos anteriormente que se encuentran dentro de la etiqueta h3 con la clase result-title y la etiqueta span con la clase after_special price, respectivamente.

Tras crear un objeto con el título y el precio que acabamos de extraer, lo añadimos a la matriz de productos.

El código debería tener un aspecto similar a este:

let products = []

for (let index = 5; index < 10; index++) {
   params.url = result['urlset']['url'][index]['loc'][0]

   const res = await got(api_url, {searchParams: params})

   const {document} = new JSDOM(res.body).window

   const elements = document.querySelectorAll('li.ais-Hits-item')
   if (elements) {
       elements.forEach((element) => {
           let element_obj = {}

           const title = element.querySelector('h3.result-title')
           if (title && title.innerHTML) element_obj.title = title.innerHTML
           const price = element.querySelector('.after_special.price')
           if (price && price.innerHTML) element_obj.price = price.innerHTML

           if (element_obj && element_obj.title && element_obj.price)
               products.push(element_obj)
       })
   }
}

Aquí es donde utilizamos la biblioteca csv-writer para convertir una lista de objetos en un archivo CSV.

Basta con especificar la ruta y el nombre del archivo que se va a crear, y la matriz de encabezados, que consta de objetos de columna, donde el id representa las propiedades de los objetos de producto y el título es el nombre de la columna.

const csvWriter = require('csv-writer').createObjectCsvWriter({
   path: 'products.csv',
   header: [
       {id: 'title', title: 'Product Name'},
       {id: 'price', title: 'Product Price'}
   ]
})
csvWriter.writeRecords(products).then(() => console.log('Success!!'))

Hemos extraído datos con éxito utilizando mapas del sitio para navegar por las páginas de productos de un sitio web, ¡enhorabuena! Aquí tienes la vista completa del código:

const {JSDOM} = require("jsdom");
const got = require("got");
const xml2js = require("xml2js");

(async () => {
   const api_url = "https://api.webscrapingapi.com/v1"
   const url = "https://www.maplin.co.uk/media/sitemap/maplin_uk-1-1.xml"
   let params = {
       api_key: "XXXXX",
       url: url,
       render_js: 1,
       wait_until: 'networkidle2'
   }
   const response = await got(api_url, {searchParams: params})

   const parser = new xml2js.Parser()
   parser.parseString(response.body, async function (err, result) {

       let products = []

       for (let index = 5; index < 10; index++) {
           params.url = result['urlset']['url'][index]['loc'][0]

           const res = await got(api_url, {searchParams: params})

           const {document} = new JSDOM(res.body).window

           const elements = document.querySelectorAll('li.ais-Hits-item')
           if (elements) {
               elements.forEach((element) => {
                   let element_obj = {}

                   const title = element.querySelector('h3.result-title')
                   if (title && title.innerHTML) element_obj.title = title.innerHTML
                   const price = element.querySelector('.after_special.price')
                   if (price && price.innerHTML) element_obj.price = price.innerHTML

                   if (element_obj && element_obj.title && element_obj.price)
                       products.push(element_obj)
               })
           }
       }

       const csvWriter = require('csv-writer').createObjectCsvWriter({
           path: 'products.csv',
           header: [
               {id: 'title', title: 'Product Name'},
               {id: 'price', title: 'Product Price'}
           ]
       })

       csvWriter.writeRecords(products).then(() => console.log('Success!!'))
   })
})();

Espero que este tutorial te haya resultado útil y te haya ayudado a comprender lo sencillo que es utilizar los mapas del sitio a nuestro favor en el web scraping.

Además, requiere mucho menos tiempo y, de esta forma, no te perderás ninguna página, como suele ocurrir al navegar manualmente por un sitio web.

Cuando se trata de extraer datos a gran escala, está claro que utilizar mapas del sitio es una solución mucho mejor que seleccionar manualmente cada página de producto o incluso utilizar una araña para rastrear el sitio web.

Hasta el próximo episodio de nuestro programa sobre web scraping, ¿qué tal si pruebas WebScrapingAPI? Puedes probarlo con hasta 1000 llamadas API gratuitas. ¡Hasta la próxima!