Generar PDF en Laravel con DomPDF

  • Por
  • PHP
Cómo crear documentos en formato PDF desde Laravel, usando la librería DomPDF, a partir de código HTML.

La librería DomPDF es una sencilla alternativa para la construcción de PDF en PHP. Nos ofrece la posibilidad de crear los documentos PDF a partir de código HTML, que puede residir en un archivo, una cadena de texto, etc. A partir de ese código HTML crea un documento PDF que se puede descargar, almacenar en el servidor o cualquier otra operación que se desee.

Alternativas para crear PDF en PHP hay varias, pero esta es interesante por no depender de otros programas de compleja instalación. Genera el PDF con bastante fidelidad a partir del código HTML y soporta casi todo el CSS de nivel 2 y algo de CSS 3. De todos modos, si no es la que te interesa, puedes consultar otros artículos de DesarrolloWeb.com donde ya hemos tratado la creación de PDF por ejemplo con FPDF.

Yo la seleccioné porque necesitaba una herramienta que me permitiese crear documentos con cabecera y pie de página, que se repitieran a lo largo de todas las páginas del PDF. Eso se consigue a partir de un código HTML sencillo que luego veremos.

La mayor precaución que se debe tomar para usar la librería DomPFD con mejores resultados es tener un HTML de origen bien formado. Se lleva mal con el HTML incorrecto, por lo que no es mala idea contar con alguna otra librería como Tidy o HTML Purify que pueden ayudar al filtrar cosas y saber si el HTML está correcto.

Instalación de DomPDF para PHP

La instalación se realiza en Laravel por medio de un “wraper” o envoltura, que nos ofrece directamente el “service provider” que necesitamos para integrarlo en el framework. Lo podemos instalar usando Composer, que ya sabemos es el gestor de paquetes para PHP.

En el composer.json agregamos esta dependencia en el objeto “require”

"barryvdh/laravel-dompdf": “0.6.*"

Luego ejecutamos en la terminal, desde la raíz del proyecto, el comando:

composer update

Eso nos descargará el propio wraper, pero también todas sus dependencias que no tengamos todavía como la librería DomPDF.

Ahora nos queda asociar este service provider en nuestro archivo config/app.js. Nos dirigimos a la lista de todos los proveedores de servicio y en el array 'providers' agregamos:

Barryvdh\DomPDF\ServiceProvider::class,

Además opcionalmente esta envoltura nos proporciona un “facade”, ya sabes, una fachada para ahorrar un poco de código a la hora de usar esta clase por medio de funciones. Esta la tienes que configurar en el array ‘aliases’, también sobre el mismo app.js.

PDF' => Barryvdh\DomPDF\Facade::class,

Usar DomPDF desde Laravel

A partir de ahora ya estamos en posición de usar DomPDF desde Laravel. Dependiendo de cómo esté tu aplicación trabajarás con la librería desde un controlador o desde otro lugar. Vamos a ir a lo simple, usando la librería directamente desde el sistema de rutas, pero asumimos que no será lo más habitual, como has aprendido en el Manual de Laravel.

El HTML de origen para la generación del PDF también puede llegar desde varios sitios, un archivo, una vista, o una simple cadena de texto que tengas en una variable. En este caso vamos a traernos el HTML que nos genera una vista dentro de Laravel. Además, como estarás comprobando en el código siguiente, estamos usando DomPDF a través de su fachada.

Route::get('/test/', function () {
  $pdf = PDF::loadView('pruebaparapdf');
  return $pdf->download('pruebapdf.pdf');
});

En la primera línea generamos el PDF, gracias al método PDF::loadView(), indicando el nombre de la vista que hemos usado.

En la segunda línea tenemos una de las varias opciones que podemos implementar para la distribución de este PDF, por medio del método download(), indicando el nombre del archivo que se generará para descarga. El resultado es que nuestro navegador descargará el archivo y tendrá el nombre ‘pruebapdf.pdf’.

HTML para generar un PDF

Como decía, lo que me pareció interesante de esta librería es la posibilidad de generar cabecera y pie de página para todas las páginas del documento. Eso se consigue simplemente con un HTML y un poco de CSS para posicionamiento de los elementos que van a servir como contenedores del pie y cabecera de la página.

Como verás en el ejemplo, se puede generar hasta la numeración de las páginas, algo muy útil cuando tienes informes largos que generar en PDF.

Nota: En este ejemplo que reproduzco a continuación creo la cabecera y pie de página con un HEADER y un FOOTER, etiquetas de sobra conocidas de HTML5. Pero podrías usar cualquier otro elemento HTML de tu preferencia. Lo importante aquí son los estilos definidos en el CSS. Por cierto, el ejemplo está directamente inspirado en la página de demo de DomPDF.

<html>
<head>
  <style>
    body{
      font-family: sans-serif;
    }
    @page {
      margin: 160px 50px;
    }
    header { position: fixed;
      left: 0px;
      top: -160px;
      right: 0px;
      height: 100px;
      background-color: #ddd;
      text-align: center;
    }
    header h1{
      margin: 10px 0;
    }
    header h2{
      margin: 0 0 10px 0;
    }
    footer {
      position: fixed;
      left: 0px;
      bottom: -50px;
      right: 0px;
      height: 40px;
      border-bottom: 2px solid #ddd;
    }
    footer .page:after {
      content: counter(page);
    }
    footer table {
      width: 100%;
    }
    footer p {
      text-align: right;
    }
    footer .izq {
      text-align: left;
    }
  </style>
<body>
  <header>
    <h1>Cabecera de mi documento</h1>
    <h2>DesarrolloWeb.com</h2>
  </header>
  <footer>
    <table>
      <tr>
        <td>
            <p class="izq">
              Desarrolloweb.com
            </p>
        </td>
        <td>
          <p class="page">
            Página
          </p>
        </td>
      </tr>
    </table>
  </footer>
  <div id="content">
    <p>
      Lorem ipsum dolor sit...
    </p><p>
    Vestibulum pharetra fermentum fringilla...
    </p>
    <p style="page-break-before: always;">
    Podemos romper la página en cualquier momento...</p>
    </p><p>
    Praesent pharetra enim sit amet...
    </p>
  </div>
</body>
</html>

Eso es todo. Es así de simple. Puedes incluir imágenes y otros tipos de contenido, aplicando estilos CSS que podrías incluso tener en archivos aparte. Ahora es simplemente documentarse, aunque la verdad es que no se encuentra mucha información (y eso es un punto flaco) a no ser la página del repositorio de github de DomPDF.

Autor

Miguel Angel Alvarez

Miguel es fundador de DesarrolloWeb.com y la plataforma de formación online EscuelaIT. Comenzó en el mundo del desarrollo web en el año 1997, transformando su hobby en su trabajo.

Compartir

Comentarios

daniel_rg

26/5/2016
Aclaración
El archivo es el config/app.php
Saludos exente tuto espero porno tengan temas como Ajax respuestas en json, mejores prácticas de layouts

Andrés Zapata

22/8/2017
Agradecimiento
Estaba buscando en la documentación y no lograba entender muy bien, prácticamente creoq ue le has hecho el trabajo a muchos, este formato solucionó todos mis inconvenientes con el CSS aplicado a esta librería.

Nuevamente gracias.