Question

我想显示使用IPFS存储的PDF文件。

我正在使用React PDF包来显示文件。

EXP(SUM(LOG(Value)))

但是，当我运行该页面并获取IPFSlink（正确时）时，我会收到错误消息

无法加载PDF文件。

以及控制台中的此错误

index.js：1446错误：设置伪造工人失败：“无法读取未定义的属性'WorkerMessageHandler'”。在pdf.js：11664

有人尝试这样做吗？

Answer 1

我在文件顶部缺少此信息：

pdfjs.GlobalWorkerOptions.workerSrc = `//cdnjs.cloudflare.com/ajax/libs/pdf.js/${pdfjs.version}/pdf.worker.js`;

Answer 2

它实际上在他们的文档中说here：

Create React App uses Webpack under the hood, so you can follow Webpack instructions.

Standard instructions will also work. In Create React App, you can copy
pdf.worker.js file from pdfjs-dist/build to public directory in order for 
it to be copied to your project's output folder at build time.

Standard (Browserify and others)
If you use Browserify or other bundling tools, you will have to make sure 
on your own that pdf.worker.js file from pdfjs-dist/build is copied to your project's output folder.

If you don't need to debug pdf.worker.js, you can use pdf.worker.min.js file instead, which is roughly half the size. For this to work, however, you will 
need to specify workerSrc manually like so:

这里是重要的部分（请注意，如果您使用此方法，您有责任将文件 pdf.worker.min.js 放置在您的应用程序可以看到它的地方——例如，下面的路径假设 {{1} }} 位于 React 应用程序的根目录 -->

pdf.worker.min.js

如果您想让生活变得非常简单并且只使用可用的云 CDN，您可以这样做 -->:

import { pdfjs } from 'react-pdf';
pdfjs.GlobalWorkerOptions.workerSrc = 'pdf.worker.min.js';

请记住，如果您使用的是 CDN，并且它不是您的 React 应用程序的一部分，您可能需要将其包含在您的内容安全策略 (CSP) 例外列表中（如果您使用 CSP）

从IPFS反应显示pdf

2 个答案: