Some test text!

Search
Hamburger Icon

Web / Guides / Sign a document

Sign a PDF document using JavaScript

Make sure you have Full API enabled in WebViewer.

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

WebViewer({
  fullAPI: true,
  // ...Other config options
}).then(instance => {
  const { PDFNet, documentViewer } = instance.Core;

  documentViewer.addEventListener('documentLoaded', () => {
    await PDFNet.initialize();
    const doc = await documentViewer.getDocument().getPDFDoc();

    // Run PDFNet methods with memory management
    await PDFNet.runWithCleanup(async () => {

      // lock the document before a write operation
      // runWithCleanup will auto unlock when complete
      doc.lock();

      // Add an StdSignatureHandler instance to PDFDoc, making sure to keep track of it using the ID returned.
      const sigHandlerId = await doc.addStdSignatureHandlerFromURL(cert_file_path, 'password');

      // Retrieve the unsigned approval signature field.
      /**
       * Note: Replace approvalFieldName with the field name in the document
       * that is being signed and approved
       */
      const foundApprovalField = await doc.getField(approvalFieldName);
      const approvalSigField = await PDFNet.DigitalSignatureField.createFromField(foundApprovalField);

      // (OPTIONAL) Add more information to the signature dictionary.
      await approvalSigField.setLocation("Vancouver, BC");
      await approvalSigField.setReason("Document approval.");
      await approvalSigField.setContactInfo("www.apryse.com");

      // (OPTIONAL) Add an appearance to the signature field.
      const img = await PDFNet.Image.createFromURL(doc, appearance_img_path);
      const approvalSignatureWidget = await PDFNet.SignatureWidget.createWithDigitalSignatureField(doc, await PDFNet.Rect.init(0, 100, 200, 150), approvalSigField);
      await approvalSignatureWidget.createSignatureAppearance(img);
      const page1 = await doc.getPage(1);
      page1.annotPushBack(approvalSignatureWidget);

      // Prepare the signature and signature handler for signing.
      await approvalSigField.signOnNextSaveWithCustomHandler(sigHandlerId);

      // The actual approval signing will be done during the save operation.
      const buf = await doc.saveMemoryBuffer(0);
      const blob = new Blob([buf], { type: 'application/pdf' });
      saveAs(blob, 'signed_doc.pdf');
    });
  })
})

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.

Image taken from Apryse WebViewer

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

Trial setup questions? Ask experts on Discord
Need other help? Contact Support
Pricing or product questions? Contact Sales