transporAppCI/GUIDE_TEST_CINETPAY.md

Guide de Test - Intégration CinetPay

📋 Prérequis

Avant de tester l'intégration CinetPay, vous devez :

1. Obtenir vos identifiants CinetPay :

   • Créer un compte sur CinetPay
   • Récupérer votre APIKEY et SITE_ID depuis votre tableau de bord
   • Utiliser les identifiants de test pour l'environnement de développement

2. Configurer les variables d'environnement :

   # Dans app_transport_front/.env
   VITE_CINETPAY_APIKEY=votre_apikey_de_test
   VITE_CINETPAY_SITE_ID=votre_site_id_de_test
   

🚀 Architecture Implémentée

Frontend

• Service CinetPay : src/services/CinetPayService.ts
• Types TypeScript : src/types/cinetpay.ts
• Composant de réservation : src/components/ReservationWorkflowModal.vue
• Page de succès : src/views/PaymentSuccessView.vue

Backend

• Webhook CinetPay : src/presentation/controllers/payment.controller.ts
• Endpoint : POST /api/payments/cinetpay/webhook

🧪 Comment Tester

1. Test en Mode Développement (Simulation)

1. Démarrer les serveurs :

   # Frontend
   cd app_transport_front
   npm run dev
      
   # Backend
   cd node_app
   npm run start:dev
   

2. Accéder à l'application :

   • Ouvrir http://localhost:5173
   • Naviguer vers une page de réservation
   • Remplir le formulaire de réservation

3. Processus de test :

   • Le système collecte les données sans créer d'entités
   • Au moment du paiement, CinetPay génère une URL de paiement
   • En mode DEV, le paiement est simulé automatiquement
   • Les entités (utilisateur + réservations) sont créées après "paiement" réussi

2. Test avec CinetPay Réel

1. Configurer les vraies clés :

   VITE_CINETPAY_APIKEY=votre_vraie_apikey
   VITE_CINETPAY_SITE_ID=votre_vrai_site_id
   

2. Modifier le mode de test : Dans ReservationWorkflowModal.vue, commenter la simulation :

   // En production, rediriger vers l'URL de paiement CinetPay
   window.location.href = result.data.payment_url
   

3. Tester le workflow complet :

   • Remplir le formulaire de réservation
   • Cliquer sur "Payer"
   • Être redirigé vers CinetPay
   • Effectuer le paiement test
   • Être redirigé vers la page de succès

🔧 Configuration CinetPay selon la Documentation

Paramètres Obligatoires 0

• apikey : Votre clé API CinetPay
• site_id : Votre identifiant de site
• transaction_id : ID unique de transaction (généré automatiquement)
• amount : Montant (multiple de 5)
• currency : Devise (XOF, XAF, CDF, GNF, USD)
• description : Description du paiement
• notify_url : URL de notification webhook
• return_url : URL de retour après paiement
• channels : Canaux de paiement (ALL, MOBILE_MONEY, CREDIT_CARD, WALLET)

Données Client (Obligatoires pour Cartes Bancaires) 0

• customer_name : Nom du client
• customer_surname : Prénom du client
• customer_email : Email du client
• customer_phone_number : Téléphone du client
• customer_address : Adresse du client
• customer_city : Ville du client
• customer_country : Code pays (ex: CI, TG, SN)
• customer_state : État/région
• customer_zip_code : Code postal

📱 Canaux de Paiement Supportés

• ALL : Tous les canaux disponibles
• MOBILE_MONEY : Paiement mobile (Orange Money, MTN Money, etc.)
• CREDIT_CARD : Cartes bancaires
• WALLET : Portefeuilles électroniques

🔄 Workflow de Paiement Optimisé

1. Collecte des données : Formulaire multi-étapes sans création d'entités
2. Génération du paiement : Appel API CinetPay avec toutes les données
3. Redirection : Vers l'interface de paiement CinetPay
4. Notification webhook : CinetPay notifie le succès/échec
5. Création des entités : Seulement après confirmation de paiement
6. Redirection de retour : Vers la page de succès

🚨 Points d'Attention

1. Sécurité :

   • Ne jamais exposer les clés API dans le code frontend
   • Valider les webhooks côté serveur
   • Vérifier les signatures des notifications

2. Gestion d'erreurs :

   • Gérer les échecs de paiement
   • Prévoir les timeouts
   • Logger toutes les transactions

3. Tests :

   • Utiliser les identifiants de test CinetPay
   • Tester tous les canaux de paiement
   • Vérifier les webhooks en local avec ngrok si nécessaire

📞 Support

• Documentation CinetPay : https://docs.cinetpay.com
• Support technique : support@cinetpay.com
• Environnement de test : Utiliser les clés de test fournies par CinetPay

✅ Checklist de Test

• Variables d'environnement configurées
• Serveurs frontend et backend démarrés
• Formulaire de réservation fonctionnel
• Génération d'URL de paiement CinetPay
• Simulation de paiement en mode DEV
• Création des entités après paiement
• Page de succès accessible
• Webhook backend fonctionnel
• Gestion des erreurs de paiement
• Test avec vrais identifiants CinetPay (optionnel)