如何在Angular CLI应用程序中提供pdf.js worker
我在angular应用程序中直接使用pdf.js实现了一些pdf目的。它工作得很好。
我从pdfjs-dist导入了pdfjs，并且我的package.json包含pdfjs-dist。
我的pdf运行良好，但在控制台中，我得到以下错误。
pdf.js:9067 GET http://localhost:4300/main.bundle.worker.js 404 (Not Found)
pdf.js:351 Warning: Setting up fake worker.如何在angular CLI应用程序中正确设置worker？
回答 4
Stack Overflow用户
发布于 2018-06-09 08:23:22
经过几天的努力，我解决了这个问题。我第一次使用StackBlitz online Angular6服务获胜。但在家里复习有问题。
在我的例子中，可以将Angular 6和CLI与本地文件一起使用。PS:当你使用本地安装和带有外部链接的worker时，请注意类似版本的pdf.js和pdf.worker.js (我使用pdf.worker.min.js)，如CDN等。
从CDN https://www.jsdelivr.com/package/npm/pdfjs-dist?path=build获取我需要的版本
将您的pdf.worker.js或pdf.worker.min.js放到/src/assets/，然后使用：
import * as pdfjsLib from 'pdfjs-dist/build/pdf
pdfjsLib.GlobalWorkerOptions.workerSrc = './assets/pdf.worker.min.js';说明:使用命令'ng version‘获取
Angular CLI: 6.0.3
Node: 8.10.0
OS: linux x64
Angular: 6.0.2
Package Version
-----------------------------------------------------------
@angular-devkit/architect 0.6.3
@angular-devkit/build-angular 0.6.3
@angular-devkit/build-optimizer 0.6.3
@angular-devkit/core 0.6.3
@angular-devkit/schematics 0.6.3
@angular/cli 6.0.3
@ngtools/webpack 6.0.3
@schematics/angular 0.6.3
@schematics/update 0.6.3
rxjs 6.1.0
typescript 2.7.2
webpack 4.8.3Stack Overflow用户
发布于 2020-04-12 11:48:00
我通过将pdf.worker.js文件包含在捆绑包中解决了这个问题，方法与存储资产的方式大致相同。
"assets": [
"src/favicon.ico",
"src/assets",
{
"glob": "pdf.worker.*",
"input": "node_modules/pdfjs-dist/build/",
"output": ""
}
],然后你需要
import * as pdf from 'pdfjs-dist';
// ... //
pdf.GlobalWorkerOptions.workerSrc = 'pdf.worker.js';
const loadingTask = pdf.getDocument({ data: this.pdfData });Stack Overflow用户
发布于 2018-05-02 22:48:06
这是因为您没有设置GlobalWorkerOptions.workerSrc属性。通常将其设置为可从中加载pdf.worker.js或pdf.worker.min.js文件的URL。如果您安装了pdfjs-dist包，则它与pdf.js位于同一文件夹中。
尝试一下，一旦设置了属性，警告就会消失。
PDFJS.GlobalWorkerOptions.workerSrc =
"<your local path>./node_modules/pdfjs-dist/build/pdf.worker.js";在生产中，您应该从CDN URL加载它。
https://stackoverflow.com/questions/49822219
复制相似问题
腾讯云开发者
