pdfjs-dist 预览pdf文件流

你可以使用 `pdfjs-dist` 库来预览 PDF 文件流。首先，确保你已经安装了该库的依赖项。然后，按照以下步骤进行操作：

1. 导入 `pdfjs-dist` 库：

import * as pdfjsLib from 'pdfjs-dist';

2. 创建一个用于渲染 PDF 的容器元素：

<div id="pdf-container"></div>

3. 获取 PDF 文件的字节数组（文件流），并将其转换为 `Uint8Array` 类型：

const pdfData = /* 从服务器或其他地方获取的文件流 */;
const pdfDataArray = new Uint8Array(pdfData);

4. 加载 PDF 文件：

const loadingTask = pdfjsLib.getDocument({ data: pdfDataArray });
loadingTask.promise.then((pdf) => {
  // PDF 加载完成后的处理逻辑
}).catch((error) => {
  // 处理加载失败的情况
});

5. 在加载完成后，你可以选择渲染 PDF 的特定页码或全部页码。以下示例渲染了第一页：

pdf.getPage(1).then((page) => {
  const scale = 1.5;
  const viewport = page.getViewport({ scale });

  const canvas = document.createElement('canvas');
  const context = canvas.getContext('2d');
  canvas.height = viewport.height;
  canvas.width = viewport.width;

  const renderContext = {
    canvasContext: context,
    viewport,
  };

  page.render(renderContext).promise.then(() => {
    document.getElementById('pdf-container').appendChild(canvas);
  });
});

这样，你就可以将 PDF 文件流预览在指定的容器元素中了。请注意，这只是一个简单的示例，你可以根据需要进行自定义和扩展。