Payment Element est un composant d'interface utilisateur intégrable sécuritaire qui vous permet d'accepter des moyens de paiement locaux du monde entier.
Afin d'aider les utilisateurs des paiements ponctuels ou récurrents à accepter plusieurs moyens de paiement différents, Payment Element prend en charge 3 chemins d'intégration :
Paiements ponctuels par le biais de PaymentIntents
vous trouverez le guide d'intégration ici : https://stripe.com/docs/stripe-js/payment-element/accept-a-payment
Paiements d'abonnement par le biais de PaymentIntents
vous trouverez le guide d'intégration ici : https://stripe.com/docs/billing/subscriptions/elements#collect-payment
Paiements d'abonnement par le biais de SetupIntents
vous trouverez le guide d'intégration ici : https://stripe.com/docs/stripe-js/payment-element/set-up-payment
Avec Payment Element, Stripe lance une nouvelle génération d'Elements (voir : https://stripe.com/payments/elements). Avant Payment Element, les marchands devaient créer et gérer une nouvelle intégration pour chaque moyen de paiement distinct. Puisque cela n'est plus nécessaire, Payment Element vous permettra de gagner du temps et d'économiser des ressources.
Voir certaines des principales fonctionnalités de Payment Element ci-dessous :
- Prend en charge plusieurs moyens de paiement avec une intégration d'Element unique
- Propose des options de paiement pertinentes à chaque client grâce à une logique axée sur le pays du client (à partir de l'adresse IP) et la langue préférée (à partir de la langue du navigateur)
- Traduit en 42 langues : https://stripe.com/docs/js/appendix/supported_locales
- Peut être adapté à la marque du marchand (polices, couleurs, espacement, etc.)
- Compatible avec les appareils mobiles
- Intègre la validation de la saisie
- Est conforme à la certification PCI-DSS
- Est compatible avec PaymentIntents/SetupIntents
Stripe Elements est un ensemble de composants d'interface utilisateur préconfigurés, comme des champs de saisie et des boutons, servant à créer votre flux de paiement. Chaque moyen de paiement (cartes de crédit, cartes de débit, etc.) est associé à un Element. Payment Element est un nouveau composant qui allie les Elements de moyens de paiement individuels à un Element unique.
Voici ce qui distingue Stripe Elements de Payment Element :
Auparavant, lorsqu'il utilisait Elements, un marchand devait créer et maintenir un mappage des devises/pays/moyens de paiement et une logique associée quant au moment d'appeler les API de Stripe dans l'application dorsale et afficher/masquer des Elements sur l'interface utilisateur. Cela nécessitait d'intégrer chaque Element individuellement.
Grâce à Payment Element, le marchand peut ne plus avoir besoin de créer et de gérer ces aspects. L'expérience d'intégration commence à donner l'impression qu'une intégration d'Element unique, les mappages, la logique, la présentation et le comportement sont préconfigurés par Stripe. En revanche, la couche de l'interface utilisateur sera légèrement moins personnalisable que celle de Stripe Elements; toutefois, elle offrira un plus grand contrôle que Stripe Checkout.
Plus précisément, voici les principales différences :
- Payment Element nécessite presque autant d'efforts à intégrer qu'un autre Element (p. ex. Card Element), mais beaucoup moins pour la maintenance, puisque des moyens de paiement peuvent être ajoutés sans devoir les intégrer individuellement dans un autre Element.
- La capacité de personnaliser le style est plus limitée comparativement à Elements à l'heure actuelle, notre API de style JavaScript étant la seule prise en charge (et non CSS). Toutefois, la majorité des fonctionnalités de style demeurent prises en charge.
- Puisque la confirmation côté serveur n'est pas prise en charge, les cartes de crédit nécessiteront l'utilisation de webhooks (ce qui n'est pas le cas avec Elements à l'heure actuelle). Nous allons néanmoins prendre en charge le contournement à cet effet dans Cards.
- La redirection vers une page de confirmation de commande est requise pour la plupart des moyens de paiement acceptés avec Payment Element; par conséquent, les applications Web tenant sur une seule page devront ajouter une page distincte pour confirmer la commande. L'expérience de paiement demeure toutefois intégrée à même le site du marchand (contrairement à Stripe Checkout).
Payment Element est un nouveau composant d'interface utilisateur pouvant être placé sur le site Web d'un marchand, une expérience stylisée avec le logo de la marque du marchand. Cela vous permet d'offrir de nombreux moyens de paiement (plus de 18) avec beaucoup moins d'efforts pour collecter automatiquement les informations nécessaires auprès des clients (sauf l'adresse de livraison). Payment Element utilise les API de Stripe (PaymentIntents/SetupIntents) pour fonctionner et est conçu à partir de notre SDK, Stripe.js. Ce produit est conçu pour les marchands qui souhaitent contrôler l'expérience de paiement offerte. Plus précisément, si vous cherchez à intégrer entièrement les paiements au sein de votre application Web (c.-à-d. flux à plusieurs étapes, souci de l'image de marque, besoin d'un contrôle accru, présence de conditions de paiement particulières), alors Payment Element est fait pour vous. Payment Element vous permet de collecter tous les renseignements nécessaires lors du paiement et de concevoir l'expérience que vous souhaitez.
Par ailleurs, Stripe Checkout est notre page de paiement totalement hébergée qui permet également d'offrir des LPM (25 et +) auxquelles votre site peut être redirigé, mais propose des options de style limitées (couleur/logo). Stripe Checkout utilise les sessions Checkout pour fonctionner et n'utilise pas Payment Intent ou Setup Intent. Il est conçu pour des cas d'utilisation plus simples, c.-à-d. un flux à une seule étape avec un moins grand besoin de contrôle, de personnalisation ou d'adaptation à la marque. Stripe Checkout offre et collecte plus d'informations, notamment l'adresse de livraison, et affiche une liste de produits, un total de facture et un bouton d'envoi, ce qui n'est pas le cas de Payment Element.
Payment Element nécessite presque autant d'efforts à intégrer qu'un Element unique (p. ex. Card Element), mais beaucoup moins pour la maintenance. Si vous souhaitez offrir d'autres moyens de paiement, vous n'avez pas à intégrer d'Element pour chaque option.
Payment Element est offert aux utilisateurs sans coût additionnel. Les seuls coûts associés sont ceux pour chaque moyen de paiement qu'ils acceptent (consultez https://stripe.com/pricing/local-payment-methods).
Payment Element est pris en charge par PaymentIntents et SetupIntents. Les anciennes API comme Charges et Sources ne sont pas prises en charge.
Oui, vous devez utiliser des webhooks avec Payment Element, car la confirmation côté serveur n'est pas prise en charge.
Nous pouvons néanmoins prendre en charge un contournement à cet effet pour les moyens de paiement qui ne nécessitent pas de redirections comme les cartes. Le code pour y parvenir est disponible ici : https://stripe.com/docs/js/payment_intents/confirm_payment#confirm_payment_intent-options-redirect
Pour utiliser Payment Element pour offrir tous les moyens de paiement pris en charge par Stripe, vous pouvez transmettre un tableau des moyens de paiement à payment_method_types lorsque vous créez un PaymentIntent. Néanmoins, vous ne pouvez pas transmettre tous les moyens de paiement en même temps, car certains d'entre eux nécessitent différentes devises. Vous pouvez seulement créer un PaymentIntent avec les moyens de paiement qui prennent en charge la même devise. Veuillez consulter le tableau d'aide sur les moyens de paiement et produits accessible ici : https://stripe.com/docs/payments/payment-methods/integration-options
La version mobile de Payment Element, ou la classe Payment Sheet en langage codé, est un composant d'interface utilisateur préconfiguré sécurisé qui affiche plusieurs moyens de paiement du monde entier (cartes, portefeuilles numériques, prélèvements bancaires, redirections vers l'institution financière, BNPL, etc.). Elle est similaire à Payment Element sur le web, mais est destinée à être utilisée dans les applications mobiles. L'interface de paiement se présente comme une « feuille inférieure » (semblable à Apple et Google Pay) et elle est intégrée au SDK mobile de Stripe. Ce produit aidera les marchands Stripe à augmenter le taux de conversion et à réduire les frais liés aux paiements, tout en se rapprochant des objectifs d'entreprise de Stripe en ce qui a trait à l'adoption de moyens de paiements autres que les cartes. Pour en savoir plus, consultez : https://stripe.com/docs/payments/accept-a-payment?platform=ios