纯js实现前端导出pdf，不使用第三方库

纯 JavaScript 实现前端导出 PDF，不使用第三方库，可以使用浏览器内置的 API，包括 Canvas、Blob 和 FileReader。

以下是一个简单的示例代码，可以将指定的 HTML 元素导出为 PDF 文件：

const exportPdf = () => {
  const element = document.getElementById('my-element'); // 要导出为 PDF 的 HTML 元素
  const width = element.offsetWidth;
  const height = element.offsetHeight;
  const pdfWidth = width * 1.5;
  const pdfHeight = height * 1.5;
  const canvas = document.createElement('canvas');
  canvas.width = pdfWidth;
  canvas.height = pdfHeight;
  const context = canvas.getContext('2d');
  context.scale(1.5, 1.5);
  const options = {
    scale: 1.5,
    canvas: canvas,
    logging: true,
    width: width,
    height: height,
    useCORS: true,
  };
  html2canvas(element, options).then(canvas => {
    const imgData = canvas.toDataURL('image/png'); // 将 canvas 元素转换为 base64 编码的 PNG 图像
    const doc = new jsPDF('p', 'mm', 'a4'); // 创建一个 A4 大小的 PDF 对象
    doc.addImage(imgData, 'PNG', 0, 0, pdfWidth, pdfHeight); // 将 PNG 图像添加到 PDF 中
    doc.save('my-pdf.pdf'); // 下载 PDF 文件
  });
};

该示例代码使用了 html2canvas 库来将 HTML 元素转换为 canvas 元素，并将 canvas 元素转换为 PNG 图像。然后，使用 jsPDF 库将 PNG 图像添加到 PDF 中，并下载 PDF 文件。需要注意的是，由于涉及到跨域资源的转换，需要设置 `useCORS: true` 来启用跨域资源共享。