Signatures électroniques multilingues : comment localiser la signature intégrée en 15 langues

Si vous intégrez l'expérience de signature de Firma.dev dans votre application, vous souhaitez probablement qu'elle corresponde à la langue de votre utilisateur. Ce guide explique comment Firma.dev gère la localisation et comment la contrôler dans votre intégration.

Comment Firma.dev détecte la langue

Firma.dev utilise un système de détection à 3 niveaux, vérifiés dans cet ordre :

1. Paramètre d'URL (?lang=xx) : Priorité la plus élevée. Si vous transmettez un code de langue dans l'URL, c'est ce que l'utilisateur verra.

2. Stockage local : Lors des visites ultérieures, Firma.dev vérifie la présence d'une préférence linguistique mise en cache. Cela permet une sélection instantanée de la langue sans requête réseau.

3. Détection du navigateur : Utilise par défaut les paramètres de langue du navigateur ou du système de l'utilisateur.

Si la langue détectée ne fait pas partie des 15 langues prises en charge, Firma.dev utilise l'anglais par défaut.

Langues prises en charge

Firma.dev prend en charge ces langues de manière native :

Tous les éléments de l'interface utilisateur, boutons, libellés, notifications, e-mails et messages d'erreur sont entièrement traduits dans chaque langue.

Contrôler la langue dans la signature intégrée

Lorsque vous intégrez le flux de signature dans une iframe, la détection par le navigateur ne fonctionne pas de manière fiable. L'iframe hérite du contexte de la page parente, et non des paramètres du navigateur de l'utilisateur. Vous devez transmettre la langue explicitement.

Ajoutez le paramètre ?lang= à l'URL de signature :

<iframe
  src="https://app.firma.dev/signing/{signing_request_user_id}?lang=es"
  style="width:100%;height:900px;border:0;"
  allow="camera;microphone;clipboard-write"
  title="Firmar Documento"
></iframe>

<iframe
  src="https://app.firma.dev/signing/{signing_request_user_id}?lang=es"
  style="width:100%;height:900px;border:0;"
  allow="camera;microphone;clipboard-write"
  title="Firmar Documento"
></iframe>

<iframe
  src="https://app.firma.dev/signing/{signing_request_user_id}?lang=es"
  style="width:100%;height:900px;border:0;"
  allow="camera;microphone;clipboard-write"
  title="Firmar Documento"
></iframe>

Source : Guide de localisation

Cela force l'interface de signature à s'afficher en espagnol, quels que soient les paramètres du navigateur de l'utilisateur.

Récupération des URL de signature et rendu de l'iframe

Voici comment obtenir l'URL de signature depuis l'API et effectuer son rendu de manière dynamique :

// fetch signing request
const r = await fetch('/internal/signing-request/' + signingRequestId)
const json = await r.json()

// get recipient signing URL
const recipient = json.recipients[0]
const signingUrl = recipient.signing_url || `https://app.firma.dev/signing/${recipient.id}`

// render iframe
const iframe = document.createElement('iframe')
iframe.src = signingUrl
iframe.style.width = '100%'
iframe.style.height = '900px'
iframe.frameBorder = '0'
iframe.allow = 'camera;microphone;clipboard-write'
document.getElementById('signing-root').appendChild(iframe)

// fetch signing request
const r = await fetch('/internal/signing-request/' + signingRequestId)
const json = await r.json()

// get recipient signing URL
const recipient = json.recipients[0]
const signingUrl = recipient.signing_url || `https://app.firma.dev/signing/${recipient.id}`

// render iframe
const iframe = document.createElement('iframe')
iframe.src = signingUrl
iframe.style.width = '100%'
iframe.style.height = '900px'
iframe.frameBorder = '0'
iframe.allow = 'camera;microphone;clipboard-write'
document.getElementById('signing-root').appendChild(iframe)

// fetch signing request
const r = await fetch('/internal/signing-request/' + signingRequestId)
const json = await r.json()

// get recipient signing URL
const recipient = json.recipients[0]
const signingUrl = recipient.signing_url || `https://app.firma.dev/signing/${recipient.id}`

// render iframe
const iframe = document.createElement('iframe')
iframe.src = signingUrl
iframe.style.width = '100%'
iframe.style.height = '900px'
iframe.frameBorder = '0'
iframe.allow = 'camera;microphone;clipboard-write'
document.getElementById('signing-root').appendChild(iframe)

Source : Guide d'envoi d'une demande de signature

Pour correspondre aux paramètres régionaux de votre application, ajoutez le paramètre de langue lors de la définition de la source de l'iframe :

const userLocale = getCurrentUserLocale() // returns 'es', 'de', 'fr', etc.
iframe.src = `${signingUrl}?lang=${userLocale}`

const userLocale = getCurrentUserLocale() // returns 'es', 'de', 'fr', etc.
iframe.src = `${signingUrl}?lang=${userLocale}`

const userLocale = getCurrentUserLocale() // returns 'es', 'de', 'fr', etc.
iframe.src = `${signingUrl}?lang=${userLocale}`

Cela garantit la cohérence de l'expérience de signature avec le reste de votre application.

Bonnes pratiques

Ces recommandations proviennent directement de la documentation de Firma.dev :

• Utilisez le paramètre lang dans la signature intégrée : Ne vous fiez pas à la détection du navigateur dans le contexte des iframes. Transmettez la langue explicitement pour garantir une expérience cohérente.

• Adaptez-vous à la langue de votre application : Lors de l'intégration de Firma.dev, transmettez les mêmes paramètres régionaux que ceux utilisés par votre application pour que l'expérience de signature s'intègre parfaitement.

• Laissez le choix aux utilisateurs : Pour les liens directs Firma.dev (par exemple, dans les e-mails), omettez le paramètre lang et laissez la détection automatique de Firma.dev s'en charger. Les utilisateurs ayant défini une préférence verront la langue qu'ils ont choisie.

Source : Guide de localisation

Firma.dev traduit l'interface de signature et ses e-mails, et votre document apparaît exactement tel que vous l'avez téléversé. Un signataire à Madrid verra des boutons et des instructions en espagnol, quelle que soit la langue dans laquelle le contrat est rédigé. Si vos signataires lisent une autre langue, traduisez le fichier avant de le téléverser. Un traducteur professionnel basé sur l'IA comme Lara Translate vous permet d'obtenir rapidement un premier jet et d'ajouter du contexte pour guider la traduction. Pour les contrats et autres documents sensibles, demandez à un réviseur qualifié, idéalement une personne connaissant le droit des contrats dans le pays du signataire, de vérifier la version traduite avant son envoi pour signature.

Localisation dans les autres composants intégrables

Le paramètre ?lang= fonctionne de la même manière pour les autres composants intégrables de Firma.dev :

• Éditeur de modèles intégrable : Pour créer et modifier des modèles de documents

• Éditeur de demandes de signature intégrable : Pour configurer les destinataires et les options d'envoi

Les deux utilisent l'authentification JWT et prennent en charge l'ensemble des 15 langues. Consultez le Guide de l'éditeur de demandes de signature intégrable pour les détails de mise en œuvre.

Remarque sur l'infrastructure

Firma.dev est hébergé dans l'UE (région AWS Paris), ce qui s'associe parfaitement avec le support multilingue si vous ciblez les marchés européens. La plateforme prend en charge le RGPD et eIDAS (niveaux SES et AdES) pour répondre aux exigences de conformité régionale.

Étapes suivantes

Pour la référence technique complète, consultez le Guide de localisation dans la documentation. Il couvre les cas particuliers tels que les équipes multilingues et le comportement de persistance de la langue.

Prêt à vous lancer ? Obtenir la clé API et commencez à intégrer des signatures électroniques localisées. Aucune carte bancaire requise.