datakeen-session-react

SDK Datakeen Session React

Documentation Technique

📦 Installation du SDK

Pour intégrer le SDK Datakeen Session dans votre projet React, vous pouvez utiliser npm, yarn ou pnpm :

# Via npm
npm install datakeen-session-react

# Via yarn
yarn add datakeen-session-react

# Via pnpm
pnpm add datakeen-session-react

🚀 Guide de démarrage rapide

Prérequis

• Une application React fonctionnelle (React 16.8+ recommandé pour support des Hooks)
• Un identifiant de session Datakeen valide (obtenu via l'API Datakeen)

Étape 1 : Importer le SDK

import useSession from "datakeen-session-react";

Étape 2 : Initialiser et afficher la session

const MonComposant = () => {
  // Initialisation avec l'ID de session
  const { SessionComponent } = useSession("votre-session-id");

  return (
    <div>
      {/* Intégrez le composant de session où vous le souhaitez */}
      {SessionComponent}
    </div>
  );
};

💡 Cas d'utilisation courants

Intégration dans une page de vérification d'identité

import React from "react";
import useSession from "datakeen-session-react";

const VerificationPage = () => {
  // Vous pouvez récupérer l'ID de session depuis votre backend
  const sessionId = "votre-session-id";
  const { SessionComponent } = useSession(sessionId);

  return (
    <div className="verification-container">
      <h1>Vérification d'identité</h1>
      <p>Merci de suivre les étapes ci-dessous pour vérifier votre identité</p>

      {/* Le SDK gère automatiquement toutes les étapes du processus */}
      <div className="session-wrapper">{SessionComponent}</div>
    </div>
  );
};

Intégration dans un flux d'onboarding

import React, { useState } from "react";
import useSession from "datakeen-session-react";

const OnboardingFlow = () => {
  const [step, setStep] = useState(1);
  const [sessionId, setSessionId] = useState(null);

  // Fonction pour initialiser la session après l'étape 1
  const initializeSession = async (userData) => {
    // Exemple d'appel API pour obtenir un ID de session
    const response = await fetch("https://api.votreservice.com/init-session", {
      method: "POST",
      body: JSON.stringify(userData),
    });

    const data = await response.json();
    setSessionId(data.sessionId);
    setStep(2);
  };

  // Rendu conditionnel basé sur l'étape
  if (step === 1) {
    return (
      <div>
        <h2>Étape 1: Informations de base</h2>
        {/* Votre formulaire de collecte d'informations */}
        <button
          onClick={() =>
            initializeSession({
              /* données utilisateur */
            })
          }
        >
          Continuer
        </button>
      </div>
    );
  }

  if (step === 2 && sessionId) {
    const { SessionComponent } = useSession(sessionId);

    return (
      <div>
        <h2>Étape 2: Vérification d'identité</h2>
        {SessionComponent}
      </div>
    );
  }
};

📋 Flux de vérification supportés

Le SDK prend en charge les documents d'identité des pays suivants :

• 🇫🇷 France

Les types de documents supportés incluent :

• Carte Nationale d'Identité
• Passeport
• Permis de conduire
• Titre de séjour

🔧 Personnalisation

Le SDK s'intègre naturellement avec votre interface utilisateur et adopte automatiquement les styles CSS de votre application. Pour une personnalisation avancée, vous pouvez encapsuler le composant de session dans vos propres conteneurs stylisés.

⚙️ Configuration de l'environnement

Le SDK utilise des variables d'environnement pour la configuration. Pour configurer l'URL de l'API, créez un fichier .env à la racine de votre projet avec le contenu suivant :

VITE_API_BASE_URL=https://dev2.datakeen.co/backend/session

Pour une configuration rapide, vous pouvez utiliser la commande suivante dans le projet SDK :

npm run setup:env

Cette commande génère les fichiers .env nécessaires pour le SDK et le projet de démo.

Pour plus de détails sur la configuration de l'environnement, consultez la documentation dédiée.

💬 Support et assistance

Pour toute question technique ou problème d'intégration :

• Email Support: [e-mail]
• Documentation API: https://api.datakeen.co/docs
• Site Web: www.datakeen.co

Datakeen - Solutions d'identité numérique

Dernière mise à jour: Juin 2025