pdfjs预览pdf

PDF.js 是一个由 Mozilla 开发的开源 JavaScript 库，用于在 Web 上预览 PDF 文档。你可以使用以下步骤来预览 PDF 文档：

1. 首先，下载并引入 PDF.js 库。你可以在官方网站（https://mozilla.github.io/pdf.js/）上找到最新版本的库文件，并将其添加到你的项目中。

2. 在 HTML 页面中创建一个容器元素，用于显示 PDF 文档的预览。例如，你可以使用一个 `<div>` 元素，并为其指定一个唯一的 ID。

3. 使用 JavaScript 代码初始化 PDF.js 并加载 PDF 文档。以下是一个简单示例：

// 获取容器元素
const container = document.getElementById('pdf-container');

// 初始化 PDF.js
pdfjsLib.getDocument('path/to/your/pdf.pdf').promise
  .then(pdf => {
    // 加载第一页
    return pdf.getPage(1);
  })
  .then(page => {
    // 创建一个用于显示页面内容的 canvas 元素
    const canvas = document.createElement('canvas');
    
    // 设置 canvas 尺寸与页面尺寸匹配
    const viewport = page.getViewport({ scale: 1 });
    canvas.width = viewport.width;
    canvas.height = viewport.height;
    
    // 将 canvas 添加到容器中
    container.appendChild(canvas);
    
    // 渲染页面内容到 canvas 上
    const renderContext = {
      canvasContext: canvas.getContext('2d'),
      viewport: viewport
    };
    return page.render(renderContext);
  })
  .catch(error => {
    console.error('Failed to load PDF:', error);
  });

在上述代码中，你需要将 `path/to/your/pdf.pdf` 替换为你要预览的实际 PDF 文件的路径。

这样，当你在浏览器中运行该代码时，就可以在指定的容器中看到 PDF 文档的预览了。