如何使用 cdn 导入 pdf.js答案

【问题标题】：How to import pdf.js using cdn如何使用 cdn 导入 pdf.js
【发布时间】：2021-07-02 13:51:08
【问题描述】：

我想在我的一个项目中使用 pdf.js，但是我遇到了导入它的问题，基本上，CDN 不起作用

这是我的代码

    <!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="https://cdn.jsdelivr.net/npm/pdfjs-dist@2.7.570/build/pdf.min.js"></script>
</head>
<body>
<canvas id="my-canvas"></canvas>
<script>
    pdfjsLib.getDocument('./ahmed.pdf').then(doc => {
        console.log("this file has" + doc._pdfInfo.numPages);
    });
</script>
</body>
</html>

这就是我的控制台显示的错误

不推荐使用的 API：未指定“GlobalWorkerOptions.workerSrc”。

未捕获的类型错误：pdfjsLib.getDocument(...).then 不是函数

那么我应该怎么做才能解决这个问题，非常感谢你

【问题讨论】：

标签： javascript cdn pdf.js

【解决方案1】：

您必须将GlobalWorkerOptions.workerSrc 设置为相同版本的/build/pdf.worker(.min).js：

pdfjsLib.GlobalWorkerOptions.workerSrc =
  "https://cdn.jsdelivr.net/npm/pdfjs-dist@2.7.570/build/pdf.worker.min.js"; ? 

pdfjsLib.getDocument('./ahmed.pdf').promise.then(doc => {
  console.log(`This document has ${doc._pdfInfo.numPages} pages.");
});

而且，正如@Pasi 所提到的，您必须通过链接.promise 来承诺.getDocument()。没有它，就没有.then()。

【讨论】：

【解决方案2】：

请参阅此页面上的“带有文档加载错误处理的 Hello World”示例以开始使用：https://mozilla.github.io/pdf.js/examples/

（在getDocument() 并设置workerSrc 属性之后，您的sn-p 缺少.promise）

【讨论】：