Intégration du Designer (concepteur de document)

Intégrer le concepteur de documents Datasure eSign pour définir des cérémonies de signature électronique dans votre propre application web.

Si vous intégrez eSign pour l'utiliser dans votre portail web, vous pouvez utiliser le concepteur de documents WYSIWYG d’eSign pour définir les cérémonies de signature électronique.

Comment intégrer :

1. Créer un brouillon et intégrer le concepteur

Étapes générales :

1. Téléversez le document (/v6/file/upload) et récupérer l'Id du fichier.
2. Créez un brouillon (draft) de l'enveloppe ( /v6/draft/create) en passant les paramètres suivants :

     "AgentRedirectConfiguration": {
       "Policy": "FormEditor",
       "Allow": true,
       "IFrameAllowList": [
         "https://www.datasure.net"
       ]
     }

Après avoir téléversé un fichier, vous devez donc créer un brouillon et configurer l'option pour autoriser un concepteur externe (AgentRedirectConfiguration). Pour l’appel à la création de brouillon, vous aurez besoin du documentId obtenu lors de l’appel à l’upload du fichier, d’une description d’enveloppe, et de l’option de brouillon.

Cela permet d'obtenir la vue du Designer à intégrer dans votre application métier, ou de communiquer directement le lien à l'utilisateur qui n'aura donc pas besoin de se connecter à eSign :

Valeurs possibles RedirectPolicy :

"Workflow" → redirige directement sur la page de création de l'enveloppe
"FormEditor" → redirige directement sur le designer "Summary" → redirige directement sur la page de résumé d'enveloppe avant envoi

2. Intégrer le Designer

   Il ne vous reste plus qu'à construire l'url du Designer qui est accessible anonymement :

https://esign.datasure.net/AgentRedirect/index?draftid=##draftid##

Pensez à mettre l'url correcte de votre application si vous envisagez d'intégrez en Iframe l'url eSign, en utilisant le paramètre comme dans l'exemple ci-dessus : IFrameAllowList

3. How To

Un exemple concret :

1. créer un File en envoyer 1 fichier PDF

{{baseUrl}}/v6/file/upload

File : fichier à téléverser

2. Créer le draft d'une enveloppe eSign, avec les bons paramètres (exemple du body de la request ci-dessous) sur le endpoint :

{{baseUrl}}/v6/draft/create

{
  "Name": "Signature simple",
  "Documents": [
    {
      "FileId": "3f2603e2-5afe-4bd1-9586-4e94a18406bb",
      "DocumentNumber": 1
    }
  ],
  "Activities": [
    {
      "Action": {
        "Sign": {
          "RecipientConfiguration": {
            "ContactInformation": {
              "Email": "[email protected]",
              "GivenName": "Florian",
              "Surname": "De Vaulx"
            },
            "SendEmails": true
          },
          "Elements": {
            "Signatures": [
              {
                "ElementId": "sig1",
                "DocumentNumber": 1,
                "Required": true,
                "AllowedSignatureTypes": {
                  "ClickToSign": { "Preferred": true }
                },
                "FieldDefinition": {
                  "Position": { "PageNumber": 1, "X": 100, "Y": 500 },
                  "Size": { "Width": 150, "Height": 50 }
                }
              }
            ]
          }
        }
      }
    }
  ],
  "EmailConfiguration": {
    "Subject": "Veuillez signer le document",
    "Message": "Bonjour,\nMerci de bien vouloir signer le document joint.\nCordialement."
  },
  "AgentRedirectConfiguration": {
    "Policy": "FormEditor",
    "Allow": true,
    "IFrameAllowList": [
      "https://www.datasure.net"
    ]
  }
}