pdf-lib：如何添加自定义字体

Question

我的环境是node v12.16.1，添加了typescript。

\n

我正在使用pdf-lib v1.16.0（https://www.npmjs.com/package/pdf-lib）来填写给定 PDF 文件的表格。库源代码可以在这里找到https://github.com/Hopding/pdf-lib以及更多关于文档的信息https://pdf-lib.js.org/。

\n

关于字体有一组在库中提供的pdf-lib调用。StandardFonts

\n

export\xc2\xa0enum\xc2\xa0StandardFonts\xc2\xa0{\n\xc2\xa0 Courier\xc2\xa0=\xc2\xa0\'Courier\',\n\xc2\xa0\xc2\xa0CourierBold\xc2\xa0=\xc2\xa0\'Courier-Bold\',\n\xc2\xa0\xc2\xa0CourierOblique\xc2\xa0=\xc2\xa0\'Courier-Oblique\',\n\xc2\xa0\xc2\xa0CourierBoldOblique\xc2\xa0=\xc2\xa0\'Courier-BoldOblique\',\n\xc2\xa0\xc2\xa0Helvetica\xc2\xa0=\xc2\xa0\'Helvetica\',\n\xc2\xa0\xc2\xa0HelveticaBold\xc2\xa0=\xc2\xa0\'Helvetica-Bold\',\n\xc2\xa0\xc2\xa0HelveticaOblique\xc2\xa0=\xc2\xa0\'Helvetica-Oblique\',\n\xc2\xa0\xc2\xa0HelveticaBoldOblique\xc2\xa0=\xc2\xa0\'Helvetica-BoldOblique\',\n\xc2\xa0\xc2\xa0TimesRoman\xc2\xa0=\xc2\xa0\'Times-Roman\',\n\xc2\xa0\xc2\xa0TimesRomanBold\xc2\xa0=\xc2\xa0\'Times-Bold\',\n\xc2\xa0\xc2\xa0TimesRomanItalic\xc2\xa0=\xc2\xa0\'Times-Italic\',\n\xc2\xa0\xc2\xa0TimesRomanBoldItalic\xc2\xa0=\xc2\xa0\'Times-BoldItalic\',\n\xc2\xa0\xc2\xa0Symbol\xc2\xa0=\xc2\xa0\'Symbol\',\n  ZapfDingbats\xc2\xa0=\xc2\xa0\'ZapfDingbats\',\n}\n

\n

很多时候，您会需要应用列表中未列出的字体。一个例子是，当您需要填写一些用户文档/表格，然后在其上应用电子签名以批准它们时。有时，电子签名可以采用由用户选择的不同字体类型。

\n

那么，我们如何添加我们选择的新字体类型呢？

\n

Answer 1

从规范https://www.npmjs.com/package/pdf-lib#embed-font-and-measure-text

pdf-lib 依赖于一个姐妹模块来支持嵌入自定义字体：@pdf-lib/fontkit。在嵌入自定义字体之前，您必须将 @pdf-lib/fontkit 模块添加到您的项目中并使用 pdfDoc.registerFontkit(...) 注册它。

我们必须npm i --save @pdf-lib/fontkit并且我们必须有我们可以从哪里读取字体的来源。就我而言，我已.otf在项目中添加文件并加载字体。文件的结构如图所示：

import path from 'path';
import fs from 'fs';
import {PDFDocument, PDFForm, StandardFonts, PDFFont} from 'pdf-lib';
import fontkit from '@pdf-lib/fontkit';

const pdfBytes = fs.readFileSync(path.join(__dirname, `/w_template/` + fileName + '.pdf'));
const pdfDoc = await PDFDocument.load(pdfBytes);

pdfDoc.registerFontkit(fontkit);
//load font and embed it to pdf document
const fontBytes = fs.readFileSync(path.join(__dirname, 'HouschkaHead-BoldItalic.otf'));
const customFont = await pdfDoc.embedFont(fontBytes);

const form = pdfDoc.getForm();
const textField = form.getTextField('signature');
textField.setFontSize(11);
textField.setText('stefan z');
textField.updateAppearances(customFont);

// form flatten is available from v1.16.0 and it makes form read-only (not editable)
form.flatten();
const modifiedPdf = await pdfDoc.save();

这是最终结果：检查签名输入表单字段与填充默认字体的其他输入字段有何不同 奖励：如果您想使用表单中输入文本的颜色，这是我在库源代码下进行更多挖掘时发现的（它可能不是最佳的，但它可以为您提供更多事情的起点）：

import {setFillingRgbColor} from 'pdf-lib'

const textField = form.getTextField(fieldName);
const da = textField.acroField.getDefaultAppearance() ?? '';
const newDa = da + '\n' + setFillingRgbColor(1, 0, 0).toString(); 
textField.acroField.setDefaultAppearance(newDa);