Pdf.js: Execute a renderização de tela PDF.js em um web-worker

Criado em 29 nov. 2018  ·  4Comentários  ·  Fonte: mozilla/pdf.js

Configuração:

  • Chrome 71
  • Sistema operacional e sua versão: qualquer
  • Versão PDF.js: 2.0.943
  • É uma extensão do navegador: não

Etapas para reproduzir o problema:

  1. Escreva um trabalhador da web como este:
function onmessage () {
  const pdfDocument = await pdfjs.getDocument('/some-hard-coded.pdf')
  const page = await pdfDocument.getPage(1)
  const viewport = pdfPage.getViewport(1)
  const width = 250
  const height = viewport.height * (width / viewport.width)
  const canvas = new OffscreenCanvas(width, height)
  const canvasContext = canvas.getContext('2d', { alpha: false })
  return page.render({ canvasContext, viewport })
})
  1. Chame isso com, por exemplo, w = new Worker('sample-pdf.js');

Qual é o comportamento esperado? (adicionar captura de tela)

PDF seria renderizado para OffscreenCanvas

O que deu errado? (adicionar captura de tela)

ReferenceError: documento não definido
em GenericFontLoader.insertRule (pdf.js: 10154)
em GenericFontLoader.bind (pdf.js: 10205)
em WorkerTransport.(pdf.js: 9177)
em LoopbackPort.MessageHandler._onComObjOnMessage (pdf.js: 12833)
em LoopbackPort.(pdf.js: 8681)
em Array.forEach ()

ou seja, isso está falhando:

styleElement = this.styleElement = document.createElement ('estilo');

O problema é a ausência de um DOM. O problema pode ser de documentação, já que PDF.js tem um exemplo de Node , ou pode haver problemas espreitando nas profundezas. Em qualquer caso, eu queria relatá-lo, caso houvesse algumas orientações óbvias aqui.

1-core

Comentários muito úteis

Como você usa pdf.js dentro de um web-worker?

Eu importei por isso.

// Worker.ts
import { pdfjs } from "react-pdf";
pdfjs.GlobalWorkerOptions.workerSrc = `//cdnjs.cloudflare.com/ajax/libs/pdf.js/${pdfjs.version}/pdf.worker.js`;

pdfjs.getDocument(...) => errors

Mas ao usar getDocument . Retorna um erro

Erro não capturado (na promessa): Falha ao configurar o trabalhador falso: "__webpack_require __ (...). Garantir não é uma função"

Todos 4 comentários

Parece (essencialmente) uma duplicata da edição # 10039; muito provavelmente, uma boa quantidade de refatoração seria necessária para que OffscreenCanvas fosse suportado fora da caixa.

Obrigado. @Snuffleupagus Eu vi esse problema e deveria ter vinculado a ele; os problemas não são idênticos no sentido de que:

  1. OffscreenCanvas pode ser usado no thread principal (ou seja, seu uso não se limita a web workers);
  2. Um web worker não precisa usar OffscreenCanvas (ou seja, um polyfill Canvas diferente de OffscreenCanvas pode funcionar);
  3. Um OffscreenCanvas funcional pode não ser o único problema que o PDF.js tem em Web workers.

Em outras palavras, OffscreenCanvas suporte é outro problema que passa a ser uma alternativa possível para CanvasElement , mas isso sozinho pode não ser suficiente para resolver este problema.

Olhando para https://github.com/mozilla/pdf.js/blob/master/examples/node/pdf2png/pdf2png.js (um exemplo de nó), parece que você pode precisar fazer um canvasFactory , também. O que acontece se você fizer isso?

Como você usa pdf.js dentro de um web-worker?

Eu importei por isso.

// Worker.ts
import { pdfjs } from "react-pdf";
pdfjs.GlobalWorkerOptions.workerSrc = `//cdnjs.cloudflare.com/ajax/libs/pdf.js/${pdfjs.version}/pdf.worker.js`;

pdfjs.getDocument(...) => errors

Mas ao usar getDocument . Retorna um erro

Erro não capturado (na promessa): Falha ao configurar o trabalhador falso: "__webpack_require __ (...). Garantir não é uma função"

Esta página foi útil?
0 / 5 - 0 avaliações