I’m trying to test out the feature to directly sign a document in PDFTron. I have a working certificate file and I tried the sample code for digitally signing a document (PDFTron). Unfortunately it’s not working as it throws this error:
ERROR Error: Uncaught (in promise): Exception:
Message: Field argument to DigitalSignatureField constructor is not valid or not a Signature field
Apparently the createFromField function does not accept the field object which is strange since I used the sample code from the documentation to create said field.
//first create the field
const { annotationManager, Annotations } = this.wvInstance.Core;
const { WidgetFlags } = Annotations;
// set flags for required
const flags = new WidgetFlags({
'Required': true
});
// create a form field
const field = new Annotations.Forms.Field("some signature field name", {
type: 'Sig',
flags,
});
// create a widget annotation
const widgetAnnot = new Annotations.SignatureWidgetAnnotation(field, {
appearance: '_DEFAULT',
appearances: {
_DEFAULT: {
Normal: {
data:
'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAAYdEVYdFNvZnR3YXJlAHBhaW50Lm5ldCA0LjEuMWMqnEsAAAANSURBVBhXY/j//z8DAAj8Av6IXwbgAAAAAElFTkSuQmCC',
offset: {
x: 100,
y: 100,
},
},
},
},
});
// set position and size
widgetAnnot.PageNumber = 1;
widgetAnnot.X = 100;
widgetAnnot.Y = 100;
widgetAnnot.Width = 50;
widgetAnnot.Height = 20;
//add the form field and widget annotation
annotationManager.getFieldManager().addField(field);
annotationManager.addAnnotation(widgetAnnot);
annotationManager.drawAnnotationsFromList([widgetAnnot]);
//now sign the field
const { PDFNet } = this.wvInstance.Core;
await PDFNet.initialize();
const doc = await this.documentViewer.getDocument().getPDFDoc();
await PDFNet.runWithCleanup(async () => {
const sigHandlerId = await doc.addStdSignatureHandlerFromURL(path_to_file, password);
// Retrieve the unsigned approval signature field.
/** * Note: Replace approvalFieldName with the field name in the document * that is being signed and approved */
const fieldManager = this.annotationManager.getFieldManager();
const foundApprovalField = await doc.getField("some signature field name");
const approvalSigField = await PDFNet.DigitalSignatureField.createFromField(foundApprovalField);
// 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' });
console.log(blob);
saveAs(blob, 'signed_doc.pdf');
}, licenseKey);
I basically followed the comprehensive example. I was able to further track down the error source. If I create a digital signature field using the PDFNet.PDFDoc method createDigitalSignatureField() the code sample works.
However, this only helps me to apply a digital signature field to programmatically created fields using PDFNet. But I would like to iterate through user generated fields and apply the signatureHandler to those.
Core.PDFNet.Field is for digital signatures, which has very strict verification rules. Digital Signatures can be considered as the electronic equivalent of a physical signature with ink on paper.
If you would like to use digital signature, follow this example closely. You can find examples of creating Core.PDFNet.Field here.
If you would like to use the signature tool, with signature widget annotation. Check out this guide about signature tool and this guide about signature widget annotation.
Jason Hu
Web Development Support Engineer
PDFTron Systems, Inc. www.pdftron.com
I dug deeper into the full API and found a way to parse through the annotations and create new PDFNet.Fields and style them according to their apperance in the Webviewer. However, is there an “official” and automatic approach to this? This guide implies that the webviewer signature tool is using PDFNet.Fields under the hood.
I don’t think there is an automatic way to handle this. Based on the code base, PDFNet.Fields and Annotations.Forms.Field are two different classes, and they don’t reply on each other at all.
Like I mentioned, it all depends on what you would like to do.
Jason Hu
Web Development Support Engineer
PDFTron Systems, Inc.
thank you for your answer. Knowing that there is no link between PDFNet and Webviewer helped me to develop a solution that translates Webviewer fields into PDFNet fields. The thread can be closed.