Tomar screenshots / capturas de pantalla de páginas web desde la consola de Linux
Puede que os interese hacer capturas de pantalla de páginas web para poder mostrar una previsualización de una web en el apartado de links de vuestro site.
Para ello podéis utilizar alguno de los muchos servicios que corren por ahí —como Websnapr, WebShotsPro, thumbalizr… O bien, si disponéis de un servidor dedicado (véase el que todos tenemos en la cocina o el baño) podéis crear vuestro propio script para tomar capturas de pantalla. Y ésto es a lo que vamos 😛
Antes de empezar.. os advierto que he hecho las pruebas desde ubuntu server maverick, pero esto en teoría debería de ser más o menos igual para el resto de versiones (tanto desktop como server).
Si lo que queréis es hacer capturas de pantalla desde Windows, quizás os interese IECapt.
Primero de todo, necesitamos unos cuantos paquetes esenciales…
- Vnc4server
- Firefox
- ImageMagick
Con VNCServer crearemos una instancia virtual en la que ejecutaremos Firefox para, posteriormente, tomar la captura de la pantalla con el método import de imagemagick.
Instalad los paquetes como haríais habitualmente…
sudo apt-get install vnc4server firefox imagemagick
Si trabajáis con ubuntu server os va a doler porque firefox baja un huevo de paquetes.. pero es lo que hay U_U
Una vez instalados todos los paquetes, vamos a crear nuestro script para generar screenshots:
#!/bin/bash
display=":23"
export DISPLAY=":23"
vncserver -geometry 1280x1024 -depth 24 -name "screenshoots" $display &
# esperamos a que cargue vnc sin problemas...
sleep 5
# cargamos firefox con una página en blanco
firefox -display $display -width 1280 -height 1024 -url "about:blank" &
while read -a line ; do
echo "Carregant... ${line[1]}"
firefox -remote "openURL(${line[1]})"
# o bien... firefox -display $display "${line[1]}"
sleep 5
echo "Desant... ${line[0]}.jpg"
import -window root "${line[0]}".jpg
done < listado.txt
vncserver -kill $display
¿Qué hace este script?
- Crea una instancia de vncserver a 1280x1024px
- Carga firefox en esa instancia a la misma resolución
- Carga el fichero “listado.txt” (que ahora veremos) que contiene una línea con una palabra única seguida de un tabulador y una URL.
- Abre la página web que pertoque, esperando 5 segundos para dar tiempo a cargar
- Toma la captura de pantalla y la guarda con la palabra única y extensión .jpg
El fichero “listado.txt” deberá estar en el mismo directorio que el script y ser en este formato:
underave http://www.underave.net musicavermella http://www.musicavermella.com thefuture http://www.thefutureimperfect.com snooppets http://www.snooppets.com
Es importante que este fichero tenga un salto de línea al final, sino la última url dará error.
Hecho esto ya debería de funcionar, simplemente ejecutad el script y veréis que en pantalla van saliendo los mensajes “Carregant” (Cargando) y “Desant” (Guardando) a medida que va avanzando en el listado.
Cuando tengáis los screenshots probablemente os daréis cuenta de que la imagen no es sólo de la página web, sino que también sale el navegador.
Para evitar esto he estado probando con parámetro -screen en lugar de -window pero supongo que no hace lo que pensaba que hacía xD. Así que la única solución que se me ocurre es que ejecutéis una instancia de VNCServer con firefox para poder ocultarle todas las barras posibles (la de navegación y la de favoritos).
export DISPLAY=":23" vncserver -geometry 1280x1024 -depth 24 -name "screenshoots" :23 & firefox -display :23 -width 1280 -height 1024 -url "about:blank" &
Una vez esté corriendo utilizad vuestro cliente de vnc habitual (yo utilizo TightVNC) y conectaros para poder configurar firefox. En el caso de TightVNC, para indicar el display que estamos utilizando simplemente hay que concatenarlo al final de la ip o nombre de host ([IP|HOST]:DISPLAY), por ejemplo 192.168.1.2:23
Si además queréis que no se muestren las pestañas, abrid las opciones de firefox, buscad la opción que dice “Mostrar pestañas siempre” y desmarcadla. Ahora, para que esto funcione, tenemos que decirle a firefox que nos abra las nuevas ventanas en la ventana que esté abierta, ya que si nos abre una pestaña más nos mostrará de nuevo la barra de pestañas.
Si queréis evitar esto, en la barra de navegación (utilizad Control+L si os la habéis cargado ya) introducid la URL about:config, buscad el registro browser.link.open_newwindow y cambiad su valor de 3 a 2.
Cerrad vuestro firefox con normalidad y volved a ejecutar el script para ver el resultado.
Pues ahí lo tenéis, utilizando un poco la imaginación, con algún cron y alguna clase en PHP podríais tener las miniaturas guardadas en vuestra web.
Si queréis recortar las imágenes para que no se vean el resto de bordes de firefox podéis tratar de utilizar el método mogrify de ImageMagick para hacer un crop.
O podéis hacerlo mediante PHP con alguna clase como Watimage 😀
Fuentes…
