前端pdf.js将pdf转为图片，尤其适合电子发票打印

要使用pdf.js将PDF转换为图片，你可以使用pdf.js的rendering功能来渲染PDF页面为canvas，然后将canvas转换为图片。以下是一个简化的代码示例：

// 引入PDF.js库
import pdfjsLib from 'pdfjs-dist/webpack';
 
// 渲染PDF页面为图片的函数
async function renderPDFPageAsImage(pdfUrl, pageNumber, scale = 1.5) {
  // 加载PDF文档
  const loadingTask = pdfjsLib.getDocument(pdfUrl);
  const pdf = await loadingTask.promise;
  const page = await pdf.getPage(pageNumber);
 
  // 获取视口尺寸
  const viewport = page.getViewport({ scale: scale });
 
  // 创建canvas元素
  const canvas = document.createElement('canvas');
  const context = canvas.getContext('2d');
  
  canvas.height = viewport.height;
  canvas.width = viewport.width;
  
  // 渲染页面
  const renderContext = {
    canvasContext: context,
    viewport: viewport
  };
  
  await page.render(renderContext).promise;
  
  // 转换canvas为图片
  return canvas.toDataURL('image/png');
}
 
// 使用示例
const pdfUrl = 'path/to/your/document.pdf';
const pageNumber = 1;
 
renderPDFPageAsImage(pdfUrl, pageNumber).then(imageData => {
  // 使用imageData，例如将其设置为img元素的src
  const img = document.createElement('img');
  img.src = imageData;
  document.body.appendChild(img);
});

确保在你的项目中已经安装了pdfjs-dist包，并且正确地引入了pdfjsLib。

这段代码首先加载PDF文档，然后获取指定页面的视口尺寸，并创建一个对应大小的canvas。接着，它使用page.render方法将PDF页面渲染到canvas上。最后，使用canvas.toDataURL方法将canvas转换成图片格式的字符串（例如PNG格式的base64编码数据）。

请注意，这个示例代码是简化版的，并且没有包含错误处理和其他额外的配置选项。在实际应用中，你可能需要添加对不同PDF尺寸和分辨率的支持，以及处理可能出现的网络请求错误和安全限制等问题。