Guide de migration de Checkout
L’ancienne version de Checkout présentait aux clients une fenêtre modale pour recueillir les informations de carte bancaire et renvoyait un jeton ou une source à votre site Web. En revanche, la nouvelle version de Checkout propose une page de paiement intelligente hébergée par Stripe qui crée des paiements ou des abonnements. Elle prend en charge Apple Pay, la norme 3D Secure dynamique et de nombreuses autres fonctionnalités.
La version actuelle de Checkout apporte davantage de flexibilité, avec la prise en charge de postes dynamiques, Connect, la réutilisation des clients existants et des fonctionnalités d’abonnement avancées. Vous pouvez également utiliser l’intégration client, plus rapide à mettre en œuvre et appropriée pour les catalogues de produits moins complexes.
Pour effectuer la migration de l’ancienne à la nouvelle version, suivez le guide correspondant le mieux à votre modèle économique. Chaque guide recommande un chemin d’intégration avec des exemples de code.
Catalogue de produits et tarifications dynamiques
Si vous avez un vaste catalogue de produits ou vous avez besoin de la prise en charge des postes créés de manière dynamique (telles que des dons ou des taxes).
Si en tant que fournisseur vous facturez des logiciels-services aux utilisateurs et avez besoin de la prise en charge de fonctionnalités avancées.
Plateformes et places de marché Connect
Si vous exploitez une place de marché mettant en relation des prestataires de services et des clients.
Enregistrement de moyens de paiement pour utilisation ultérieure
Si vous exploitez une entreprise qui ne facture des services qu’une fois que ceux-ci ont été rendus aux clients.
Catalogue de produits simple avec tarification fixe
Si vous vendez quelques produits à des prix pré-déterminés.
Si vous êtes un fournisseur de logiciels-services avec un plan d’abonnement mensuel.
En suivant le guide de migration correspondant, vous pouvez également vous référer à la table de conversion pour une mise en correspondance des paramètres spécifiques et des options de configuration entre les deux versions de Checkout.
Catalogue de produits et tarifications dynamiques
Si vous vendez des produits pour lesquels le montant ou les postes sont déterminés de manière dynamique (par exemple avec un vaste catalogue de produits ou pour des dons), consultez Accepter les paiements ponctuels.
Vous avez peut-être utilisé l’ancienne version de Checkout pour créer un jeton ou une source sur le client, et l’avez passé à votre serveur pour créer un paiement. L’intégration serveur de la version actuelle de Checkout inverse ce flux. Vous créez d’abord une session sur votre serveur, passez son identifiant à votre client, redirigez votre client vers Checkout, qui est ensuite à nouveau redirigé vers votre application en cas de succès.
Avant
Avec l’ancienne version de Checkout, vous affichiez le montant et la description dynamiques et collectiez les informations de carte auprès de votre client.
<form action="/purchase" method="POST"> <script src="https://checkout.stripe.com/checkout.js" class="stripe-button" data-key=
data-name="Custom t-shirt" data-description="Your custom designed t-shirt" data-amount="{{ORDER_AMOUNT}}" data-currency="usd"> </script> </form>"pk_test_TYooMQauvdEDq54NiTphI7jx"
Ensuite, vous transmettiez le jeton ou la source qui en résultait à votre serveur pour le paiement.
Après
Avec la version actuelle de Checkout, commencez par créer une session Checkout sur votre serveur.
Remarques
Si vous utilisez l’une de nos bibliothèques Client, vous devez la mettre à niveau vers sa dernière version pour pouvoir utiliser l’API Checkout Sessions.
Ensuite, transmettez l’identifiant de la session à votre client et redirigez votre client vers Checkout pour effectuer le paiement.
const stripe = Stripe(
); const checkoutButton = document.getElementById('checkout-button'); checkoutButton.addEventListener('click', () => { stripe.redirectToCheckout({ // Make the id field from the Checkout Session creation API response // available to this file, so you can provide it as argument here // instead of the {{CHECKOUT_SESSION_ID}} placeholder. sessionId: '{{CHECKOUT_SESSION_ID}}' }) // If `redirectToCheckout` fails due to a browser or network // error, display the localized error message to your customer // using `error.message`. });'pk_test_TYooMQauvdEDq54NiTphI7jx'
Le client est redirigé vers success_url
une fois qu’il aura effectué le paiement.
Si vous devez traiter la commande de biens achetés après le paiement, consultez le guide Traitement des achats dans Checkout.
Abonnements dynamiques
Si vous fournissez des services d’abonnement qui sont déterminés de manière dynamique ou qui exigent la prise en charge d’autres fonctionnalités avancées, consultez le guide Configurer un abonnement.
Vous avez peut-être utilisé l’ancienne version de Checkout pour créer un jeton ou une source sur le client, et l’avez passé à votre serveur pour créer un client et un abonnement. L’intégration serveur de la version actuelle de Checkout inverse ce flux. Vous créez d’abord une session sur votre serveur, passez son identifiant à votre client, redirigez votre client vers Checkout, qui est ensuite à nouveau redirigé vers votre application en cas de succès.
Avant
Avec l’ancienne version de Checkout, vous affichiez les informations sur l’abonnement et collectiez les informations de carte auprès de votre client.
<form action="/subscribe" method="POST"> <script src="https://checkout.stripe.com/checkout.js" class="stripe-button" data-key=
data-name="Gold Tier" data-description="Monthly subscription with 30 days trial" data-amount="2000" data-label="Subscribe"> </script> </form>"pk_test_TYooMQauvdEDq54NiTphI7jx"
Ensuite, vous transmettiez le jeton ou la source qui en résultait à votre serveur pour créer un client et un abonnement.
Après
Avec la version actuelle de Checkout, commencez par créer une session Checkout sur votre serveur.
Remarques
Si vous utilisez l’une de nos bibliothèques Client, vous devez la mettre à niveau vers sa dernière version pour pouvoir utiliser l’API Checkout Sessions.
Ensuite, transmettez l’identifiant de la session à votre client et redirigez votre client vers Checkout pour effectuer le paiement.
const stripe = Stripe(
); const checkoutButton = document.getElementById('checkout-button'); checkoutButton.addEventListener('click', () => { stripe.redirectToCheckout({ // Make the id field from the Checkout Session creation API response // available to this file, so you can provide it as argument here // instead of the {{CHECKOUT_SESSION_ID}} placeholder. sessionId: '{{CHECKOUT_SESSION_ID}}' }) // If `redirectToCheckout` fails due to a browser or network // error, display the localized error message to your customer // using `error.message`. });'pk_test_TYooMQauvdEDq54NiTphI7jx'
Le client est redirigé vers success_url
une fois que le client et l’abonnement auront été créés.
Si vous devez traiter la commande de services achetés après le paiement, consultez traitement des achats dans Checkout.
Vous pouvez également mettre à jour vos informations d’abonnement dans Checkout.
Plateformes et places de marché Connect
Si vous exploitez une plateforme ou une place de marché Connect et créez des paiements impliquant des comptes connectés, envisagez d’utiliser la version actuelle de l’intégration serveur de Checkout. Suivez les instructions dans le guide Connect pour effectuer la migration de votre intégration.
L’exemple suivant illustre l’utilisation de l’API Checkout Sessions pour traiter un paiement direct. Suivez le guide Connect pour des informations détaillées sur la manière de créer des paiements indirects.
Avant
Avec l’ancienne version de Checkout, vous collectiez les informations de carte auprès de votre client côté client.
<form action="/purchase" method="POST"> <script src="https://checkout.stripe.com/checkout.js" class="stripe-button" data-key=
data-name="Food Marketplace" data-description="10 cucumbers from Roger's Farm" data-amount="2000"> </script> </form>"pk_test_TYooMQauvdEDq54NiTphI7jx"
Ensuite, vous transmettiez le jeton ou la source qui en résultait à votre serveur pour le paiement au nom du compte connecté.
Après
Avec la version actuelle de Checkout, créez d’abord une session Checkout sur votre serveur au nom du compte connecté.
Remarques
Si vous utilisez l’une de nos bibliothèques Client, vous devez la mettre à jour à sa dernière version pour pouvoir utiliser l’API Checkout Sessions.
Ensuite, transmettez l’identifiant de la session à votre client et redirigez votre client vers Checkout pour effectuer le paiement. Veillez à fournir l’identifiant du compte connecté lors de l’initialisation de Stripe.js.
// Initialize Stripe.js with the same connected account ID used when creating // the Checkout Session. const stripe = Stripe(
, { stripeAccount:'pk_test_TYooMQauvdEDq54NiTphI7jx'}); const checkoutButton = document.getElementById('checkout-button'); checkoutButton.addEventListener('click', () => { stripe.redirectToCheckout({ // Make the id field from the Checkout Session creation API response // available to this file, so you can provide it as argument here // instead of the {{CHECKOUT_SESSION_ID}} placeholder. sessionId: '{{CHECKOUT_SESSION_ID}}' }) // If `redirectToCheckout` fails due to a browser or network // error, display the localized error message to your customer // using `error.message`. });'{{CONNECTED_ACCOUNT_ID}}'
Le client est redirigé vers success_url
une fois qu’il aura effectué le paiement.
Si vous devez traiter la commande de biens ou de services achetés après le paiement, consultez traitement des achats dans Checkout.fill-orders).
Enregistrement de moyens de paiement pour utilisation ultérieure
Si vous fournissez à vos clients des services que vous ne facturez pas immédiatement, consultez le guide Configurer des paiements ultérieurs.
Vous avez peut-être utilisé l’ancienne version de Checkout pour créer un jeton ou une source sur le client, et l’avez passé à votre serveur afin de l’enregistrer pour utilisation ultérieure. L’intégration serveur de la version actuelle de Checkout inverse ce flux. Vous créez d’abord une session sur votre serveur, passez son identifiant à votre client, redirigez votre client vers Checkout, qui est ensuite à nouveau redirigé vers votre application en cas de succès.
Avant
Avec l’ancienne version de Checkout, vous affichiez les informations sur le paiement et collectiez les informations de carte auprès de votre client.
<form action="/subscribe" method="POST"> <script src="https://checkout.stripe.com/checkout.js" class="stripe-button" data-key=
data-name="Cleaning Service" data-description="Charged after your home is spotless" data-amount="2000"> </script> </form>"pk_test_TYooMQauvdEDq54NiTphI7jx"
Ensuite, vous transmettiez le jeton ou la source qui en résultait à votre serveur pour à terme créer un paiement.
Après
Avec la version actuelle de Checkout, créez d’abord une session Checkout sur votre serveur en utilisant le mode de configuration.
Remarques
Si vous utilisez l’une de nos bibliothèques Client, vous devez la mettre à jour à sa dernière version pour pouvoir utiliser l’API Checkout Sessions.
Ensuite, transmettez l’identifiant de la session à votre client et redirigez votre client vers Checkout pour recueillir les informations sur le moyen de paiement.
const stripe = Stripe(
); const checkoutButton = document.getElementById('checkout-button'); checkoutButton.addEventListener('click', () => { stripe.redirectToCheckout({ // Make the id field from the Checkout Session creation API response // available to this file, so you can provide it as argument here // instead of the {{CHECKOUT_SESSION_ID}} placeholder. sessionId: '{{CHECKOUT_SESSION_ID}}' }) // If `redirectToCheckout` fails due to a browser or network // error, display the localized error message to your customer // using `error.message`. });'pk_test_TYooMQauvdEDq54NiTphI7jx'
Le client est redirigé vers success_url
une fois qu’il aura exécuté le flux de paiement.
À ce stade, vous pouvez récupérer le Setup Intent du flux de paiement et l’utiliser pour préparer votre transaction.
Catalogue de produits simple avec tarification fixe
Si vous vendez des produits dont les prix sont fixes (tels que des t-shirts ou des livres numériques), consultez le guide sur les paiements ponctuels pour savoir comment générer un extrait de code à ajouter à votre site Web.
Vous avez peut-être utilisé l’ancienne version de Checkout pour créer un jeton ou une source sur le client, et l’avez passé à votre serveur pour créer un paiement. La version actuelle de Checkout crée automatiquement le paiement pour vous, et aucune intégration serveur n’est nécessaire.
Code côté client
Code côté serveur
Le tableau de conversion ci-dessous fournit une correspondance des options de configuration entre les deux versions de Checkout. Pour une liste complète des options de configuration pour la version actuelle, consultez la documentation de redirectToCheckout
.
Abonnements simples
Si vous fournissez un service d’abonnement simple (tel que l’accès mensuel à un logiciel), consultez le guide sur les abonnements pour savoir comment créer un plan dans le Dashboard et générer un extrait de code à ajouter à votre site Web.
Vous avez peut-être utilisé l’ancienne version de Checkout pour créer un jeton ou une source sur le client, et l’avez passé à votre serveur pour créer un client et un abonnement. Cependant, la version actuelle de Checkout crée automatiquement le client et l’abonnement pour vous, et aucune intégration serveur n’est nécessaire.
Code côté client
Code côté serveur
Le tableau de conversion ci-dessous fournit une correspondance des options de configuration entre les deux versions de Checkout. Pour une liste complète des options de configuration pour la version actuelle, consultez la documentation de redirectToCheckout
.
Conversion des paramètres
La version actuelle de Checkout prend en charge la plupart des fonctionnalités de l’ancienne version de Checkout. Les deux versions ne partagent toutefois pas la même API. Le tableau ci-dessous fournit une correspondance des paramètres et des options de configuration entre l’ancienne version et la version actuelle.
Pour obtenir une liste complète des options de configuration de la version actuelle de Checkout, consultez la documentation Stripe.js et la documentation sur les API pour Checkout Sessions.
Ancienne version | Version actuelle | Conseils pour l’intégration |
---|---|---|
allowRememberMe |
| La version actuelle de Checkout ne prend pas en charge la fonction « Se souvenir de moi ». Pour réutiliser des clients existants, nous vous recommandons de préciser le paramètre customer lors de la création d’une session Checkout. |
amount |
| Le montant total est la somme des postes que vous passez dans Checkout. |
billingAddress |
| Checkout recueille automatiquement l’adresse de facturation lorsqu’elle est requise à des fins de prévention de la fraude ou de réglementation. Configurez ce paramètre sur required pour recueillir systématiquement l’adresse de facturation. |
billingAddress |
| Checkout recueille automatiquement l’adresse de facturation lorsqu’elle est requise à des fins de prévention de la fraude ou de réglementation. Configurez ce paramètre sur required pour recueillir systématiquement l’adresse de facturation. |
closed |
| Lorsqu’un client veut fermer Checkout, il doit soit fermer l’onglet du navigateur, soit déplacer son curseur sur cancelUrl . |
currency |
| |
description |
| Si vous indiquez un prix, Checkout génère automatiquement une description pour la fréquence des paiements. Si vous définissez le paramètre Session.line_items , Checkout affiche le nom de chaque poste dans le paramètrename . |
email |
| Si vous connaissez déjà l’adresse de courriel de votre client, précisez-la ici pour ne pas avoir à la saisir de nouveau. |
image |
| Checkout utilise des images spécifiques pour la marque de votre entreprise et pour les produits que vous vendez. Checkout affiche votre logo d’entreprise par défaut et revient à l’icône de votre entreprise à côté du nom de votre entreprise. |
key |
| |
locale |
| Vous pouvez préciser un lieu pris en charge lorsque vous créez une session Checkout. |
name |
| Si vous indiquez un prix, Checkout affiche le nom du produit associé à ce prix. Si vous définissez le paramètre Session.line_items , Checkout affiche le name de chaque poste. |
panelLabel |
| Checkout personnalise automatiquement le texte du bouton en fonction des articles que vous vendez. Pour les paiements ponctuels, utilisez submit_type pour personnaliser le texte du bouton. |
shippingAddress |
| Collectez les informations relatives à l’adresse de livraison en transmettant un tableau contenant les pays autorisés allowed_countries vers lesquels vous souhaitez faire des livraisons. |
token ou source |
| Il n’y a plus de rappel en JavaScript lorsque le paiement est terminé. Comme votre client paie sur une page différente, définissez la successUrl pour rediriger votre client après qu’il a effectué le paiement. |
zipCode |
| Checkout recueille automatiquement le code postal lorsqu’il est requis à des fins de prévention de la fraude ou de réglementation. |