如何使用 pdf-lib 使用自定义字体使用 javascript 填写 pdf 表单？

Question

I have a custom pdf with form inside it and I wanna fill it with values.

It wasn't that hard to use some font, but I can't figure out how to set fontSize for field, because is does matter in some of the fields.

Here's my code atm:

export async function stampPdfLib(payload: {
  templatePath: string,
  data: { [key: string]: string },
  version: string,
}): Promise<Uint8Array> {
  const formPdfBytes = await fetch(payload.templatePath).then(res => res.arrayBuffer());
  const pdfDoc = await PDFDocument.load(formPdfBytes);
  const timesRomanFont = await pdfDoc.embedFont(StandardFonts.TimesRoman);

  const form = pdfDoc.getForm();
  form.updateFieldAppearances(timesRomanFont); // I could set font, but ...

  form.getTextField('field_name').setText('a'); // I couln't set fontSize

  const savedBytes = await pdfDoc.save();
  return savedBytes;
}

Answer 1

Every form field type ( PDFCheckBox , PDFTextField ,...) of PDFForm has readonly property acroField of appropriate type ( PDFAcroCheckBox , PDFAcroText ,...). In those types might be hidden exactly what you are after. In the node_modules/pdf-lib/src you can find form field types under /api/form , and for acroField types you can navigate to /core/acroform . However in this case you have method exposed directly for textField - textField.setFontSize(number) ( v1.16.0 of pdf-lib ).

Without any settings - default behavior :

form.getTextField('field_name').setFontSize(11) or form.getTextField('field_name').acroField.setFontSize(11);

form.getTextField('field_name').setFontSize(20) or form.getTextField('field_name').acroField.setFontSize(20);

Of course, you have to take care of your input field size (in case you font size is too large).