Le WordPress d'aujourd'hui, décodé pour les développeurs

Éditeur de site (FSE)

Éditeur de site et Stripe Checkout : une page de paiement sans WooCommerce

Intégration de Stripe Checkout dans un template de page dédié pour encaisser un paiement ponctuel, sans installer WooCommerce pour un seul produit.

Par WordPress Développement • 19 mai 2024 • 4 min de lecture • Aucun commentaire
Éditeur de site et Stripe Checkout : une page de paiement sans WooCommerce

stripe listen --forward-to localhost/wp-json/wpm/v1/stripe-webhook. Cette commande de test, lancée en local pendant le développement, résume bien l’esprit de ce projet : encaisser le paiement d’un unique billet d’entrée pour un événement associatif annuel, sans installer WooCommerce pour un seul produit vendu une fois par an.

Ce billet détaille l’intégration de Stripe Checkout dans un template de page dédié d’un site en éditeur de site, pour ce cas où une extension e-commerce complète serait disproportionnée. Les paiements récurrents et la facturation automatisée ne sont pas traités ici, ce projet ne concernant qu’un paiement ponctuel et unique par visiteur.

Pourquoi éviter WooCommerce pour ce besoin

WooCommerce apporte un catalogue produit, une gestion de stock, un tunnel de commande complet et de nombreuses tables en base de données, utiles pour une boutique réelle mais superflues pour la vente d’un seul type de billet, sans variation ni gestion de stock fine. L’association avait par ailleurs déjà eu une mauvaise expérience avec une précédente installation de WooCommerce jamais réellement utilisée, laissée à l’abandon après l’événement de l’année précédente.

Stripe Checkout propose une page de paiement hébergée directement par Stripe, ce qui déporte l’essentiel de la complexité de sécurité et de conformité (informations de carte bancaire, 3D Secure) hors du site WordPress lui-même.

Créer l’endpoint de session Checkout

Un endpoint REST personnalisé, enregistré via register_rest_route(), crée une session Stripe Checkout côté serveur au moment où le visiteur clique sur le bouton d’achat, en utilisant la bibliothèque PHP officielle de Stripe installée via Composer.

L'essentiel à retenir : Session Stripe Checkout créée côté serveur via un endpoint dédié ; Aucune table de commande WooCommerce nécessaire ; Redirection gérée entièrement par Stripe
add_action( 'rest_api_init', function() {
    register_rest_route( 'wpm/v1', '/creer-session-paiement', array(
        'methods'             => 'POST',
        'callback'            => 'wpm_creer_session_stripe',
        'permission_callback' => '__return_true',
    ) );
} );

function wpm_creer_session_stripe( $request ) {
    \Stripe\Stripe::setApiKey( WPM_STRIPE_SECRET_KEY );

    $session = \Stripe\Checkout\Session::create( array(
        'payment_method_types' => array( 'card' ),
        'line_items'            => array( array(
            'price'    => WPM_STRIPE_PRICE_ID,
            'quantity' => 1,
        ) ),
        'mode'        => 'payment',
        'success_url' => home_url( '/confirmation-inscription/' ),
        'cancel_url'  => home_url( '/billet-evenement/' ),
    ) );

    return new WP_REST_Response( array( 'url' => $session->url ), 200 );
}

Le template de la page de vente

Le template templates/billet-evenement.html reste un template classique du thème bloc, avec un pattern de présentation de l’événement et un simple bouton, dont le script associé appelle l’endpoint puis redirige le visiteur vers l’URL de session renvoyée par Stripe.

document.getElementById( 'wpm-bouton-achat' ).addEventListener( 'click', async function() {
    const reponse = await fetch( '/wp-json/wpm/v1/creer-session-paiement', {
        method: 'POST',
    } );
    const donnees = await reponse.json();
    window.location.href = donnees.url;
} );

Le visiteur quitte alors temporairement le site pour la page de paiement hébergée par Stripe, avant d’être redirigé vers la page de confirmation du site une fois le paiement validé.

Confirmer le paiement côté serveur

La page de confirmation seule ne suffit pas à prouver qu’un paiement a réellement eu lieu, un visiteur pouvant théoriquement y accéder directement sans payer. Un webhook Stripe, écouté sur un second endpoint REST, reçoit l’événement checkout.session.completed et enregistre l’inscription dans une table dédiée uniquement à ce moment-là.

  • La signature du webhook est systématiquement vérifiée via \Stripe\Webhook::constructEvent(), pour écarter toute requête falsifiée vers cet endpoint.
  • Une entrée est ajoutée dans une table wpm_inscriptions minimale, avec l’adresse courriel du payeur et l’identifiant de session Stripe, seule donnée réellement conservée côté site.
  • Un courriel de confirmation, envoyé via wp_mail(), reprend les informations pratiques de l’événement, indépendamment du reçu de paiement envoyé directement par Stripe au payeur.

Un paiement ponctuel ne nécessite pas toujours un tunnel de commande complet : parfois, une session hébergée et un webhook suffisent largement.

Notre verdict

Cette intégration légère de Stripe Checkout a permis à l’association d’encaisser ses inscriptions sans réinstaller une extension e-commerce abandonnée l’année précédente. La limite de cette approche est claire : dès qu’un site a besoin de plusieurs types de billets, d’une gestion de quotas ou d’un catalogue évolutif, une solution plus structurée redevient nécessaire, WooCommerce ou une extension de billetterie dédiée reprenant alors tout leur sens.

Laisser un commentaire

Votre adresse e-mail ne sera pas publiée. Les champs obligatoires sont indiqués avec *

Partager :

À propos de l'auteur

WordPress Développement

Développeur WordPress, passionné par Elementor, le FSE et l’automatisation par IA.

Voir tous ses articles

Dans la même veine

À lire aussi