PDF.js 使用说明

PDF.js是一个用于在Web浏览器中显示PDF文件的JavaScript库。它是由Mozilla开发的开源项目，可以在任何现代浏览器中使用。

要使用PDF.js，首先需要将其引入到你的HTML文件中。你可以通过以下方式引入：

<script src="path/to/pdf.js"></script>

接下来，你需要在HTML中创建一个用于显示PDF的容器元素，例如一个`<div>`元素：

<div id="pdfContainer"></div>

然后，你可以使用JavaScript代码来加载和显示PDF文件。以下是一个简单的示例：

// 获取PDF容器元素
var container = document.getElementById('pdfContainer');

// 使用PDF.js加载PDF文件
PDFJS.getDocument('path/to/pdfFile.pdf').then(function(pdf) {
  // 获取第一页
  pdf.getPage(1).then(function(page) {
    // 创建一个canvas元素用于显示PDF页面
    var canvas = document.createElement('canvas');
    var context = canvas.getContext('2d');

    // 设置canvas的尺寸与PDF页面尺寸相同
    var viewport = page.getViewport(1);
    canvas.width = viewport.width;
    canvas.height = viewport.height;

    // 将PDF页面渲染到canvas上
    page.render({
      canvasContext: context,
      viewport: viewport
    });

    // 将canvas添加到容器元素中
    container.appendChild(canvas);
  });
});

在上面的示例中，我们首先获取了PDF容器元素，然后使用`PDFJS.getDocument()`方法加载PDF文件。一旦加载完成，我们可以使用`pdf.getPage()`方法获取PDF的第一页。然后，我们创建一个canvas元素，并将PDF页面渲染到canvas上。最后，将canvas添加到容器元素中，这样就可以在浏览器中显示PDF文件了。

请注意，上面的示例只是一个简单的演示，你可以根据自己的需求进行更复杂的操作，例如加载多个页面、添加缩放功能等。