Fonctionnement de Stripe Checkout

Vous développez la version alpha d'un service en ligne payant et souhaitez intégrer très rapidement un système de paiement sur votre POC. Stripe Checkout est probablement la solution que vous cherchez.

Stripe Checkout est une solution de paiement hébergée qui offre une fonctionnalité de paiement sécurisée, plébiscitée par les start-upers de tous bords.

Voic son fonctionnement et la procédure d'intégration pas à pas :

Fonctionnement de Stripe Checkout :

1. Le client choisit de payer sur votre site.
2. Il est redirigé vers une page de paiement hébergée par Stripe.
3. Le client entre ses informations de paiement sur cette page sécurisée.
4. Une fois le paiement effectué, le client est redirigé vers votre site.

Procédure d'intégration de Stripe Checkout dans l'application

1. Créez un compte Stripe et obtenez vos clés API (publique et secrète).
2. Installez la bibliothèque Stripe dans votre projet. Pour Node.js, utilisez :
   text

   npm install stripe

• Configurez Stripe dans votre application avec votre clé secrète :
  javascript

  const stripe = require('stripe')('votre_clé_secrète_stripe');
• Créez une route côté serveur pour initialiser la session Checkout :
  javascript

  app.post('/create-checkout-session', async (req, res) => { const session = await stripe.checkout.sessions.create({ payment_method_types: ['card'], line_items: [ { price_data: { currency: 'eur', product_data: { name: 'Livre Blanc', }, unit_amount: 1000, // 10 euros en centimes }, quantity: 1, }, ], mode: 'payment', success_url: 'https://votresite.com/success', cancel_url: 'https://votresite.com/cancel', }); res.json({ id: session.id }); });
• Intégrez Stripe Checkout côté client. Ajoutez le script Stripe.js à votre page HTML :
  xml

  <script src="https://js.stripe.com/v3/"></script>
• Ajoutez un bouton de paiement dans votre HTML :
  xml

  <button id="checkout-button">Acheter le Livre Blanc</button>
• Implémentez la logique côté client pour rediriger vers Checkout :
  javascript

  var stripe = Stripe('votre_clé_publique_stripe'); var checkoutButton = document.getElementById('checkout-button'); checkoutButton.addEventListener('click', function() { fetch('/create-checkout-session', { method: 'POST', }) .then(function(response) { return response.json(); }) .then(function(session) { return stripe.redirectToCheckout({ sessionId: session.id }); }) .then(function(result) { if (result.error) { alert(result.error.message); } }) .catch(function(error) { console.error('Error:', error); }); });
• Gérez les webhooks pour traiter les événements post-paiement :
  • Configurez l'URL de webhook dans le tableau de bord Stripe.
  • Créez une route pour recevoir les événements webhook :
    javascript

    app.post('/webhook', express.raw({type: 'application/json'}), (req, res) => { const sig = req.headers['stripe-signature']; let event; try { event = stripe.webhooks.constructEvent(req.body, sig, 'votre_clé_secrète_webhook'); } catch (err) { return res.status(400).send(`Webhook Error: ${err.message}`); } if (event.type === 'checkout.session.completed') { const session = event.data.object; // Traitez le paiement réussi ici (par exemple, générez et envoyez le livre blanc) } res.json({received: true}); });

9. Testez l'intégration en mode test :
   • Utilisez les cartes de test fournies par Stripe pour simuler différents scénarios de paiement.
   • Vérifiez que les webhooks fonctionnent correctement.
10. Une fois les tests réussis, passez en mode production :
    • Remplacez les clés de test par les clés de production dans votre configuration.
    • Mettez à jour l'URL de webhook dans le tableau de bord Stripe avec l'URL de production.

Cette intégration permet d'offrir une expérience de paiement sécurisée et optimisée, gérée par Stripe, tout en vous permettant de personnaliser le processus selon vos besoins spécifiques pour la vente de livres blancs.