Cómo utilizar pdf.js [cerrado]

92

Estoy considerando usar pdf.js (una herramienta de código abierto que permite incrustar un pdf en una página web). No hay documentación sobre cómo usarlo.

Supongo que lo que hago es crear una página html con el script al que se hace referencia en el encabezado, y luego en el cuerpo, pongo algún tipo de llamada de función con una matriz del nombre del archivo y la ubicación. ¿Puede alguien ayudarme aquí?

Chris
fuente
1
### Artículo de Github Acabo de comenzar un artículo Configurar PDF.js en un sitio web en la wiki del proyecto en GitHub. ### Solicitud de finalización Si tiene algo de experiencia, complete el artículo.
Édouard Lopez
Algo más de alto nivel como viewerjs.org es probablemente lo que desea.
máximo
Quiero extraer un archivo xml incrustado de PDF, ¿hay alguna forma de hacerlo?
Ananta Prasad

Respuestas:

33

Prueba Google'ing pdf.js documentation

/* create the PDF document */

var doc = new pdf();
doc.text(20, 20, 'hello, I am PDF.');
doc.text(20, 30, 'i was created in the browser using javascript.');
doc.text(20, 40, 'i can also be created from node.js');

/* Optional - set properties on the document */
doc.setProperties({
  title: 'A sample document created by pdf.js',
  subject: 'PDFs are kinda cool, i guess',        
  author: 'Marak Squires',
  keywords: 'pdf.js, javascript, Marak, Marak Squires',
  creator: 'pdf.js'
});

doc.addPage();
doc.setFontSize(22);
doc.text(20, 20, 'This is a title');
doc.setFontSize(16); 
doc.text(20, 30, 'This is some normal sized text underneath.');

var fileName = "testFile"+new Date().getSeconds()+".pdf";
var pdfAsDataURI = doc.output('datauri', {"fileName":fileName});

NOTA: el proyecto "pdf.js" mencionado aquí es https://github.com/Marak/pdf.js y ha quedado obsoleto desde que se publicó esta respuesta. La respuesta de @Treffynnon es sobre el proyecto Mozilla aún activo ( https://github.com/mozilla/pdf.js ) que la mayoría de los buscadores estarán buscando.

James Hill
fuente
Vi eso pero estoy confundido acerca de las cosas sobre var = nombre de archivo. ¿Necesito algo de ese doc.addPage () para doc.text, y los triples doc.texts por encima de eso?
Chris
Otra pregunta sería qué tengo que cambiar. Supongo que tengo que cambiar el primer "nombre de archivo" de la última línea y las propiedades del documento. ¿Es asi?
Chris
25
¿No es este un pdf.js diferente?
Suiza
@Swiss, esto es de febrero, con votos positivos y marcado como la respuesta. Yo diría que esto es lo que estaba buscando el OP.
James Hill
14
Sí, por eso fue tan confuso. La operación aparentemente se refiere al proyecto de mozilla para mostrar archivos PDF como html, pero el proyecto al que se hace referencia en el blog al que se vincula es diferente para crear archivos PDF usando javascript.
Suiza
50

Hay documentación disponible en su archivo léame de github . Citan el siguiente código de ejemplo :

/* -*- Mode: Java; tab-width: 2; indent-tabs-mode: nil; c-basic-offset: 2 -*- */
/* vim: set shiftwidth=2 tabstop=2 autoindent cindent expandtab: */

//
// See README for overview
//

'use strict';

//
// Fetch the PDF document from the URL using promises
//
PDFJS.getDocument('helloworld.pdf').then(function(pdf) {
  // Using promise to fetch the page
  pdf.getPage(1).then(function(page) {
    var scale = 1.5;
    var viewport = page.getViewport(scale);

    //
    // Prepare canvas using PDF page dimensions
    //
    var canvas = document.getElementById('the-canvas');
    var context = canvas.getContext('2d');
    canvas.height = viewport.height;
    canvas.width = viewport.width;

    //
    // Render PDF page into canvas context
    //
    var renderContext = {
      canvasContext: context,
      viewport: viewport
    };
    page.render(renderContext);
  });
});
Treffynnon
fuente
19
No está bien documentado, pero extrae el archivo zip pdf.js y deja intacta su estructura de directorio. Luego, para ver un pdf, simplemente navegue hasta el archivo viewer.html (a través del navegador) con el archivo adjunto al final. Ex yoursite.com/directory_that_viewer_._html_is_in/viewer.html?file=somepdfthatyouhave.pdf La ubicación del pdf simplemente se pasa como una variable GET al archivo viewer.html.
Craig Lafferty
4
De la wiki de github : "Sin embargo, le preguntamos si planea incrustar el visor en su propio sitio, que no sea solo una versión sin modificar. Por favor, vuelva a aplicarle la piel o construya sobre ella". - dada su documentación api horriblemente inexistente , este proyecto se asegura de que pases por suficientes obstáculos para mantenerte en forma: \
Philzen