未捕获TypeError: pdfjsLib.getDocument(...).then不是函数

这个错误信息表明在调用 pdfjsLib.getDocument(...) 方法后，期望得到一个 Promise 对象，但实际上并没有得到。这通常是由于 pdfjsLib.getDocument 方法没有正确返回一个 Promise，或者该方法没有被正确地引入和使用。

基础概念

Promise 是 JavaScript 中用于处理异步操作的对象，它代表了一个尚未完成但预计将来会完成的操作。.then() 方法用于指定当 Promise 状态变为 resolved 时的回调函数。

可能的原因

库未正确引入：可能 pdfjsLib 没有被正确引入到项目中。
版本不兼容：使用的 pdfjsLib 版本可能不支持 .then() 方法。
方法调用错误：可能在调用 getDocument 方法时传递了错误的参数。

解决方案

步骤 1: 确保库正确引入

确保你已经正确地通过 <script> 标签或者 npm 安装并引入了 pdfjs-dist 库。

<!-- 如果是通过 CDN 引入 -->
<script src="https://mozilla.github.io/pdf.js/build/pdf.js"></script>

或者

# 如果是通过 npm 安装
npm install pdfjs-dist

然后在你的 JavaScript 文件中：

import * as pdfjsLib from 'pdfjs-dist';

步骤 2: 检查版本兼容性

确保你使用的 pdfjs-dist 版本是最新的，或者至少是支持 Promise 的版本。

步骤 3: 正确调用方法

确保你在调用 getDocument 方法时传递了正确的参数，并且该方法确实返回了一个 Promise。

pdfjsLib.getDocument('path/to/your/document.pdf').then(function(pdfDoc_) {
  // 使用 pdfDoc_
}, function(error) {
  console.error('Error loading PDF', error);
});

示例代码

以下是一个完整的示例，展示了如何正确引入和使用 pdfjs-dist 来加载一个 PDF 文档：

<!DOCTYPE html>
<html>
<head>
  <title>PDF.js Example</title>
  <script src="https://mozilla.github.io/pdf.js/build/pdf.js"></script>
</head>
<body>
  <script>
    // 设置 workerSrc 属性，以便 pdf.js 可以找到其 Web Worker 文件
    pdfjsLib.GlobalWorkerOptions.workerSrc = 'https://mozilla.github.io/pdf.js/build/pdf.worker.js';

    // 加载 PDF 文档
    pdfjsLib.getDocument('path/to/your/document.pdf').then(function(pdfDoc_) {
      console.log('PDF loaded');
      // 获取第一页
      pdfDoc_.getPage(1).then(function(page) {
        console.log('Page loaded');
        // ... 进一步处理页面
      });
    }, function(error) {
      console.error('Error loading PDF', error);
    });
  </script>
</body>
</html>