Aller au contenu principal

browser-js

Intégration de la Signature Ignisign dans les Applications Web​

Cette bibliothèque facilite l'intégration de la signature électronique Ignisign dans les applications web en utilisant le mode embedded.

Alternativement, Ignisign peut être intégré en mode by side, où les utilisateurs sont redirigés vers la plateforme Ignisign pour signer des documents via un lien email, Ignisign gérant l'ensemble du processus.

Pour des informations détaillées sur ces modes d'intégration, visitez Embedded or By-Side Integration.

Si vous recherchez la bibliothèque Backend NodeJS, elle est disponible ici.

Installation​

Installez la bibliothèque en utilisant npm :

npm install @ignisign/ignisign-js

Un compte Ignisign est requis, qui peut être créé gratuitement sur Ignisign Sign Up.

Exemples​

Trouvez des exemples d'intégration ici.

Utilisation​

Initialisation de la Classe IgnisignJs​

Pour utiliser IgnisignJs, commencez par initialiser la classe. Vous aurez besoin d'un appId et d'un environnement d'application :

import { IgnisignJs } from "@ignisign/ignisign-js"

const ignisignJs = new IgnisignJs(appId, appEnv);

Trouvez votre appId et appEnv dans la section "API Keys" de la Console Ignisign. L'environnement d'application est défini comme suit :

enum IGNISIGN_APPLICATION_ENV {
  DEVELOPMENT = "DEVELOPMENT",
  STAGING = "STAGING",
  PRODUCTION = "PRODUCTION",
}

Initialisation d'une Session de Signature​

Pour démarrer une session de signature, utilisez la méthode initSignatureSession de votre instance ignisignJs :

Gestion des Erreurs​

Implémentez handleSignatureSessionError pour gérer les erreurs :

const handleSignatureSessionError = async (
    errorCode, errorContext, signerId, signatureRequestId
  ) : Promise<void> => {
    // Logique de gestion des erreurs ici
  }

Paramètres de handleSignatureSessionError

  • errorCode: Le code d'erreur
  • errorContext: Un contexte qui vous aidera à comprendre d'où vient l'erreur
  • signerId : L'identifiant du signataire
  • signatureRequestId : L'identifiant de la demande de signature

Finalisation des Signatures​

Pour gérer la finalisation des signatures, utilisez handleSignatureSessionFinalized :

const handleSignatureSessionFinalized = async (
    signatureIds, signerId, signatureRequestId
  ) : Promise<void> => {
    // Logique de finalisation ici
  }

Paramètres de handleSignatureSessionFinalized

  • signatureIds : Les identifiants des signatures
  • signerId : L'identifiant du signataire
  • signatureRequestId: L'identifiant de la demande de signature

Gestion des Informations de Fichier Privé​

Pour la fourniture d'informations sur les fichiers privés, implémentez handlePrivateFileInfoProvisioning :

const handlePrivateFileInfoProvisioning = async (
    documentId, externalDocumentId, signerId, signatureRequestId
  ): Promise<IgnisignDocument_PrivateFileDto> => {
    // Logique pour récupérer les informations de fichier privé
  }

Paramètres de handlePrivateFileInfoProvisioning

  • documentId : L'identifiant du document à signer
  • externalDocumentId : Une référence qui se réfère au document à signer dans votre application - Vous devez la fournir lorsque vous fournissez le document à Ignisign
  • signerId : L'identifiant du signataire
  • signatureRequestId : L'identifiant de la demande de signature

Champs de IgnisignPrivateFileDto

  • fileUrl : L'URL du fichier à signer
  • mimeType : Le type MIME du fichier à signer
  • fileName : Le nom du fichier à signer
  • bearer : Optionnel - Un jeton bearer pour accéder au fichier - si fourni, le jeton bearer sera placé dans l'en-tête Authorization de la requête

Paramètres d'Initialisation de la Session de Signature​

Définissez les paramètres d'initialisation pour la session de signature :

const initParams: IgnisignJS_SignatureSession_Initialization_Params = {
  htmlElementId          : "my-div-signature-request-request-id",
  signatureRequestId     : "6490205421ac2fXXXXX" ,
  signerId               : "6490205421ac2fXXXXX",
  signatureSessionToken  : "6490205421ac2fXXXXXXXXXXXXXXXXXXXXXXXXXXX",
  signerAuthSecret       : "6490205421ac2fXXXXX" , 
  closeOnFinish          : true,
  sessionCallbacks : {
    handleSignatureRequestError,
    handleSignatureRequestFinalized,
    handlePrivateFileInfoProvisioning,
  }
  dimensions : {
    width: "100%",
    height: "500px",
  },
  displayOptions : {
    showTitle                     : false,
    showDescription               : false,
    darkMode                      : false,
    forceShowDocumentInformations : false
  }
}

await ignisignJs.initSignatureSession(initParams);

Informations sur les champs de IgnisignJS_SignatureRequest_Initialization_Params

  • htmlElementId : L'identifiant de l'élément HTML qui contiendra l'iframe de la demande de signature
  • signatureRequestId : L'identifiant de la demande de signature - cette valeur est fournie à votre backend par webhook lors de la création de la demande de signature
  • signerId : L'identifiant du signataire - cette valeur est fournie à votre backend par webhook lors de la création de la demande de signature
  • signatureSessionToken : Le jeton unique qui vous permet d'accéder à la demande de signature pour le signataire - Cette valeur est fournie à votre backend par webhook lors de la création de la demande de signature
  • signerAuthSecret : Le secret qui vous permet d'authentifier le signataire - Cette valeur est fournie à votre backend par webhook lors de la création du signataire
  • closeOnFinish : OPTIONNEL - par défaut true - Si vrai, l'iframe de la demande de signature sera fermée automatiquement en cas de finalisation ou d'erreur
  • sessionCallbacks : OPTIONNEL Les callbacks qui seront appelés lorsque l'iframe de la demande de signature envoie un message à la fenêtre parente
  • sessionCallbacks.handlePrivateFileInfoProvisioning :OPTIONNEL - Cette méthode doit être implémentée si le profil de signature lié à la demande de signature est configuré pour utiliser des fichiers privés. Si vous souhaitez fermer automatiquement l'iframe de la demande de signature lorsque la demande de signature est finalisée, vous pouvez définir le paramètre closeOnFinish à true lorsque vous appelez la méthode initSignatureRequest
  • sessionCallbacks.handleSignatureRequestError : RECOMMANDÉ - Cette méthode doit être implémentée si vous souhaitez gérer les erreurs de demande de signature.
  • sessionCallbacks.handleSignatureRequestFinalized : RECOMMANDÉ - Cette méthode doit être implémentée si vous souhaitez gérer la finalisation de la demande de signature.
  • dimensions : OPTIONNEL - Les options qui seront utilisées pour configurer l'iframe de la demande de signature
  • dimensions.width : par défaut : "100%"
  • dimensions.height : par défaut "500px"
  • displayOptions : OPTIONNEL - Option qui détermine le contenu affiché dans l'interface de signature
  • displayOptions.showTitle : par défaut : false - Affiche le titre de la demande de signature comme en mode by-side
  • displayOptions.showDescription : par défaut : false - Affiche la description de la demande de signature comme en mode by-side
  • displayOptions.darkMode : par défaut : "Browser" force le mode sombre du contenu.
  • displayOptions.forceShowDocumentInformations : par défaut : false

Référez-vous à la documentation Ignisign pour des descriptions détaillées des paramètres et des conseils supplémentaires :

Annulation d'une Session de Signature​

Pour fermer prématurément une session de signature, appelez cancelSignatureSession sur votre instance ignisignJs :

ignisignJs.cancelSignatureSession();