Downloading pdf from webviewer with digital signature


Product Version: 10.2.3

Please give a brief summary of your issue:
I’m trying to add a digital signature to a pdf and save it with all its annotations and the digital signature. I can sign it do all the annotations I want and then add the digital signature at the end when I want to save it, but the downloaded file doesn’t contain signatures or it has some weird distortion. It will have all the other annotations display correctly but signatures just don’t show up as expected.

Please describe your issue and provide steps to reproduce it:
Code that I’m using to digital sign and download

async function saveDocumentCertified() {
  const { PDFNet, documentViewer, annotationManager } = INSTANCE.Core;
  await PDFNet.initialize();
  const xfdfString = await annotationManager.exportAnnotations({widgets: false, fields: true, links: false});
  await PDFNet.runWithCleanup(async () => {
    const doc = await documentViewer.getDocument().getPDFDoc();
    const fdfDoc = await PDFNet.FDFDoc.createFromXFDF(xfdfString);
    await doc.fdfMerge(fdfDoc);
    await doc.flattenAnnotations(false);

    await doc.initSecurityHandler();
    await doc.lock();

    const page1 = await doc.getPage(1);
    const certification_sig_field = await doc.createDigitalSignatureField("CertSig");
    const widgetAnnot = await PDFNet.SignatureWidget.createWithDigitalSignatureField(doc, new PDFNet.Rect(0, 100, 200, 150), certification_sig_field);
    await page1.annotPushBack(widgetAnnot);

    await certification_sig_field.setDocumentPermissions(PDFNet.DigitalSignatureField.DocumentPermissions.e_no_changes_allowed);
    await certification_sig_field.certifyOnNextSaveFromURL('PATH_TO_PFX', 'PASSWORD');
    await certification_sig_field.setLocation('SOMEWHERE');
    await certification_sig_field.setReason('Document certified.');
    await certification_sig_field.setContactInfo('somewhere contact info');

    // Set permissions
    const securityHandler = await PDFNet.SecurityHandler.createDefault();
    await securityHandler.setPermission(PDFNet.SecurityHandler.Permission.e_doc_modify, false);
    await securityHandler.setPermission(PDFNet.SecurityHandler.Permission.e_assemble_doc, false);
    await doc.setSecurityHandler(securityHandler);

    const docBuffer = await doc.saveMemoryBuffer(PDFNet.SDFDoc.SaveOptions.e_compatibility);
    const docBlob = new Blob([docBuffer], {
      type: 'application/pdf',
    // file-saver package
    saveAs(docBlob, 'output.pdf');

How it looks in the web viewer

How it looks after downloading

1 Like

Thank you for the posting the incident to our forum. We will provide you with an update as soon as possible.

1 Like

Hi there,

Thanks for reaching out the WebViewer forums,

Using the provided code, this was the document after calling your function, with a minor change:

      // saveAs(docBlob, 'output.pdf');

At this point, we only have a signature widget, and this would not be present in the document when downloaded.
If I sign on the field there, there would be a signature annotation that would be added, i.e.:

and downloading this document will have the signature correctly present in the document:
On chrome:

Here is our sample digital signature test guide for reference:

If you are still experiencing issues, could you please share a minimal runnable sample project?

Best regards,
Kevin Kim

1 Like