Biblioteca de visor de PDF JavaScript de código abierto

¿Qué es PDF.js?

PDF.js es una biblioteca de visualización de PDF basada en JavaScript y HTML5 de código abierto desarrollada por Mozilla que permite ver documentos PDF (formato de documento portátil) en el navegador.

PDF.js admite varias funciones que se enumeran a continuación:

• Renderizar archivos PDF: puede abrir y ver, leer o renderizar documentos PDF en navegadores web.
• Imprimir/guardar archivos PDF: PDF.js también permite imprimir o guardar documentos PDF desde su navegador web favorito.
• Modo de presentación: Al utilizar el modo de presentación, puede mostrar páginas PDF en pantalla completa y navegar a cada página como si fuera una diapositiva de presentación.
• Navegación de PDF: PDF.js proporciona controles de navegación más sencillos mediante los cuales puede pasar a las páginas anteriores o siguientes. También puede saltar rápidamente a la página deseada ingresando el número de la página.
• Anotación de PDF: También puede anotar documentos PDF agregando texto, imágenes o dibujos en las páginas PDF.
• Rotar páginas PDF: Con PDF.js, también puede rotar páginas PDF en el sentido de las agujas del reloj o en el sentido contrario a las agujas del reloj.
• Desplazamiento de PDF: PDF.js ofrece buenos controles para desplazar las páginas horizontal o verticalmente, etc.
• Propiedades del documento PDF: Por último, pero no menos importante, también puede ver las propiedades de los documentos PDF dentro del navegador utilizando el visor PDF.js.

Estadísticas de GitHub

Nombre:
Idioma:
Estrellas:
Tenedores:
Licencia:
El repositorio se actualizó por última vez en

Primeros pasos con PDF.js

Hay tres formas de obtener PDF.js y empezar a utilizarlo en tus proyectos web.

1. Construir desde la fuente

Puede clonar el repositorio PDF.js desde GitHub y compilarlo usted mismo después de instalar Node.js, gulp y dependencias de PDF.js siguiendo los pasos a continuación:

git clone https://github.com/mozilla/pdf.js.git
cd pdf.js

https://nodejs.org/en/download

npm install -g gulp-cli

npm install

gulp server

2. Utilice una distribución prediseñadas

PDF.js también ofrece distribuciones prediseñadas junto con el código fuente que puede encontrar en lanzamientos de PDF.js en GitHub. . Puede descargar la biblioteca PDF.js prediseñadas y comenzar a usarla.

3. Utilice la biblioteca alojada a través de CDN

PDF.js también está alojado en servidores CDN gratuitos. A continuación se comparten algunos enlaces:

• https://cdnjs.com/libraries/pdf.js
• https://www.jsdelivr.com/package/npm/pdfjs-dist
• https://unpkg.com/pdfjs-dist

Ejecute el visor PDF.js

Después de descargar y extraer una biblioteca de distribución prediseñadas de GitHub, encontrará dos carpetas: build y web. Los archivos de la biblioteca PDF.js se pueden encontrar en la carpeta build, mientras que la carpeta web contiene un proyecto de visor que incluye visor.html, visor.css, visor.js y archivos relacionados. Si revisa el código de Viewer.html, puede ver que hace referencia a la biblioteca pdf.js desde la carpeta de compilación y también a otros archivos css y js relacionados.

Ejecutemos visor.html en el navegador para ver cómo se ve el visor PDF.js:

Renderizar/Ver documentos PDF

Para simplemente renderizar o ver un documento PDF en el navegador usando la biblioteca del visor PDF.js, debemos incluir la biblioteca PDF.js en el encabezado de nuestro documento HTML usando la etiqueta script y agregar un canvas al cuerpo HTML y luego agregue el código JavaScript necesario para usar pdfjsLib y prometa objetos para manejar la carga y representación asincrónica del documento PDF.

El código anterior simplemente carga un documento PDF en el navegador sin ninguna interfaz de usuario ni controles como se muestra a continuación:

Demostración en línea

Pruebe esta en línea Demostración de PDF.js Viewer para explorar todas las funciones de la biblioteca PDF.js.

Conclusión

PDF.js es una biblioteca de visualización de PDF JavaScrpit gratuita y de código abierto con una sólida comunidad. Proporciona compatibilidad con varios navegadores, tanto para navegadores modernos como heredados. Sí, la experiencia del usuario en los navegadores antiguos puede no ser la misma que la de los modernos, pero sigue siendo buena como biblioteca gratuita. Es seguro y personalizable. Las funciones son limitadas, pero como visor de PDF funciona muy bien.

PDF.js proporciona buenas API y arquitectura para crear un visor de PDF basado en web. Dado que agregar más controles de interfaz de usuario al visor lleva mucho tiempo para ahorrar tiempo a los desarrolladores, PDF.js también proporciona el código fuente de un visor de PDF completamente funcional y rico en funciones que puede encontrar (consulte visor.html, visor.js y Viewer.css, etc.) en la carpeta web del paquete de distribución de la biblioteca PDF.js.

Productos Similares