Add Signature field to pdf in javascript

Question

after hours of searching for a solution, I've decided to ask my first question on stackoverflow.

Our application uses pdf-lib ( https://www.npmjs.com/package/pdf-lib ) to modify existing PDFs, eg add images. We're now looking for a way to ad signature form fields to the PDF as well. With pdf-lib, it is possible to add a bunch of form fields, except for signature fields. It is possible to get them ( https://pdf-lib.js.org/docs/api/classes/pdfform#getsignature ), but unlike other fields, there's no create method (eghttps://pdf-lib.js.org/docs/api/classes/pdfform#createtextfield ).

I've digged deeper in the code, and found access to the PDFForms AcroForm ( https://pdf-lib.js.org/docs/api/classes/pdfform#acroform ). It's possible to add fields with it, but I wasn't able to create the correct Field beforehand (in my opinion it has to be PDFSignature or PDFAcroSignature).

I found out that other fields like PDFAcroText have create methods

  class PDFAcroText extends PDFAcroTerminal {
  static fromDict = (dict: PDFDict, ref: PDFRef) => new PDFAcroText(dict, ref);

  static create = (context: PDFContext) => {
    const dict = context.obj({
      FT: 'Tx',
      Kids: [],
    });
    const ref = context.register(dict);
    return new PDFAcroText(dict, ref);
  };

Those get called by the wrapper functions (like createTextfield as mentioned):

createTextField(name: string): PDFTextField {
    assertIs(name, 'name', ['string']);
    const nameParts = splitFieldName(name);

    const parent = this.findOrCreateNonTerminals(nameParts.nonTerminal);

    const text = PDFAcroText.create(this.doc.context);
    text.setPartialName(nameParts.terminal);

    addFieldToParent(parent, [text, text.ref], nameParts.terminal);

    return PDFTextField.of(text, text.ref, this.doc);
  }

I looked for other js libs that provide the possibility to add signature form fields, but I wasn't able to find the answer to this - except for pay to use libs like pdfjs.express.

Assuming that they are capable of adding such fields, there must be a way to do this!

Please let me know if anyone of you figured out how to do this or if there's another solution for this.

Thank you in advance!

Greetings Alex

Answer 1

The Acrobat PRO itself doesn't have an option to put a straight "Signature" field. You may "request" a signature, but only using Adobe's services, and an email is required.

If you plan to add a signature by the code, take a look at their "Fill Form" example. They put an image on top of a Button field, but an Image field also works.

  const signatureImageField2 = form.getButton('button-signature-field')
  signatureImageField2.setImage(signatureImage)

  const factionImageField = form.getField('image-signature-field_af_image')
  factionImageField.setImage(signatureImage)