espace-paie-odentas/SIGNATURE_VERIFICATION_READY.md
odentas d5a110484b feat: Système de vérification de signature électronique avec QR code
- Page publique /verify/[id] affichant Odentas Seal, TSA, certificat
- API /api/signatures/create-verification pour créer preuves
- Générateur PDF de preuve avec QR code (jsPDF)
- Hook useSignatureProof() pour intégration facile
- Table Supabase signature_verifications avec RLS public
- Page de test /test-signature-verification
- Documentation complète du système

Les signataires peuvent scanner le QR code ou visiter l'URL pour vérifier l'authenticité et l'intégrité de leur document signé.
2025-10-29 09:22:01 +01:00

4.3 KiB

Système de Vérification de Signature - Créé avec Succès

🎯 Ce qui a été créé

1. Page de Vérification Publique

app/verify/[id]/page.tsx

  • Route dynamique accessible via URL ou QR code
  • Affiche tous les détails de la signature (Odentas Seal, TSA, certificat)
  • Design professionnel avec statuts visuels
  • Accessible sans authentification

2. Migration Supabase

supabase/migrations/20251028_signature_verifications.sql

  • Table signature_verifications avec RLS public en lecture
  • Stocke : document, signataire, hash, certificat, timestamp, statuts

3. API de Création

app/api/signatures/create-verification/route.ts

  • POST endpoint pour créer une preuve de signature
  • Génère l'entrée DB + QR code
  • Retourne : verification_id, URL, QR code data URL

4. Générateur de PDF

lib/signature-proof-pdf.ts

  • Génère un PDF A4 professionnel
  • Contient : QR code (70x70mm), URL, détails techniques
  • Design Odentas avec en-tête indigo

5. Hook React

hooks/useSignatureProof.ts

  • Hook useSignatureProof() pour faciliter l'utilisation
  • Gère l'appel API + génération du PDF
  • Retourne le blob PDF prêt à télécharger

6. Page de Test

app/test-signature-verification/page.tsx

  • Route /test-signature-verification
  • Interface pour tester le système
  • Crée une preuve factice et affiche le résultat

7. Documentation

SIGNATURE_VERIFICATION_SYSTEM.md

  • Documentation complète du système
  • Architecture, workflow, sécurité, intégration

📦 Dépendances Installées

npm install jspdf qrcode @types/qrcode

🚀 Prochaines Étapes

1. Appliquer la Migration Supabase

# Option A : Via Supabase CLI
supabase db push

# Option B : Manuellement
psql -h db.xxx.supabase.co -U postgres -d postgres \
  -f supabase/migrations/20251028_signature_verifications.sql

2. Tester le Système

  1. Lancer le dev : npm run dev
  2. Visiter : http://localhost:3000/test-signature-verification
  3. Cliquer sur "Créer une Preuve de Test"
  4. Télécharger le PDF et scanner le QR code

3. Intégrer dans les Contrats

Exemple dans la page de signature :

import { useSignatureProof } from "@/hooks/useSignatureProof";

const { createSignatureProof } = useSignatureProof();

// Après signature Docuseal
const proof = await createSignatureProof({
  document_name: `Contrat ${employee.prenom} ${employee.nom}`,
  pdf_url: signedPdfUrl,
  signer_name: `${employee.prenom} ${employee.nom}`,
  signer_email: employee.email,
  signature_hash: extractedHash, // À extraire du PDF signé
  contract_id: contract.id,
  organization_id: contract.organization_id,
});

// Télécharger les 2 fichiers
downloadFile(signedPdfUrl, "contrat-signe.pdf");
downloadFile(
  URL.createObjectURL(proof.proof_pdf_blob),
  "preuve-signature.pdf"
);

4. Configuration Vercel

Vérifier vercel.json :

{
  "functions": {
    "app/api/**/*.ts": {
      "regions": ["cdg1"]
    }
  }
}

🔍 Structure des URLs

# Page de vérification publique
https://espace-paie.odentas.com/verify/{uuid}

# API de création
POST https://espace-paie.odentas.com/api/signatures/create-verification

# Page de test
https://espace-paie.odentas.com/test-signature-verification

Checklist Finale

  • Page de vérification créée
  • Migration Supabase créée
  • API endpoint créé
  • Générateur PDF créé
  • Hook React créé
  • Page de test créée
  • Documentation complète
  • Dépendances installées
  • Migration appliquée à Supabase
  • Test en local effectué
  • Intégration dans workflow contrats
  • Déploiement en production

📝 Notes Importantes

Certificat Auto-signé

Le système affiche un statut "Techniquement Valide" avec une note explicative pour les certificats auto-signés. C'est normal et attendu.

Données Publiques

Les pages de vérification sont volontairement publiques (RLS USING (true)). Aucune donnée sensible n'est exposée (pas de contenu document, IBAN, etc.).

QR Code

Le QR code est généré en haute qualité (512x512px) et intégré dans le PDF de preuve à 70x70mm pour une bonne scannabilité.


Prêt à utiliser ! 🚀

Tout le code est en place. Il suffit d'appliquer la migration Supabase et de tester.