Pdf.js: 在网络工作者中运行 PDF.js 画布渲染

创建于 2018-11-29 · 4评论 · 资料来源: mozilla/pdf.js

配置：

铬 71
操作系统及其版本：任何
PDF.js 版本：2.0.943
是否为浏览器扩展：否

重现问题的步骤：

像这样写一个网络工作者：

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 })
})

用例如w = new Worker('sample-pdf.js');调用它

什么是预期行为？（添加截图）

PDF 将呈现为OffscreenCanvas

什么地方出了错？（添加截图）

参考错误：文档未定义
在 GenericFontLoader.insertRule (pdf.js:10154)
在 GenericFontLoader.bind (pdf.js:10205)
在 WorkerTransport。(pdf.js:9177)
在 LoopbackPort.MessageHandler._onComObjOnMessage (pdf.js:12833)
在环回端口。(pdf.js:8681)
在 Array.forEach ()

即这是失败的：

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

问题是没有 DOM。问题可能是文档之一，因为PDF.js 有一个 Node 示例，或者可能存在潜伏在深处的问题。无论如何，我想报告它，以防这里有一些明显的指导方针。

1-core

资料来源

brianmhunt

👍8

最有用的评论

您如何在网络工作者中使用 pdf.js？

我是通过这个导入的。

// 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

但是当使用getDocument 。它返回一个错误

未捕获（承诺）错误：设置假工人失败：“__webpack_require__(...).ensure is not a function”

tandat2209 于 2020-04-24

👍3

所有4条评论

看起来（基本上）像问题 #10039 的副本；最有可能的情况是，需要进行大量的重构才能让OffscreenCanvas能够开箱即用。

Snuffleupagus 于 2018-11-29

谢谢。 @Snuffleupagus我看到了这个问题，应该把它链接起来；在以下意义上，问题并不相同：

OffscreenCanvas可以在主线程中使用（即它的使用不限于web worker）；
网络工作者不需要使用 OffscreenCanvas（即 OffscreenCanvas 以外的 Canvas polyfill 可能工作）；
可用的 OffscreenCanvas 可能不是 PDF.js 在网络工作者中的唯一问题。

换句话说， OffscreenCanvas支持是另一个问题，它恰好可以替代CanvasElement ，但仅此一项可能不足以解决此问题。

brianmhunt 于 2018-11-29

查看https://github.com/mozilla/pdf.js/blob/master/examples/node/pdf2png/pdf2png.js （节点示例），看起来您可能需要制作一个canvasFactory ，也。如果你这样做会发生什么？

jsoo1 于 2019-05-08