Configurer de futurs paiements par carte

Utilisez la confirmation manuelle côté serveur ou présentez les moyens de paiement séparément.

Avertissement

Nous vous recommandons de suivre le guide consacré à la configuration de paiements futurs, mais seulement si vous devez exécuter une confirmation manuelle côté serveur, ou si votre intégration vous oblige à présenter les moyens de paiement dans une étape distincte. Si vous avez déjà intégré Elements, consultez le guide de migration du composant Payment Element.

Pour collecter les informations de paiement du client que vous pourrez réutiliser ultérieurement, utilisez le mode configuration de Checkout. Le mode configuration utilise l’API Setup Intents pour créer des moyens de paiement.

Consultez notre exemple fonctionnel complet sur GitHub.

Configurer Stripe
Côté serveur

Tout d’abord, il vous faut un compte Stripe. S’inscrire.

Utilisez nos bibliothèques officielles pour accéder à l’API Stripe depuis votre application :

Créer une session Checkout
Côté client
Côté serveur

Ajoutez à votre site Web un bouton de paiement qui appelle un endpoint côté serveur afin de créer une session Checkout.

index.html
<html>
  <head>
    <title>Checkout</title>
  </head>
  <body>
    <form action="/create-checkout-session" method="POST">
      <button type="submit">Checkout</button>
    </form>
  </body>
</html>

Pour créer une session en mode configuration, utilisez le paramètre mode avec la valeur setup lors de la création de la session. Vous pouvez éventuellement spécifier le paramètre client pour associer automatiquement le moyen de paiement créé à un client existant. Checkout utilise des moyens de paiement dynamiques par défaut, ce qui vous oblige à transmettre le paramètre currency lorsque vous utilisez le mode setup.

Associez la variable de modèle {CHECKOUT_SESSION_ID} à l’URL success_url pour accéder à l’ID de session une fois que votre client termine sa session Checkout. Après avoir créé la session Checkout, redirigez votre client vers l’URL renvoyée dans la réponse.

Payment methods

By default, Stripe enables cards and other common payment methods. You can turn individual payment methods on or off in the Stripe Dashboard. In Checkout, Stripe evaluates the currency and any restrictions, then dynamically presents the supported payment methods to the customer.

To see how your payment methods appear to customers, enter a transaction ID or set an order amount and currency in the Dashboard.

You can enable Apple Pay and Google Pay in your payment methods settings. By default, Apple Pay is enabled and Google Pay is disabled. However, in some cases Stripe filters them out even when they’re enabled. We filter Google Pay if you enable automatic tax without collecting a shipping address.

Checkout’s Stripe-hosted pages don’t need integration changes to enable Apple Pay or Google Pay. Stripe handles these payments the same way as other card payments.

Récupérer la session Checkout
Côté serveur

Une fois que votre client a terminé sa session Checkout, vous devez récupérer l’objet session. Il y a deux façons de procéder :

De manière asynchrone : en traitant les webhooks checkout.session.completed, qui contiennent un objet session. En savoir plus sur la configuration des webhooks.
De manière synchrone : obtenez l’ID de session à partir de l’URL success_url lorsqu’un utilisateur est redirigé vers votre site. Utilisez l’ID de session pour récupérer l’objet de session.

Le choix entre ces deux méthodes dépend de votre tolérance aux abandons de paiement. En effet, il peut arriver que vos clients n’arrivent pas à l’URL success_url après la réussite d’un paiement. Ils peuvent par exemple fermer l’onglet de leur navigateur avant d’être correctement redirigés. Si votre intégration traite les webhooks, elle ne sera pas exposée à ce type d’abandon de paiement.

Après avoir récupéré l’objet session, obtenez la valeur de la clé setup_intent, qui correspond à l’ID du SetupIntent créé lors de la session Checkout. Un SetupIntent est un objet permettant de configurer les coordonnées de compte bancaire de votre client en vue de paiements futurs.

Exemple de charge utile checkout.session.completed :

{
  "id": "evt_1Ep24XHssDVaQm2PpwS19Yt0",
  "object": "event",
  "api_version": "2019-03-14",
  "created": 1561420781,
  "data": {
    "object": {
      "id": "cs_test_MlZAaTXUMHjWZ7DcXjusJnDU4MxPalbtL5eYrmS2GKxqscDtpJq8QM0k",
      "object": "checkout.session",
      "billing_address_collection": null,
      "client_reference_id": null,
      "customer": "",
      "customer_email": null,
      "display_items": [],
      "mode": "setup",
      "setup_intent": "seti_1EzVO3HssDVaQm2PJjXHmLlM",
      "submit_type": null,
      "subscription": null,
      "success_url": "https://example.com/success"
    }
  },
  "livemode": false,
  "pending_webhooks": 1,
  "request": {
    "id": null,
    "idempotency_key": null
  },
  "type": "checkout.session.completed"
}

Prenez note de l’ID du setup_intent pour la prochaine étape.

Récupérer le SetupIntent
Côté serveur

À l’aide de l’ID de setup_intent, récupérez l’objet SetupIntent. L’objet renvoyé contient un ID de payment_method que vous pouvez associer à un client à l’étape suivante.

Note

Si vous récupérez ces informations de manière synchrone auprès de l’API Stripe (et non en traitant des webhooks), vous pouvez combiner cette étape-ci à l’étape précédente en développant l’objet SetupIntent dans votre requête au endpoint /v1/checkout/session. De cette manière, vous n’avez pas besoin d’effectuer deux requêtes réseau différentes pour accéder à l’ID du PaymentMethod qui vient d’être créé.

Charge the payment method later
Côté serveur

If you didn’t create the Checkout Session with an existing customer, use the ID of the PaymentMethod to attach the PaymentMethod to a Customer. After you attach the PaymentMethod to a customer, you can make an off-session payment using a PaymentIntent:

Set customer to the ID of the Customer and payment_method to the ID of the PaymentMethod.
Set off_session to true to indicate that the customer isn’t in your checkout flow during a payment attempt and can’t fulfill an authentication request made by a partner, such as a card issuer, bank, or other payment institution. If, during your checkout flow, a partner requests authentication, Stripe requests exemptions using customer information from a previous on-session transaction. If the conditions for exemption aren’t met, the PaymentIntent might throw an error.
Set the value of the PaymentIntent’s confirm property to true, which causes confirmation to occur immediately when you create the PaymentIntent.

When a payment attempt fails, the request also fails with a 402 HTTP status code and the status of the PaymentIntent is requires_payment_method. Notify your customer to return to your application (for example, by sending an email or in-app notification) and direct your customer to a new Checkout Session to select another payment method.

Configurer de futurs paiements par carte

Utilisez la confirmation manuelle côté serveur ou présentez les moyens de paiement séparément.

Avertissement

Configurer StripeCôté serveur

Créer une session CheckoutCôté clientCôté serveur