另一个有趣的项目是texlive.js。

它允许您在浏览器中编译(La)TeX到PDF。

即使可以用JavaScript在内存中生成PDF，仍然会遇到如何将数据传输给用户的问题。JavaScript很难直接向用户推送文件。

为了将文件传递给用户，您需要执行一个服务器提交，以便让浏览器弹出保存对话框。

话虽如此，生成pdf文件真的不是太难。阅读说明书就可以了。

对于react爱好者来说，还有另一个很棒的PDF生成资源:react -PDF

它非常适合在React中创建PDF文件，甚至可以让用户从客户端本身下载，而不需要服务器!

这是一个React-PDF的小示例片段，用于创建2节PDF文件

import React from 'react';
import { Page, Text, View, Document, StyleSheet } from '@react-pdf/renderer';

// Create styles
const styles = StyleSheet.create({
  page: {
    flexDirection: 'row',
    backgroundColor: '#E4E4E4'
  },
  section: {
    margin: 10,
    padding: 10,
    flexGrow: 1
  }
});

// Create Document Component
const MyDocument = () => (
  <Document>
    <Page size="A4" style={styles.page}>
      <View style={styles.section}>
        <Text>Section #1</Text>
      </View>
      <View style={styles.section}>
        <Text>Section #2</Text>
      </View>
    </Page>
  </Document>
);

这将生成一个只有一页的PDF文档。里面有两个不同的块，每个块都呈现不同的文本。这些并不是唯一可以使用的有效原语。您可以参考组件或示例部分了解更多信息。

我刚刚写了一个叫做jsPDF的库，它只使用Javascript生成pdf。它还很年轻，我很快就会添加新功能并修复bug。还得到了一些在不支持数据uri的浏览器中解决问题的想法。它是麻省理工学院许可的。

在我开始写这个问题之前，我遇到了这个问题，我想我应该回来让你知道:)

用Javascript生成pdf文件

创建一个“Hello World”PDF文件。

//默认导出为a4纸，纵向，以毫米为单位 var doc = new jsPDF() 医生。文本(“Hello world !”'， 10,10) doc.save(“a4.pdf”) < script src = " https://cdnjs.cloudflare.com/ajax/libs/jspdf/1.3.5/jspdf.debug.js " > < /脚本>

另一个值得一提的javascript库是pdfmake。

pdfmake操场 github上的Pdfmake

浏览器的支持似乎没有jsPDF强大，也没有形状选项，但是格式化文本的选项比目前jsPDF中可用的选项更高级。

值得一提的是PDF-LIB，这是一个很棒的库:

Supports pure JavaScript. Can edit existing PDF templates even with pure JavaScript. (Most impotently. Many JavaScript libraries can't do it) It is generating a PDF with select-able/copy-able/highlight-able text not an image file inside an PDF like many other libraries generate. More easy to use. (I love it) If you are interested in using it with pure JavaScript this may help. If you are interested to do the same with the most popular JavaScript library as of now JSPDF this may help. (Simply JSPdf can't do most time saving thing we want, editing an existing template.)

看看代码有多漂亮

<script type="text/javascript"> async function downloadPdf() { const url = './print-templates/pquot-template.pdf'; const existingPdfBytes = await fetch(url).then(res => res.arrayBuffer()); // Getting the document const pdfDoc = await PDFLib.PDFDocument.load(existingPdfBytes); // Getting the first page const pages = pdfDoc.getPages(); const firstPage = pages[0]; // Customer name firstPage.drawText('Customer name is here with more text (GAR004) quick brown customerm jumps over lazy dog.', { x: 10.5*9, y: 76.6*9, size: 10, maxWidth: 28*9, // Wrap text with one line. WOW :O lineHeight: 1.5*9 }); // Currency short code firstPage.drawText('LKR', { x: 10.5*9, y: 73.5*9, size: 10 }); var itemName = 'Here is the item name with some really really long text and quick brown fox jumps over lazy dog. long text and quick brown fox jumps over lazy dog:)'; // Item name firstPage.drawText(itemName, { x: 5*9, y: 67*9, size: 10, maxWidth: 31*9, lineHeight: 2*9 }); const pdfDataUri = await pdfDoc.saveAsBase64({ dataUri: true }); document.getElementById('pdf').src = pdfDataUri; } </script>