Hoy veremos como incrustar un PDF con PDF.js.
PDF.js es un proyecto de software libre de la fundación Mozilla que a grandes rasgos nos permite utilizar un visor de ficheros pdf para la web de forma genérica, la ventaja que tiene es que utilizando pdf.js utilizaremos el mismo visor en todos los navegadores por tanto nos aseguramos que se verá correctamente en la mayoría de los navegadores actuales.
Para descargar pdf.js podemos entrar en su web oficial y descargar la versión estable. Si utilizamos bower como gestor de dependencias nos bastaría con añadir el repositorio o paquete en .zip de la versión estable de pdf.js.
Una vez que tenemos pdf.js instalado en nuestro proyecto ya sea a mano o con bower, utilizaremos el viewer que tiene por defecto para renderizar los pdf que estén subidos en el servidor.
Ahora podremos entrar a la url del viewer http://localhost/pruebas/pdfjs/web/viewer.html?file=URL_DEL_PDF_DE_ESTE_DOMINIO
En mi caso tengo un directorio llamado files que es en el que están los ficheros pdf y se vería así:
Ahora podremos utilizar esa url para meterla en un iframe y mostrarla en nuestra web de esta forma:
<iframe src="http://localhost/pruebas/pdfjs/web/viewer.html?file=http://localhost/pruebas//files/comandos.pdf"></iframe>
Más información:
https://mozilla.github.io/pdf.js/
