Introducción #
websign es una solución de captura de firma digital manuscrita en entornos web.
Los datos biométricos de la firma manuscrita se capturan sobre el propio browser, incluyendo velocidad, aceleración y presión (cuando está disponible)
El documento se protege mediante una firma digital PAdES en servidor.
Caso de uso #
Puede acceder a un caso de uso en el siguiente enlace: websign.firmar.online
En ambos casos basic.html y advanced.html se invoca a la librería. Puede ser un buen punto de partida para la integración.
Si nos fijamos, en ambos casos es necesario tener un div declarado en el archivo html con el id “web-sign” y cargar el script correspondiente ubicado en “/js/web-sign/web-sign.js”.
Es necesario también obtener un documento PDF. En ambos casos de uso, el usuario puede seleccionar uno que tenga descargado por medio de un input.
Una vez tenemos esos pasos realizados, podemos inicializar la librería en una función de la siguiente forma:
Documentación técnica #
El contenido de la carpeta contiene este propio manual de integración y un zip con la librería WebSign y dos ejemplos para realizar la integración dentro.
- index.html: Página inicial de bienvenida y descripción.
- basic.html: Es el caso de uso mínimo reproducible.
- advanced.html: Caso de uso avanzado que permite explorar diversas opciones de configuración.
- Carpeta js: Contiene dentro la librería en cuestión a integrar (web-sign)
Invocación #
En ambos casos basic.html y advanced.html se invoca a la librería. Puede ser un buen punto de partida para la integración.
Si nos fijamos, en ambos casos es necesario tener un div declarado en el archivo html con el id “web-sign” y cargar el script correspondiente ubicado en “/js/web-sign/web-sign.js”.
Es necesario también obtener un documento PDF. En ambos casos de uso, el usuario puede seleccionar uno que tenga descargado por medio de un input.
Parámetros #
En el archivo /js/web-sign/web-sign-config.json se encuentran los diferentes parámetros en formato json.
bearerToken: Token de seguridad para realizar las llamadas a la API.
containerWidth: Ancho que tomará el div del contenedor de la librería. Puede especificarse en cualquier tipo de unidades relativas (px, em, %..)
containerHeight: Alto que tomará el div del contenedor de la librería. Puede especificarse en cualquier tipo de unidades relativas (px, em, %..)
signatureEnvironment: Para apuntar contra el entorno del servidor. Posibles valores:
- “SANDBOX” (pruebas)
- “PRO” (producción)
signatureType: Define el tipo de firma. Posibles valores:
- “stu” para las wacom STU,
- “display” para la firma en la pantalla del navegador
signatureColorHex: Color de la de firma en formato hexadecimal.
autoDownload : Indica si cada vez que se realiza una firma el nuevo documento se descargue automáticamente.
minPointsRequiredToSign: Mínimo de puntos de la firma requeridos para que esta sea válida.
widget: Estructura de datos que define el comportamiento y posición de la caja de firma.
type: Tipo de posicionamiento. Posibles valores:
- “manual” El posicionamiento es manual, se recoge el width y height y el usuario posiciona el widget manualmente en la página que quiera.
- “fixed” Posicionamiento fijo, es necesario pasar page, x, y width, height.
- “float” Posicionamiento flotante por texto, es necesario pasar un texto para que lo ubique en el documento, un width y un height.
x: Desplazamiento del widget en horizontal, desde el vértice inferior izquierdo del PDF.
y: Desplazamiento del widget en vertical, desde el vértice inferior izquierdo del PDF.
width: Ancho del widget
height: Alto del widget
page: Página donde se ubicará el widget
customText: Texto personalizado que se ubica en la parte superior de la firma. Es un array y cada elemento realiza un salto de línea. Tiene un text y un fontSize
gapX: Desplazamiento del widget en el eje horizontal para el tipo de firma float.
gapY: Desplazamiento del widget en el eje vertical para el tipo de firma float.
properties: Estructura de datos para las propiedades de un pdf firmado.
reason: Razón de la firma.
author: Autor de la firma.
options: Opciones avanzadas para certificados, TSP y OCSP
includeTimestamp: Activa el sello de tiempo en la firma.
includeOCSP: Activa la validación del estado de revocación del certificado en la firma.
timestampProvider: Opciones para el sello de tiempo.
url: Dirección url
user: Usuario
password: Contraseña
ocspProvider: Opciones para la validación del estado de revocación del certificado en la firma
url: Dirección url
user: Usuario
password: Contraseña
certificate: Certificado de firma
p12Certificate: Certificado p12 en base64.
password: Contraseña del certificado en base64.
p8PublicCert: Parte pública de certificado en base 64.
p8PrivateKey: Parte privada de certificado en base 64.
p8BundleCA: Bundle CA para cadena de validación en base 64.
wacom: Parámetros asociados con las tabletas wacom
ebpServiceUrl: Dirección url del servicio para el servicio de traducción ebp
ebpServiceSignatureUrl: Dirección url para el servicio de firma ebp
enableScreenSaver: Habilita la pantalla de espera.
blackAndWhiteScreenSaver: Ruta del proyecto donde se ubica la imagen de la pantalla de espera para wacom en blanco y negro.
colorScreenSaver: Ruta del proyecto donde se ubica la imagen de la pantalla de espera para wacom en color.
enableEbp: Habilita los ebp en el proyecto (plantillas de visualización en la wacom).
enableInitialEbp: Habilita la pantalla previa a la firma en wacom.
varInitialEbp: Descripción de plantilla, que aparece en la pantalla de las wacom previo a la firma. Separado por |||.
blackAndWhiteInitialEbp: Ruta del proyecto donde se ubica la imagen de la inicial para wacom en en blanco y negro.
colorInitialEbp: Ruta del proyecto donde se ubica la imagen inicial para wacom en color.
varEbp: Descripción de plantilla, que aparece en la pantalla de las wacom en la firma. Separado por |||.
blackAndWhiteEbp: Ruta del proyecto donde se ubica imagen de la firma para wacom en blanco y negro.
colorEbp: Ruta del proyecto donde se ubica la imagen de la firma para wacom en color.
minPointsRequiredToSignMultipier: Factor que multiplica el número mínimo de puntos para que la firma sea válida.
Por ejemplo si el mínimo de puntos son 100 y este factor es 2, con la STU será necesario capturar 200 puntos.
