Accepter un paiement
Créez un formulaire de paiement ou utilisez une page de paiement préconfigurée pour commencer à accepter les paiements en ligne.
Intégrez un formulaire de paiement préconfiguré à votre site à l’aide de Stripe Checkout. Comparez cette intégration aux autres types d’intégration de Stripe.
Effort d'intégration
Type d'intégration
Intégrer un formulaire de paiement préconfiguré sur votre site
Personnalisation de l'interface utilisateur
Utilisez les paramètres de marque dans le Dashboard Stripe pour adapter l’apparence de Checkout à celle de votre site.
Configurer StripeCôté serveur
Tout d’abord, inscrivez-vous pour créer un Compte Stripe.
Utilisez nos bibliothèques officielles pour accéder à l’API Stripe depuis votre application :
Créer une session CheckoutCôté serveur
Sur votre serveur, créez une session Checkout et attribuez la valeur embedded
au paramètre ui_mode. Vous pouvez configurer la session Checkout pour qu’elle inclue les postes de facture et d’autres options, par exemple la devise.
Pour rediriger vos clients vers une page personnalisée hébergée sur votre site Web, spécifiez l’URL de cette page dans le paramètre return_url. Incluez la variable de modèle {CHECKOUT_SESSION_ID}
dans l’URL pour récupérer l’état de la session sur la page de retour. Checkout remplace automatiquement la variable par l’ID de session Checkout avant la redirection.
En savoir plus sur la configuration de la page de retour et d’autres options pour personnaliser le comportement de redirection.
Après avoir créé la session Checkout, utilisez la client_secret
renvoyée dans la réponse pour monter Checkout.
Monter CheckoutCôté client
Checkout renders in an iframe that securely sends payment information to Stripe over an HTTPS connection.
Erreur fréquente
Avoid placing Checkout within another iframe because some payment methods require redirecting to another page for payment confirmation.
Personnaliser l’apparence
Personnalisez Checkout pour qu’il corresponde au design de votre site en définissant la couleur d’arrière-plan, la couleur des boutons, le rayon de la bordure et les polices dans les paramètres de marque de votre compte.
Par défaut, Checkout s’affiche sans espacement externe ni marge. Nous vous recommandons d’utiliser un élément de conteneur tel qu’un espace div pour appliquer la marge souhaitée (par exemple, 16 px sur tous les côtés).
Afficher une page de retour
Après la tentative de paiement de votre client, Stripe le redirige vers une page de retour que vous hébergez sur votre site. Lorsque vous avez créé la session Checkout, vous avez spécifié l’URL de la page de retour dans le paramètre return_url. En savoir plus sur les autres options de personnalisation du comportement de redirection.
Lors de l’affichage de votre page de retour, récupérez l’état de la session Checkout à l’aide de l’ID de session Checkout dans l’URL. Traitez le résultat en fonction de l’état de la session comme suit :
complete
: le paiement a abouti. Utilisez les informations de la session Checkout pour afficher une page de confirmation.open
: le paiement a échoué ou a été annulé. Montez à nouveau Checkout pour que votre client puisse effectuer une nouvelle tentative.
const session = await fetch(`/session_status?session_id=${session_id}`) if (session.status == 'open') { // Remount embedded Checkout } else if (session.status == 'complete') { // Show success page // Optionally use session.payment_status or session.customer_email // to customize the success page }
Moyens de paiement avec redirection
Lors du paiement, certains moyens de paiement redirigent le client vers une page intermédiaire, comme la page d’autorisation de sa banque. Une fois qu’il a renseigné cette page, Stripe le redirige vers votre page de retour.
En savoir plus sur les moyens de paiement avec redirection et le comportement de redirection.
Tester votre intégration
Pour tester votre intégration de formulaire de paiement intégré :
- Créez une session Checkout intégrée et montez Checkout sur votre page.
- Renseignez les informations d’un moyen de paiement du tableau ci-dessous.
- Saisissez une date d’expiration postérieure à la date du jour.
- Saisissez un code CVC à 3 chiffres.
- Saisissez un code postal de facturation.
- Cliquez sur Payer. Vous êtes redirigé vers votre URL
return_url
. - Accédez au Dashboard et recherchez le paiement sur la page des paiements. Si votre paiement a abouti, il apparaîtra dans cette liste.
- Cliquez sur votre paiement afin d’afficher plus d’informations, par exemple un récapitulatif Checkout contenant les informations de facturation et la liste des articles achetés. Vous pouvez utiliser ces informations pour traiter votre commande.
En savoir plus sur le test de votre intégration.
Consultez la section consacrée aux tests pour obtenir des informations supplémentaires sur la manière de tester votre intégration.