Skip to content

PDF 生成模板编辑器

开源可视化 PDF 生成引擎,支持自定义模板,并提供面向开发者的 API,灵活构建文档生成流程。

查看 GitHub

创建数字签名 ​

创建数字签名分为两个步骤:

  1. 创建签名域

  2. 在签名域填写签名

通过这两个步骤,您可以自签文件,或邀请其他人在您创建的签名域进行签名。

创建签名域 ​

ComPDFKit 支持自定义签名域表单样式,以及通过文字,图片,手绘来自定义签名外观。

以下是创建签名域的示例代码:

javascript
const signatureField = new Annotations.Forms.Field('Signature1', { type: 'Sig' });
const signatureWidget = new Annotations.SignatureWidgetAnnotation(signatureField, {
  PageNumber: 1,
  X: 102,
  Y: 136,
  Width: 59,
  Height: 20
});
annotationManager.getFieldManager().addField(signatureField);
annotationManager.addAnnotation(signatureWidget);

持续创建签名域 ​

如果需要让用户连续绘制多个签名域,而不必在每次创建后重新激活工具,可以在激活签名域工具(Tools.ToolNames.SIG_FORM_FIELD)时传入 continueAdding:

javascript
instance.UI.setToolMode(Tools.ToolNames.SIG_FORM_FIELD, {
  continueAdding: true
});

该选项默认值为 false,因此现有调用仍保持一次创建行为。目前该选项只适用于签名域,不支持持续创建其他表单域。

在签名域中填写签名 ​

在签名域中填写签名的步骤如下:

  1. 持有一个 PKCS12 标准的证书(PFX或P12格式),并确保知道它的密码,您可以通过 ComPDFKit SDK 内置的方法创建符合标准的数字证书。

  2. 通过 ComPDFKit 的接口设定数字签名的外观。

  3. 将数据写入签名域并保存。

在签名域中填写签名的示例代码:

javascript
// 读取证书信息,获取签名者的名字。
const { subject } = await annotationManager.getCertificateInfo(pkcs12.buffer, password)

const content = "Name: " + subject.CN + "\n" +
  "Date: " + date + "\n" +
  "Reason: "+ 'I am the owner of the document.' +" \n" +
  "Location: "+ location + "\n"

// 将数据写入签名域。外观显示内容各行,左侧显示 text。
// 若要签选中的签名域,第一个参数传 undefined。
await annotationManager.sign(annotation, {
  certificate: pkcs12.buffer,
  password: password,
  appearance: {
    content,
    text: 'Text',
    isContentAlignLeft: false
  }
})