Accéder directement au contenu
Créez un compte
ou
connecter-vous
Logo de la documentation Stripe
/
Demander à l'assistant IA
Créez un compte
Connectez-vous
Démarrer
Paiements
Revenus
Plateformes et places de marché
Gestion de fonds
Ressources pour les développeurs

Intégrer la Fiche client

Laissez vos clients gérer leurs moyens de paiement enregistrés dans les paramètres de votre application.

Remarque

La fiche client est destinée à être utilisée sur la page des paramètres d’une application. Pour les paiements, utilisez le composant Mobile Payment Element, qui offre également une prise en charge intégrée de l’enregistrement et de l’affichage des moyens de paiement et prend en charge davantage de moyens de paiement que la fiche client.

La Fiche client est un composant d’interface utilisateur préconfiguré qui permet à vos clients de gérer leurs moyens de paiement enregistrés. Vous pouvez utiliser l’interface utilisateur de la Fiche client en dehors d’un flux de paiement. 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 enregistrés dans l’objet Customer, et définir leur moyen de paiement par défaut stocké localement sur l’appareil. Utilisez à la fois le Mobile Payment Element et la Fiche client afin de fournir aux clients une solution cohérente de bout en bout pour les moyens de paiement enregistrés.

Capture d'écran d'une fiche Client présentant plusieurs moyens de paiement enregistrés dans une application iOS.

CustomerAdapter utilise les clés éphémères de l’objet Customer et permet aux utilisateurs des anciens produits de faire la transition vers CustomerSheet plus rapidement. Si vous démarrez une nouvelle intégration, nous vous recommandons d’adopter CustomerSession plutôt que les clés éphémères pour l’objet Customer.

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

Créez deux endpoints sur votre serveur : l’un pour récupérer la clé éphémère d’un 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é éphémère associée. Vous pouvez consulter la version API utilisée par le SDK ici.
Command Line
curl
Ruby
Python
PHP
Node
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/ephemeral_keys \ -u
sk_test_BQokikJOvBiI2HlWgH4olfQ2
:
\ -X "POST" \ -d "customer"="{{CUSTOMER_ID}}" \
  1. Créez un endpoint pour renvoyer un SetupIntent configuré avec l’ID du Client.
Command Line
curl
Ruby
Python
PHP
Node
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.

Créer un CustomerAdapter
Côté client

Un StripeCustomerAdapter permet à une CustomerSheet de communiquer avec Stripe. Sur le client, configurez un StripeCustomerAdapter avec des prestataires qui envoient des requêtes à ces endpoints sur votre serveur.

import StripePaymentSheet let customerAdapter = StripeCustomerAdapter(customerEphemeralKeyProvider: { let json = await myBackend.getCustomerEphemeralKey() return CustomerEphemeralKey(customerId: json["customerId"]!, ephemeralKeySecret: json["ephemeralKeySecret"]!) }, setupIntentClientSecretProvider: { let json = await myBackend.getSetupIntentForCustomer() return json["setupIntentClientSecret"]! })

Configurer la fiche

Ensuite, configurez la Fiche client avec votre StripeCustomerAdapter et une CustomerSheet.Configuration.

var configuration = CustomerSheet.Configuration() // Configure settings for the CustomerSheet here. For example: configuration.headerTextForSelectionScreen = "Manage your payment method" let customerSheet = CustomerSheet(configuration: configuration, customer: customerAdapter)

Présenter la fiche

Présenter la Fiche client. Lorsque le client ferme la fiche client, celle-ci appelle le bloc d’exécution avec un 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

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

FacultatifPersonnaliser le formulaire

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