Section:

Sign a PDF document using JavaScript

To sign an existing approval signature field in a PDF Document:

1WebViewer({
2  fullAPI: true,
3  // ...Other config options
4}).then(instance => {
5  const { PDFNet, documentViewer } = instance.Core;
6
7  documentViewer.addEventListener('documentLoaded', () => {
8    await PDFNet.initialize();
9    const doc = await documentViewer.getDocument().getPDFDoc();
10
11    // Run PDFNet methods with memory management
12    await PDFNet.runWithCleanup(async () => {
13
14      // lock the document before a write operation
15      // runWithCleanup will auto unlock when complete
16      doc.lock();
17
18      // Add an StdSignatureHandler instance to PDFDoc, making sure to keep track of it using the ID returned.
19      const sigHandlerId = await doc.addStdSignatureHandlerFromURL(cert_file_path, 'password');
20
21      // Retrieve the unsigned approval signature field.
22      /**
23       * Note: Replace approvalFieldName with the field name in the document
24       * that is being signed and approved
25       */
26      const foundApprovalField = await doc.getField(approvalFieldName);
27      const approvalSigField = await PDFNet.DigitalSignatureField.createFromField(foundApprovalField);
28
29      // (OPTIONAL) Add more information to the signature dictionary.
30      await approvalSigField.setLocation("Vancouver, BC");
31      await approvalSigField.setReason("Document approval.");
32      await approvalSigField.setContactInfo("www.apryse.com");
33
34      // (OPTIONAL) Add an appearance to the signature field.
35      const img = await PDFNet.Image.createFromURL(doc, appearance_img_path);
36      const approvalSignatureWidget = await PDFNet.SignatureWidget.createWithDigitalSignatureField(doc, await PDFNet.Rect.init(0, 100, 200, 150), approvalSigField);
37      await approvalSignatureWidget.createSignatureAppearance(img);
38      const page1 = await doc.getPage(1);
39      page1.annotPushBack(approvalSignatureWidget);
40
41      // Prepare the signature and signature handler for signing.
42      await approvalSigField.signOnNextSaveWithCustomHandler(sigHandlerId);
43
44      // The actual approval signing will be done during the save operation.
45      const buf = await doc.saveMemoryBuffer(0);
46      const blob = new Blob([buf], { type: 'application/pdf' });
47      saveAs(blob, 'signed_doc.pdf');
48    });
49  })
50})

Related Links

Digitally sign PDF files
Full code sample which demonstrates using the digital signature API to digitally sign and/or certify PDF documents.

About Adding An Approval Signature to a PDF Document

The Apryse SDK enables approval signatures in PDF documents using a Digital Certificate, in accordance with the latest PDF specification. By leveraging public key infrastructure (PKI) technology, with a certificate issued by a trusted certificate authority (CA), a signer can use a certificate-based digital ID to guarantee the authenticity of a signature. Placement of a digital signature using a certificate can also guarantee that a document was not modified since the signature was placed, ensuring the authenticity of the document.

Apryse Docs Image

Image taken from Apryse WebViewer

Above is an example of a document containing a certified signature, guaranteed by a certificate generated by Apryse.com.

Did you find this helpful?

Trial setup questions?

Ask experts on Discord

Need other help?

Contact Support

Pricing or product questions?

Contact Sales