Back-End

4 out, 2011

Fazendo screenshots usando wkhtmltoimage e PHP

Publicidade

Salvar screenshots de um site não é uma tarefa muito comum para um
programador, porém é algo interessante de ser feito. Existem
algumas soluções interessantes para fazê-lo. Dentre elas, uma em especial chamou a minha atenção e atendeu muito bem às minhas necessidades.

Um requisito para prosseguir com a solução
apresentada neste artigo é instalar o software wkhtmltoimage. Se você acessar o site do projeto, vai ver que o nome dele é wkhtmltopdf e não wkhtmltoimage, como é mencionado. O wkhtmltoimage existe nos downloads do projeto e você só precisa instalar a versão
adequada para o seu sistema operacional. Tem versões para Linux, Mac e
Windows. Vou guiá-los com base no texto Taking screenshots of websites with PHP.

O software é um simples utilitário para ser executado via shell, que faz a conversão de HTML para imagem usando o WebKit Engine e QT. Não é exatamente uma conversão. Na verdade, a ferramenta renderiza o endereço requisitado utilizando o WebKit Engine e tira um screenshot dessa renderização utilizando o QT.

Fazendo sua primeira screenshot

Levando em consideração que você já tenha o wkhtmltoimage instalado corretamente, abra o seu terminal e digite:

wkhtmltoimage http://www.google.com google.jpg

O código acima vai converter toda a representação HTML do Google para jpg usando o wkhtmltoimage.

Customizando a saída

O comando wkhtmltoimage tem uma série de opções:

  • Desabilitar a renderização de imagens;
  • Controlar a qualidade da imagem de output;
  • Salvar o screenshot com uma resolução específica;
  • Salvar uma região específica do screenshot (crop);
  • Desabilitar o javascript da pagina requisitada.

Exemplos:

//renderiza sem imagens
wkhtmltoimage --no-images http://www.google.com google.jpg

//não carrega os javascripts
wkhtmltoimage --no-javascript http://www.google.com google.jpg

//reduz a qualidade da imagem de output
wkhtmltoimage --quality 50 http://www.google.com google.jpg

//personaliza a largura e a altura do screenshot
wkhtmltoimage --height 600 --width 1800 http://www.google.com google.jpg

//faz um crop de 300x300 pixels partindo do eixo x0 e y0
wkhtmltoimage --crop-h 300 --crop-w 300 --crop-x 0 --crop-y 0 http://www.google.com google.jpg

Utilizando com PHP

Como já era de se imaginar, toda essa façanha não é feita somente com
PHP. Para que ele consiga
executar esses comandos, vamos precisar da ajuda de um método chamado shell_exec do PHP. Também podemos utilizar um wrapper escrito em PHP5 que abstrai os métodos do wkhtmltoimage e o wkhtmltopdf chamado Snappy, escrito em PHP5 do PHP.

Método 1: shell_exec

shell_exec('./wkhtmltoimage --quality 50 http://www.google.com google.jpg');

Método 2: Snappy

<?php

namespace KnplabsSnappy;

require_once('Knplabs/Snappy/Media.php');
require_once('Knplabs/Snappy/Image.php');

/* 'wkhtmltoimage' executable is located in the current directory */
$snap = new Image('./wkhtmltoimage');

/* Displays the bbc.com website index page screenshot in the browser */
header("Content-Type: image/jpeg");
$snap->output('http://www.bbc.com');

?>

Com alguns métodos adicionados:

<?php

namespace KnplabsSnappy;

require_once('Knplabs/Snappy/Media.php');
require_once('Knplabs/Snappy/Image.php');

$options = array('zoom' => 0.5, 'no-images' => true);

/* 'wkhtmltoimage' executable is located in the current directory */
$snap = new Image('./wkhtmltoimage-i386',$options);

/* Displays the bbc.com website index page screen-shot in the browser */
header("Content-Type: image/jpeg");
$snap->output('http://www.bbc.com');

?>

Para qualquer informação a mais, ou qualquer dúvida, estou à disposição.