Intégration de la Vérification d'Identité : Guide d'Intégration iFrame

Dans le paysage numérique actuel, la vérification de l'identité des utilisateurs est essentielle pour la prévention de la fraude, la conformité et l'établissement de la confiance. L'intégration directe de la vérification d'identité dans votre application web offre une expérience utilisateur optimisée. Ce guide vous expliquera comment intégrer la solution de vérification d'identité de Didit en utilisant un iFrame, en couvrant tout, de la configuration initiale à la gestion des événements et aux meilleures pratiques. Nous nous concentrerons sur une implémentation d'iFrame de vérification d'identité robuste et sécurisée.

Point clé 1 Les iFrames offrent un moyen rapide et simple d'intégrer la vérification d'identité sans modifications de code importantes à votre application principale.

Point clé 2 La gestion sécurisée de la communication entre votre application et l'iFrame par le biais de la gestion des événements est primordiale pour l'intégrité des données.

Point clé 3 L'exploitation des API de Didit en conjonction avec l'iFrame offre un contrôle granulaire sur le processus de vérification et l'accès à des résultats de vérification détaillés.

Point clé 4 Une configuration et des mesures de sécurité appropriées sont essentielles lors de l'utilisation d'iFrames pour prévenir les vulnérabilités de script intersite (XSS).

Pourquoi Utiliser un iFrame pour la Vérification d'Identité ?

L'intégration de la vérification d'identité peut être complexe et nécessiter des efforts de développement importants. Les iFrames offrent une approche simplifiée, encapsulant le processus de vérification dans un document HTML distinct intégré à votre page web. Cela présente plusieurs avantages :

• Complexité d'Intégration Réduite : Minimisez les modifications à votre code existant.
• Sécurité : Les iFrames fonctionnent dans un environnement isolé, limitant les risques de sécurité potentiels.
• Implémentation Plus Rapide : Démarrez rapidement sans cycles de développement importants.
• Maintenance : Les mises à jour du processus de vérification sont contenues dans l'iFrame, minimisant les perturbations de votre application.

Configuration de l'iFrame : Guide Étape par Étape

Voici comment intégrer l'iFrame de vérification d'identité de Didit dans votre application web :

1. Obtenez l'URL de l'iFrame : Depuis votre console commerciale Didit, générez un lien de vérification (Unilink) et définissez le paramètre embed sur true. Cela renverra une URL spécialement conçue pour l'intégration iFrame.
2. Créez l'Élément iFrame : Ajoutez un élément <iframe> à votre page HTML.
3. Définissez les Attributs de l'iFrame : Configurez l'iFrame avec les attributs suivants :
   • src : Définissez ceci sur l'URL de l'iFrame obtenue à l'étape 1.
   • width : Définissez la largeur de l'iFrame.
   • height : Définissez la hauteur de l'iFrame.
   • frameborder : Définissez sur 0 pour supprimer la bordure.

Exemple de Code HTML :

<iframe src="https://business.didit.me/verification?embed=true&apiKey=YOUR_API_KEY" width="600" height="400" frameborder="0"></iframe>

Remarque Importante : Remplacez YOUR_API_KEY par votre clé API Didit réelle. Utilisez toujours HTTPS pour la source de l'iFrame afin d'assurer une communication sécurisée.

Intégration JavaScript et Gestion des Événements

Pour une intégration JavaScript robuste, vous devrez gérer les événements émis par l'iFrame. Cela permet à votre application de réagir aux événements de vérification tels que la réussite, l'échec ou une erreur. L'iFrame de Didit utilise postMessage pour une communication inter-domaines sécurisée.

Écouter les Messages :

window.addEventListener('message', function(event) {
  if (event.origin !== 'https://business.didit.me') {
    return;
  }

  const message = JSON.parse(event.data);

  switch (message.type) {
    case 'verification_completed':
      // Gérer la vérification réussie
      console.log('Vérification terminée :', message.data);
      break;
    case 'verification_failed':
      // Gérer l'échec de la vérification
      console.error('Vérification échouée :', message.data);
      break;
    case 'error':
      // Gérer les erreurs
      console.error('Erreur :', message.data);
      break;
    default:
      console.log('Message inconnu :', message);
  }
});

Envoyer des Messages à l'iFrame :

const iframe = document.querySelector('iframe');
iframe.contentWindow.postMessage({ type: 'resize', height: 500 }, 'https://business.didit.me');

Considérations de Sécurité pour l'Intégration iFrame

Bien que les iFrames offrent une commodité, la sécurité doit être une priorité absolue. Voici les considérations clés :

• Vérification de l'Origine : Vérifiez toujours l'event.origin dans votre écouteur de messages pour vous assurer que les messages proviennent du domaine attendu (https://business.didit.me).
• Protection XSS : Assainissez toutes les données reçues de l'iFrame avant de les afficher dans votre application pour éviter les attaques de script intersite (XSS).
• HTTPS uniquement : Utilisez toujours HTTPS pour votre application et la source de l'iFrame.
• Politique de Sécurité du Contenu (CSP) : Implémentez une politique de sécurité du contenu (CSP) forte pour restreindre les ressources que l'iFrame peut charger.

Comment Didit Vous Aide

Didit simplifie le processus d'intégration web avec :

• URL iFrame Dédiée : URL faciles à utiliser, spécialement conçues pour l'intégration iFrame.
• Communication Sécurisée : API postMessage pour une communication inter-domaines sécurisée.
• Gestion Complète des Événements : Événements détaillés pour suivre l'état de la vérification et gérer les erreurs.
• Intégration de l'API : Accès à l'ensemble de la suite d'API de Didit pour un contrôle avancé et un accès aux données.
• Infrastructure Évolutive : Infrastructure fiable et évolutive pour gérer des volumes élevés de demandes de vérification.

Prêt à Commencer ?

Prêt à intégrer de manière transparente la vérification d'identité dans votre application web ? Explorez la documentation et les ressources complètes de Didit :

• Documentation Technique
• Centre de Démonstration
• Tarification

Commencez dès aujourd'hui à créer une expérience en ligne plus sûre et plus fiable avec Didit !