Accéder directement au contenu
Créez un compte ou connecter-vous
Logo de la documentation Stripe
/
Demander à l'assistant IA
Créez un compteConnectez-vous
Démarrer
Paiements
Revenus
Plateformes et marketplaces
Gestion de fonds
Ressources pour les développeurs
API et SDKAide
AperçuAccepter un paiementMettre votre intégration à niveau
Paiements en ligne
PrésentationTrouver votre cas d'usage
Utiliser Payment Links
Utiliser une page de paiement préconfiguré
Créer une intégration personnalisée avec Elements
Développer une intégration dans l'application
    Présentation
    Payment Sheet
    Payment Element
    Address Element
    Payment Method Messaging Element
    Utiliser les redirections pour les achats intégrés à l'application
    Gérer les moyens de paiement dans les paramètres
    Migrer vers les tokens de confirmation
    Cartes bancaires américaines et canadiennes
Utiliser Managed PaymentsPaiements récurrents
Paiements par TPE
Terminal
Moyens de paiement
Ajouter des moyens de paiement
Gérer les moyens de paiement
Paiement accéléré avec Link
Opérations de paiement
Analyses
Soldes et délai de règlement
Conformité et sécurité
Devises
Refus de paiement
Litiges
Prévention de la fraude
Radar pour la protection contre la fraude
Virements
ReçusRemboursements et annulations
Intégrations avancées
Tunnels de paiement personnalisés
Acquisition flexible
Orchestration multiprestataire
Au-delà des paiements
Constituez votre entreprise
Cryptomonnaies
Commerce agentique
Financial Connections
Climate
Vérifier l'identité
États-Unis
Français (France)
AccueilPaiementsBuild an in-app integration

Gestion des moyens de paiement dans les paramètres

Utilisez la feuille de réglages des moyens de paiement pour permettre à vos clients de gérer leurs moyens de paiement dans la page des paramètres de votre application.

Remarque

La feuille des paramètres des moyens de paiement est destinée à être utilisée sur une page de paramètres de l’application. Pour le checkout et les paiements, utilisez lesPaiements dans l’application, qui disposent également d’une prise en charge intégrée pour l’enregistrement et l’affichage des moyens de paiement et prend en charge davantage de moyens de paiement que la feuille des paramètres des moyens de paiement.

Remarque

Dans le code, ce composant est appelé CustomerSheet pour des raisons historiques. Dans la documentation, lorsque vous voyez CustomerSheet dans les exemples de code, cela fait référence à la feuille de paramètres des moyens paiements.

La feuille de paramètres des moyens de paiement est un composant d’interface utilisateur préconstruit qui permet à vos clients de gérer les moyens de paiement qu’ils ont enregistrés. Vous pouvez utiliser l’interface utilisateur de la feuille de configuration des moyens de paiement en dehors d’un tunnel de paiement, et l’apparence et le style sont personnalisables pour correspondre à l’apparence et à l’esthétique de votre application. Les clients peuvent ajouter et supprimer des moyens de paiement, qui sont sauvegardés dans l’objet Customer, et définir leur moyen de paiement par défaut sauvegardé localement sur l’appareil. Utilisez à la fois les paiements dans l’application et la feuille des paramètres des moyens de paiement pour offrir à vos clients une solution cohérente de bout en bout pour les moyens de paiement enregistrés.

Capture d'écran de la feuille des paramètres des moyens de paiement présentant plusieurs moyens de paiement enregistrés dans une application iOS.

L’objet CustomerSession accorde au SDK un accès temporaire à l’objet Customer et fournit des options de configuration supplémentaires. Ces options de configuration vous permettent de personnaliser le comportement de la CustomerSheet. Vous trouverez une liste complète des fonctionnalités exposées dans l’objet CustomerSession dans notre Documentation de l’API.

Configurer Stripe

Pour commencer, vous devez créer un compte Stripe. S’inscrire.

Le SDK iOS de Stripe est disponible en open source et fait l’objet d’une documentation complète. Il est également compatible avec les applications prenant en charge iOS 13 et les versions ultérieures.

Pour installer le SDK, veuillez suivre les étapes ci-dessous :

  1. Dans Xcode, sélectionnez File > Add Package Dependencies… puis saisissez https://github.com/stripe/stripe-ios-spm en tant qu’URL du référentiel.
  2. Sélectionnez le dernier numéro de version, visible sur notre page des versions.
  3. Ajoutez le produit StripePaymentSheet à la cible de votre application.

Remarque

Pour obtenir de plus amples informations sur la version la plus récente du SDK et ses versions antérieures, consultez la page des versions sur GitHub. Pour recevoir une notification lors de la publication d’une nouvelle version, surveillez les versions à partir du référentiel.

Configurez le SDK avec votre clé publiable Stripe au démarrage de votre application. Cela lui permet d’envoyer des requêtes à l’API Stripe.

AppDelegate.swift
Swift
No results
import UIKit import StripePaymentSheet @main class AppDelegate: UIResponder, UIApplicationDelegate { func application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey: Any]?) -> Bool { StripeAPI.defaultPublishableKey =
"pk_test_TYooMQauvdEDq54NiTphI7jx"
// do any other necessary launch configuration return true } }

Remarque

Utilisez vos clés de test lors de vos activités de test et de développement et vos clés du mode production pour la publication de votre application.

Activer des moyens de paiement

Affichez vos paramètres des moyens de paiement et activez les moyens de paiement que vous souhaitez prendre en charge. Vous devez activer au moins un moyen de paiement pour créer un SetupIntent.

Par défaut, Stripe active les cartes bancaires et les autres moyens de paiement courants qui peuvent vous permettre d’atteindre davantage de clients. Nous vous recommandons toutefois d’activer d’autres moyens de paiement pertinents pour votre entreprise et vos clients. Consultez la page Prise en charge des moyens de paiement pour en savoir plus sur la prise en charge des produits et des moyens de paiement, et notre page des tarifs pour prendre connaissance des frais que nous appliquons.

Remarque

CustomerSheet prend uniquement en charge les cartes, les comptes bancaires américains et les prélèvements automatiques SEPA.

Ajouter des endpoints Customer
Côté serveur

Comparer les références Customers v1 et Accounts v2

Si votre plateforme Connect utilise des comptes configurés par le client, consultez notre guide pour remplacer dans votre code les références Customer et événements par les références équivalentes de l’API Comptes v2.

Créez deux endpoints sur votre serveur : l’un pour récupérer la clé secrète d’un client de la session Client, et l’autre pour créer un SetupIntent afin d’enregistrer un nouveau moyen de paiement dans l’objet Customer.

  1. Créez un endpoint pour renvoyer un ID de client et une clé secrète du client de CustomerSession.
Command Line
curl
Ruby
Python
PHP
Node.js
Java
No results
# Create a Customer (skip this and get the existing Customer ID if this is a returning customer) curl https://api.stripe.com/v1/customers \ -u
sk_test_BQokikJOvBiI2HlWgH4olfQ2
:
\ -X "POST" curl https://api.stripe.com/v1/customer_sessions \ -u
sk_test_BQokikJOvBiI2HlWgH4olfQ2
:
\ -X "POST" \ -d "customer"="{{CUSTOMER_ID}}" \ -d "components[customer_sheet][enabled]"=true \ -d "components[customer_sheet][features][payment_method_remove]"=enabled

Remarque

Dans le cadre des intégrations avec des clés clients éphémères héritées, la valeur allow_redisplay des moyens de paiement enregistrés est définie sur unspecified. Pour afficher ces moyens de paiement en plus des moyens de paiement enregistrés lors de l’utilisation des sessions clients, définissez payment_method_allow_redisplay_filters sur ["unspecified", "always"]. Pour en savoir plus, consultez la page dédié aux sessions clients.

  1. Créez un endpoint pour renvoyer un SetupIntent configuré avec l’ID du Client.
Command Line
curl
Ruby
Python
PHP
Node.js
Java
No results
# Create a Customer (skip this and get the existing Customer ID if this is a returning customer) curl https://api.stripe.com/v1/customers \ -u
sk_test_BQokikJOvBiI2HlWgH4olfQ2
:
\ -X "POST" curl https://api.stripe.com/v1/setup_intents \ -u
sk_test_BQokikJOvBiI2HlWgH4olfQ2
:
\ -d "customer"="{{CUSTOMER_ID}}" \

Si vous prévoyez uniquement d’utiliser le moyen de paiement pour des paiements ultérieurs lorsque votre client est dans le tunnel de paiement, définissez le paramètre usage sur on_session pour améliorer les taux d’autorisation.

Configurer la fiche

Ensuite, configurez la feuille des paramètres des moyens de paiement à l’aide de la classe CustomerSheet avec IntentConfiguration, CustomerSessionClientSecretProvider et CustomerSheet.Configuration.

var configuration = CustomerSheet.Configuration() // Configure settings for the CustomerSheet here. For example: configuration.headerTextForSelectionScreen = "Manage your payment method" let intentConfiguration = CustomerSheet.IntentConfiguration(setupIntentClientSecretProvider: { let json = try await myBackend.createSetupIntent() return json["setupIntentClientSecret"]! }) let customerSheet = CustomerSheet( configuration: configuration, intentConfiguration: intentConfiguration, customerSessionClientSecretProvider: { let json = try await myBackend.createCustomerSessionClientSecret() return .init(customerId: json["customerId"]!, clientSecret: json["customerSessionClientSecret"]!) })

Présenter la fiche

Présentez la feuille des paramètres des moyens de paiement à l’aide de CustomerSheet. Lorsque le client ferme la feuille, CustomerSheet appelle le bloc de complétion avec CustomerSheet.SheetResult.

import StripePaymentSheet customerSheet.present(from: self, completion: { result in switch result { case .canceled(let paymentOption), .selected(let paymentOption): // Configure your UI based on the payment option self.paymentLabel.text = paymentOption?.displayData().label ?? "None" // Optional: Send the selected payment method ID to your backend for advanced use cases // like charging a customer when not present in your app if let paymentOption = paymentOption { switch paymentOption { case .paymentMethod(let paymentMethod, let paymentOptionDisplayData): MyBackend.setDefaultPaymentMethod(paymentMethod.stripeId) case .applePay(paymentOptionDisplayData: let paymentOptionDisplayData): MyBackend.setDefaultPaymentMethodIsApplePay() } } case .error(let error): // Show the error in your UI } })
  • Si le client sélectionne un moyen de paiement, le résultat est .selected(PaymentOptionSelection?). La valeur associée est le paramètre PaymentOptionSelection sélectionné, ou nil si l’utilisateur a supprimé le moyen de paiement précédemment sélectionné. Vous trouverez toutes les informations relatives au moyen de paiement dans la valeur associée paymentMethod de PaymentOptionSelection.
  • Si l’utilisateur annule la fiche, le résultat est .canceled. La valeur associée est le moyen de paiement d’origine sélectionné avant l’ouverture de la Fiche client, tant que ce moyen de paiement est encore disponible.
  • Si une erreur se produit, le résultat est .error(Error).

Découvrez comment activer Apple Pay.

FacultatifActiver les paiements ACH

Pour activer les paiements par prélèvements ACH :

  1. Incluez StripeFinancialConnections en tant que dépendance pour votre application.
  2. Activez le compte bancaire aux États-Unis comme moyen de paiement dans les paramètres du Dashboard.

FacultatifRécupérer le moyen de paiement sélectionné

Pour récupérer le moyen de paiement par défaut sans présenter la feuille des paramètres des moyens de paiement, appelez retrievePaymentOptionSelection() sur la CustomerSheet.

let paymentMethodOption = try await customerSheet.retrievePaymentOptionSelection() // Configure your UI based on the payment option self.paymentLabel.text = paymentOption?.displayData().label ?? "None" // Send the selected payment method ID to your backend switch paymentOption { case .paymentMethod(paymentMethod: let paymentMethod, paymentOptionDisplayData: let paymentOptionDisplayData): try await MyBackend.setDefaultPaymentMethod(paymentMethod.stripeId) case .applePay(paymentOptionDisplayData: let paymentOptionDisplayData): try await MyBackend.setDefaultPaymentMethodIsApplePay() }

FacultatifPersonnaliser le formulaire

Apparence

Personnalisez les couleurs, les polices et d’autres attributs d’apparence pour les adapter à l’apparence de votre application à l’aide de l’API Appearance.

Remarque

fetchPaymentMethods permet de filtrer l’affichage des moyens de paiement enregistrés, mais n’aura pas d’impact sur le type de moyens de paiement pouvant être ajoutés.

Informations de facturation par défaut

Si vous souhaitez définir des valeurs par défaut pour les informations de facturation collectées dans le formulaire de paiement, configurez la propriété defaultBillingDetails. La CustomerSheet préremplit ses champs avec les valeurs que vous fournissez.

var configuration = CustomerSheet.Configuration() configuration.defaultBillingDetails.address.country = "US" configuration.defaultBillingDetails.email = "foo@bar.com"

Collecte des informations de facturation

Utilisez billingDetailsCollectionConfiguration pour spécifier la manière dont vous souhaitez collecter les informations de facturation dans le PaymentSheet.

Vous pouvez récupérer le nom, l’adresse e-mail, le numéro de téléphone et l’adresse de votre client.

Pour associer des valeurs non collectées par la CustomerSheet, ajoutez-les à la propriété defaultBillingDetails et définissez billingDetailsCollectionConfiguration.attachDefaultsToPaymentMethod sur true. Assurez-vous de suivre cette étape si vous ne prévoyez pas de collecter les valeurs requises par le moyen de paiement.

var configuration = CustomerSheet.Configuration() configuration.defaultBillingDetails.email = "foo@bar.com" configuration.billingDetailsCollectionConfiguration.name = .always configuration.billingDetailsCollectionConfiguration.email = .never configuration.billingDetailsCollectionConfiguration.address = .full configuration.billingDetailsCollectionConfiguration.attachDefaultsToPaymentMethod = true

Remarque

Consultez votre équipe juridique au sujet des lois qui s’appliquent à la collecte d’informations. Ne recueillez les numéros de téléphone que si vous en avez besoin pour la transaction.

Cette page vous a-t-elle été utile ?
OuiNon
  • Besoin d'aide ? Contactez le service Support.
  • Consultez notre log des modifications.
  • Des questions ? Contactez l'équipe commerciale.
  • LLM ? Lire llms.txt.
  • Propulsé par Markdoc