# Intégration complète de la plateforme Connect Offrir des fonctionnalités Connect à vos comptes connectés par l'intermédiaire de votre propre site Web. Les composants intégrés Connect vous permettent d’ajouter des fonctionnalités gérées par Stripe à une interface personnalisée que vous fournissez à vos comptes connectés, tels que ceux des plateformes SaaS et des marketplaces. Ils peuvent y effectuer des opérations liées au paiement directement au lieu de passer par le Dashboard de Stripe. Dans le cadre d’une intégration totalement intégrée : - Les comptes connectés accèdent aux données, formulaires et notifications liés à Stripe via des composants intégrés à l’application de votre plateforme. Ils n’ont pas accès à un Dashboard Stripe. - Stripe gère le risque de crédit et de fraude sur vos comptes connectés. Pour toute action relative au risque ou à la conformité, nous communiquons directement avec les comptes connectés et ils répondent en interagissant avec les composants intégrés. - Les notifications par e-mail de Stripe dirigent vos comptes connectés vers les composants intégrés de votre site Web afin qu’ils vérifient leurs informations ou effectuent les actions requises. Vous devez donc fournir à Stripe les URL de ces composants. ## Voir le site de démonstration Nous avons créé un [site de démonstration complet pour notre entreprise fictive, Furever](http://furever.dev). Furever est une plateforme qui fournit aux toiletteurs un logiciel permettant d’encaisser des paiements. Dans cette démo, vous pouvez interagir avec plusieurs composants intégrés, dont l’inscription de compte et la gestion du compte. ## Avant de commencer Avant de pouvoir créer une intégration embarquée, vous devez remplir les conditions préalables suivantes : 1. [Inscrire votre plateforme](https://dashboard.stripe.com/connect). 1. Ajoutez des informations sur l’entreprise pour [activer votre compte](https://dashboard.stripe.com/account/onboarding). 1. [Complétez votre profil de plateforme](https://dashboard.stripe.com/connect/settings/profile). 1. [Personnalisez vos paramètres de marque](https://dashboard.stripe.com/settings/connect/stripe-dashboard/branding). Connect Onboarding nécessite l’ajout d’un nom d’entreprise, d’une icône et d’une couleur de marque. Vous devez également décider si votre plateforme sera responsable des tarifs, auquel cas Stripe perçoit les frais de paiement de votre plateforme et vous facturez vos comptes connectés. Dans le cas contraire, Stripe contrôle la tarification et perçoit les frais de paiement directement auprès de vos comptes connectés. ## Créer un compte connecté Dans l’exemple ci-dessous, on crée un compte connecté pour lequel Stripe [gère les risques](https://docs.stripe.com/connect/risk-management.md), contrôle les tarifs et assume la responsabilité des exigences liées à l’onboarding. Votre plateforme utilise des composants intégrés et n’est pas responsable des soldes négatifs des comptes connectés. Vos comptes connectés n’ont pas accès aux Dashboards hébergés par Stripe. > Parce que Stripe gère les prix dans cet exemple, vous devez intégrer le [composant intégré Documents](https://docs.stripe.com/connect/supported-embedded-components/documents.md). De plus, Stripe notifie les comptes connectés par e-mail lorsque leurs factures fiscales ou formulaires 1099 sont prêts à être téléchargés. Si vous créez des comptes où votre plateforme contrôle les prix, le composant Documents n’est pas requis, et Stripe n’envoie pas de notifications aux comptes connectés concernant les factures fiscales ou les 1099. Après l’inscription du compte, vous pouvez demander des fonctionnalités supplémentaires, telles que des moyens de paiement spécifiques. Appelez [/v1/comptes](https://docs.stripe.com/api/accounts/create.md) avec les paramètres suivants : - `country` du compte - `controller.stripe_dashboard.type` = `none` - Demander les fonctionnalités `card_payments` et `transfers` ```curl curl https://api.stripe.com/v1/accounts \ -u "<>:" \ -d country=US \ -d "controller[stripe_dashboard][type]=none" \ -d "capabilities[card_payments][requested]=true" \ -d "capabilities[transfers][requested]=true" ``` ```json { "id": ""{{CONNECTED_ACCOUNT_ID}}"", "object": "account", "controller": { "type": "application", "is_controller": true, "losses": {"payments": "stripe"}, "fees": {"payer": "account"}, "requirement_collection": "stripe", "stripe_dashboard": { "type": "none" } }, "type": "none", ... } ``` ## Configurer les composants intégrés Les comptes connectés accèdent à leurs comptes et aux fonctionnalités principales de paiement directement via votre plateforme, sans avoir accès au Dashboard hébergé par Stripe. Vous devez donc fournir l’accès à certaines fonctionnalités depuis votre site web. Votre intégration doit comprendre les composants intégrés suivants : - [Onboarding des comptes](https://docs.stripe.com/connect/supported-embedded-components/account-onboarding.md) - [Gestion de compte](https://docs.stripe.com/connect/supported-embedded-components/account-management.md) - [Barre de notification](https://docs.stripe.com/connect/supported-embedded-components/notification-banner.md) - [Documents](https://docs.stripe.com/connect/supported-embedded-components/documents.md) (lorsque Stripe prélève directement ses frais auprès des comptes connectés) Votre intégration doit également permettre de répondre aux litiges en fournissant des preuves pour chaque paiement. Cela peut se faire[via notre API](https://docs.stripe.com/disputes/api.md) ou grâce à un composant intégré ([Paiements](https://docs.stripe.com/connect/supported-embedded-components/payments.md), [informations de paiement](https://docs.stripe.com/connect/supported-embedded-components/payment-details.md), ou [litiges pour un paiement](https://docs.stripe.com/connect/supported-embedded-components/disputes-for-a-payment.md)). Nous vous recommandons de prévoir un moyen permettant aux comptes connectés d’ajouter des fonds si nécessaire, afin d’éviter un solde négatif et de prévenir toute interruption d’activité.Vous pouvez le mettre en place en utilisant un composant intégré ([Soldes](https://docs.stripe.com/connect/supported-embedded-components/balances.md) ou [Versements](https://docs.stripe.com/connect/supported-embedded-components/payouts.md)). Vous pouvez également ajouter des [composants intégrés supplémentaires](https://docs.stripe.com/connect/supported-embedded-components.md) ou créer vos propres interfaces utilisateur à l’aide de nos API. Assurez-vous de [configurer des composants intégrés](https://docs.stripe.com/connect/get-started-connect-embedded-components.md) avant l’onboarding des comptes connectés. ## Bonnes pratiques Pour maximiser l’efficacité de votre intégration, envisagez les stratégies suivantes : 1. **Priorité à l’utilisateur** : assurez-vous que le processus d’intégration est intuitif en utilisant le composant d’ [onboarding des comptes](https://docs.stripe.com/connect/supported-embedded-components/account-onboarding.md) pour guider les utilisateurs lors de la création et de la gestion de leur compte, en décomposant le processus en étapes simples et en fournissant des instructions claires. 1. **Invite pour la conformité** : utilisez le composant [bannière de notification](https://docs.stripe.com/connect/supported-embedded-components/notification-banner.md) pour tenir les utilisateurs au courant de leur statut de conformité et des éventuelles exigences en attente. Placez la bannière de manière visible dans votre application, par exemple sur la page d’accueil de votre Dashboard, afin qu’elle soit bien visible et incite à effectuer rapidement les actions nécessaires sur la documentation ou les mises à jour requises. 1. **Conception réactive** : assurez-vous que les composants que vous intégrez sont réactifs sur tous les appareils. Étant donné que les comptes connectés peuvent accéder à votre plateforme depuis divers appareils, y compris des téléphones mobiles, assurez-vous que les interfaces d’inscription et de gestion fonctionnent correctement sur différentes tailles d’écran. 1. **Authentification et sécurité des utilisateurs** : mettez en place des [mesures d’identification](https://docs.stripe.com/connect/get-started-connect-embedded-components.md?platform=web#user-authentication-in-connect-embedded-components) renforcées pendant les processus d’onboarding et de gestion des comptes. Bien que l’identification Stripe protège les informations sensibles du compte et la possibilité de modifier les détails du virement, d’autres informations sensibles dépendent uniquement de l’authentification et la sécurité de votre produit. Vous pouvez améliorer la sécurité globale en utilisant des méthodes telles que les codes SMS à usage unique ou l’authentification à deux facteurs. 1. **Mécanismes de retour d’information** : intégrez des options de retour d’information au sein de votre flux d’inscription et de vos composants de gestion. Permettez aux utilisateurs de signaler des problèmes ou de suggérer des améliorations, ce qui vous permettra d’améliorer continuellement la plateforme en fonction de leurs retours. 1. **Engagement proactif** : encouragez les utilisateurs à maintenir leurs comptes actifs en envoyant des rappels ou des alertes sur les obligations de conformité par e-mail ou via des notifications sur la plateforme. Cette approche proactive peut aider à prévenir les suspensions de compte et à réduire la frustration des utilisateurs. ## Inscrire des comptes connectés Stripe utilise une [session de comptes](https://docs.stripe.com/api/account_sessions.md) pour indiquer votre intention de donner l’accès au composant intégré au compte connecté. Grâce à une `AccountSession`, le composant intégré de création de compte collecte toutes les informations requises en fonction des capacités demandées. ### Préremplir les informations du compte Vous pouvez simplifier le processus d’onboarding pour vos comptes connectés en pré-remplissant les propriétés du `Account` avec les informations déjà connues avant de créer un `AccountSession`. Le composant d’onboarding ne demande pas les informations déjà présentes sur l’`Account`. Pré-remplissez autant de données que possible (informations sur l’entreprise, l’individu et le compte externe) en suivant ces étapes : 1. Utilisez l’outil d’[information de vérification requis](https://docs.stripe.com/connect/required-verification-information.md) pour en savoir plus sur les exigences applicables à vos comptes connectés, établies en fonction de leur emplacement, type d’entreprise et fonctionnalités demandées. 1. Collecter les informations préremplissables correspondant aux exigences. 1. Fournissez les informations collectées lors de la création du `Account` ou ajoutez-les avant l’onboarding en mettant à jour le `Account`. Après avoir créé un `Account` et demandé ses fonctionnalités, vous pouvez vérifier ses exigences spécifiques en examinant sa propriété [Exigences](https://docs.stripe.com/api/accounts/object.md#account_object-requirements). Comme votre plateforme n’est pas responsable des soldes négatifs, votre accès à certaines informations des comptes connectés, comme les comptes de paiement ou les informations sur l’entité juridique, est limité. Une fois qu’un compte connecté a terminé l’onboarding via le composant intégré Account Onboarding, votre plateforme ne peut plus modifier ces propriétés. Les mises à jour doivent être effectuées par le compte connecté lui-même. ### Inscrire des utilisateurs via le composant d’inscription intégré Consultez le [site de démonstration Furever](https://furever.dev) pour voir un exemple d’intégration du composant d’onboarding. Les comptes connectés doivent s’inscrire et fournir les informations requises pour activer les paiements et les versements. Pour inscrire un compte connecté, intégrez le [composant d’inscription intégré](https://docs.stripe.com/connect/supported-embedded-components/account-onboarding.md) sur votre site web et redirigez-y les nouveaux comptes. ### Créer une session de compte Lorsque vous [créez une session de compte](https://docs.stripe.com/api/account_sessions/create.md), activez l’inscription des comptes en spécifiant `account_onboarding` dans le paramètre `components`. ```curl curl https://api.stripe.com/v1/account_sessions \ -u "<>:" \ -d "account={{CONNECTEDACCOUNT_ID}}" \ -d "components[account_onboarding][enabled]=true" ``` ### Affichage du composant d’inscription de compte Après avoir créé la session de compte et [initialisé ConnectJS](https://docs.stripe.com/connect/get-started-connect-embedded-components.md#account-sessions), vous pouvez afficher le composant d’inscription de compte dans le front-end : #### JavaScript ```js // Include this element in your HTML const accountOnboarding = stripeConnectInstance.create('account-onboarding'); accountOnboarding.setOnExit(() => { console.log('User exited the onboarding flow'); }); container.appendChild(accountOnboarding); // Optional: make sure to follow our policy instructions above // accountOnboarding.setFullTermsOfServiceUrl('{{URL}}') // accountOnboarding.setRecipientTermsOfServiceUrl('{{URL}}') // accountOnboarding.setPrivacyPolicyUrl('{{URL}}') // accountOnboarding.setCollectionOptions({ // fields: 'eventually_due', // futureRequirements: 'include', // requirements: { // exclude: ['business_profile.product_description'] // } // }) // accountOnboarding.setOnStepChange((stepChange) => { // console.log(`User entered: ${stepChange.step}`); // }); ``` Présentez le flux d’onboarding au propriétaire principal du compte. Le propriétaire principal configure l’authentification à Stripe et l’utilisateur peut modifier les informations du compte et réagir en cas de risque. Le compte connecté ne dispose que d’un seul ensemble d’identifiants Stripe. L’utilisateur disposant d’identifiants peut s’authentifier à l’aide de codes temporaires envoyés par SMS pour effectuer des actions plus sensibles, comme mettre à jour les comptes bancaires de destination des virements ou fournir des informations à jour sur l’entité juridique. ### Écouter les événements d’onboarding Au fur et à mesure que le compte connecté progresse dans l’inscription, des événements [account.updated](https://docs.stripe.com/api/events/types.md#event_types-account.updated) sont également envoyés à vos [webhooks Connect](https://docs.stripe.com/connect/webhooks.md). Lorsque le compte a terminé de fournir ses informations, la propriété `details_submitted` de l’`Account` passe à true. Vérifiez le statut en recherchant `details_submitted: true` idans le corps de l’événement `account.updated` dans votre gestionnaire de webhook ou en [récupérant le Compte](https://docs.stripe.com/api/account/retrieve.md). Si `details_submitted` est false, affichez à nouveau le composant d’onboarding intégré. Le composant ignore les informations déjà soumises et collecte uniquement les exigences non remplies. Lorsqu’un compte connecté soumet ses informations et termine le parcours d’intégration, le composant intégré d’onboarding appelle le gestionnaire `onExit` que vous avez [défini lors de l’affichage du composant](https://docs.stripe.com/connect/supported-embedded-components/account-onboarding.md). Utilisez ce callback pour orienter le compte vers l’action suivante. Si vous ne définissez pas de gestionnaire de sortie, ou n’y effectuez aucune action, le compte voit un message de confirmation sans indication claire de la prochaine étape. ### Demander des fonctionnalités supplémentaires (facultatif) Votre plateforme peut continuer à [demander des fonctionnalités supplémentaires](https://docs.stripe.com/connect/account-capabilities.md#creating) après l’intégration d’un compte connecté. Par exemple, vous devez demander les fonctionnalités correspondant à tous les moyens de paiement que vous souhaitez activer pour un compte. Si l’une des fonctionnalités demandées nécessite des informations supplémentaires, le compte connecté reçoit une notification par le biais de la [barre de notification intégrée](https://docs.stripe.com/connect/build-full-embedded-integration.md#embed-the-notification-banner). ## Gérer les mises à jour régulières relatives à la conformité et aux risques Comme Stripe gère le risque de crédit et de fraude pour vos comptes connectés, vos comptes doivent pouvoir voir et répondre aux alertes de Stripe. Pour cela, votre plateforme doit intégrer la barre de notification et le composant intégré de gestion de compte. Pour en savoir plus sur la manière dont Stripe prend en charge vos comptes connectés via ces composants, consultez l’[assistance intégrée Connect](https://docs.stripe.com/connect/embedded-support.md). ## Intégrer la bannière de notification Stripe utilise le [composant intégré de barre de notification](https://docs.stripe.com/connect/supported-embedded-components/notification-banner.md) pour informer les comptes connectés des exigences de conformité en attente et d’autres [demandes liées aux risques](https://docs.stripe.com/connect/embedded-risk.md). Répondre à ces notifications permet au compte de rester conforme, afin de pouvoir traiter les paiements et recevoir des fonds. Si aucune notification n’est en attente, le notification banner intégré ne s’affiche pas. Intégrez la bannière de notification dans un emplacement bien visible et facilement accessible sur votre site web. Par exemple, vous pouvez la placer en haut de votre page de paiements. ### Créer une session de compte Lorsque vous [créez une session de compte](https://docs.stripe.com/api/account_sessions/create.md), activez la bannière de notification en spécifiant `notification_banner` dans le paramètre `components`. ```curl curl https://api.stripe.com/v1/account_sessions \ -u "<>:" \ -d "account={{CONNECTEDACCOUNT_ID}}" \ -d "components[notification_banner][enabled]=true" \ -d "components[notification_banner][features][external_account_collection]=true" ``` ### Afficher le composant de bannière de notification #### JavaScript ```js // Include this element in your HTML const notificationBanner = stripeConnectInstance.create('notification-banner'); container.appendChild(notificationBanner); // Optional: // notificationBanner.setCollectionOptions({ // fields: 'eventually_due', // futureRequirements: 'include', // }) ``` Pour répondre à une bannière de notification, le compte peut cliquer sur un bouton dans la notification. Il n’est pas nécessaire de les rediriger vers le composant intégré de gestion de compte. ## Gestion de compte intégrée Stripe exige [le composant intégré de gestion de compte](https://docs.stripe.com/connect/supported-embedded-components/account-management.md) pour la gestion des risques. Intégrez ce composant sur votre site web à l’endroit où un compte met à jour ses paramètres ou son profil. ### Créer une session de compte Lorsque vous [créez une session de compte](https://docs.stripe.com/api/account_sessions/create.md), activez la gestion des comptes en spécifiant `account_management` dans le paramètre `components`. ```curl curl https://api.stripe.com/v1/account_sessions \ -u "<>:" \ -d "account={{CONNECTEDACCOUNT_ID}}" \ -d "components[account_management][enabled]=true" \ -d "components[account_management][features][external_account_collection]=true" ``` ### Afficher le composant de gestion de compte #### JavaScript ```js // Include this element in your HTML const accountManagement = stripeConnectInstance.create('account-management'); container.appendChild(accountManagement); // Optional: // accountManagement.setCollectionOptions({ // fields: 'eventually_due', // futureRequirements: 'include', // }) ``` Ce composant permet à un compte de mettre à jour ses informations, de répondre aux exigences de conformité et de mettre à jour ses identifiants d’authentification. ## Intégration de paiement Configurez l’intégration de paiement après avoir intégré les composants requis. Vous pouvez ajouter des composants intégrés pour les paiements et les virements à votre plateforme ou créer vos propres flux. Configurez les [webhooks Connect](https://docs.stripe.com/connect/webhooks.md) et surveillez l’événement `account.updated`. Un compte connecté est prêt à recevoir des paiements lorsque sa propriété`charges_enabled` est définie sur true. ## Inclure des paiements et des virements intégrés Ajoutez les composants intégrés de [paiements](https://docs.stripe.com/connect/supported-embedded-components/payments.md) et de [versements](https://docs.stripe.com/connect/supported-embedded-components/payouts.md) à votre plateforme *avant* de créer votre intégration de paiements. Ainsi, un compte connecté pourra facilement accéder à ses flux de paiements principaux et les gérer. Le composant de paiement affiche la liste des paiements du compte connecté et inclut des options de filtrage ainsi que des vues détaillées pour chaque paiement. Un compte peut émettre des remboursements et répondre à des litiges avec des preuves sur des paiements individuels via ce composant. Si vous choisissez de créer et maintenir une liste de paiements entièrement personnalisée et pilotée par API, vous pouvez toujours activer les remboursements et la gestion des litiges en utilisant soit le composant des [informations de paiement](https://docs.stripe.com/connect/supported-embedded-components/payment-details.md), le composant de [litiges pour un paiement](https://docs.stripe.com/connect/supported-embedded-components/disputes-for-a-payment.md), ou nos [API](https://docs.stripe.com/disputes/api.md). ## Créer une session de compte Lorsque vous [créez une session de compte](https://docs.stripe.com/api/account_sessions/create.md), activez le composant paiements intégrés en spécifiant les `payments` dans le paramètre `components`. Vous pouvez activer ou désactiver une fonctionnalité individuelle du composant paiements en spécifiant le paramètre `features` sous `payments` : ```curl curl https://api.stripe.com/v1/account_sessions \ -u "<>:" \ -d "account={{CONNECTEDACCOUNT_ID}}" \ -d "components[payments][enabled]=true" \ -d "components[payments][features][refund_management]=true" \ -d "components[payments][features][dispute_management]=true" \ -d "components[payments][features][capture_payments]=true" \ -d "components[payments][features][destination_on_behalf_of_charge_management]=false" ``` Vos comptes connectés peuvent consulter l’ensemble des informations relatives aux paiements directs. Ils peuvent également gérer les remboursements et les litiges et capturer des paiements si vous activez les fonctions correspondantes lors de la création d’une session de compte. ## Afficher le composant de paiement Après avoir créé la session de compte et initialisé [ConnectJS](https://docs.stripe.com/connect/get-started-connect-embedded-components.md#account-sessions), vous pouvez effectuer le rendu du composant de paiement dans la partie frontale : #### JavaScript ```js // Include this element in your HTML const payments = stripeConnectInstance.create('payments'); container.appendChild(payments); // Optional: specify filters to apply on load // payments.setDefaultFilters({ // amount: {greaterThan: 100}, // date: {before: new Date(2024, 0, 1)}, // status: ['partially_refunded', 'refund_pending', 'refunded'], // paymentMethod: 'card',}); ``` Le composant de virements affiche les virements récents du compte connecté, son solde actuel et la date à laquelle les fonds seront disponibles. Lors de la [création d’une session de compte](https://docs.stripe.com/api/account_sessions/create.md), activez le composant de virement intégré en spécifiant `payouts` dans le paramètre `components`. Vous pouvez activer ou désactiver les fonctionnalités individuelles du composant de virement en spécifiant le paramètre `features` sous `payouts` : ```curl curl https://api.stripe.com/v1/account_sessions \ -u "<>:" \ -d "account={{CONNECTEDACCOUNT_ID}}" \ -d "components[payouts][enabled]=true" \ -d "components[payouts][features][instant_payouts]=true" \ -d "components[payouts][features][standard_payouts]=true" \ -d "components[payouts][features][edit_payout_schedule]=true" \ -d "components[payouts][features][external_account_collection]=true" ``` Après avoir créé la session du compte et [initialisé ConnectJS](https://docs.stripe.com/connect/get-started-connect-embedded-components.md#account-sessions), vous pouvez générer le rendu du composant de virement dans le front-end : #### JavaScript ```js // Include this element in your HTML const payouts = stripeConnectInstance.create('payouts'); container.appendChild(payouts); ``` Pour un guide complet sur l’implémentation des composants intégrés, suivez le[ guide de démarrage rapide pour l’intégration des composants Connect intégrés.](https://docs.stripe.com/connect/connect-embedded-components/quickstart.md) ## Accepter un paiement Si vos comptes connectés effectuent des transactions directement avec les clients, utilisez les [paiements directs](https://docs.stripe.com/connect/direct-charges.md). Stripe applique des frais de transaction de paiement à votre plateforme lorsque `controller.fees.payer` n’est pas défini sur `account` pour [Account](https://docs.stripe.com/api/accounts/object.md). Vous êtes ensuite responsable de facturer les frais de traitement des paiements à vos comptes connectés. Vous pouvez spécifier une valeur pour la[commission de la plateforme](https://docs.stripe.com/connect/direct-charges.md#collect-fees) sur chaque paiement afin de prélever automatiquement des frais sur les comptes connectés sans avoir à l’intégrer dans votre intégration. (See full diagram at https://docs.stripe.com/connect/build-full-embedded-integration) Pour accepter les paiements, nous vous recommandons d’utiliser [Stripe Checkout](https://docs.stripe.com/payments/checkout.md), une page préconfigurée hébergée par Stripe. Checkout prend en charge de nombreux moyens de paiement et affiche automatiquement les plus pertinents pour votre client. Vous pouvez également utiliser le [Payment Element](https://docs.stripe.com/payments/payment-element.md), un composant d’interface utilisateur préconfiguré à intégrer qui vous permet d’accepter des moyens de paiement supplémentaires avec une seule intégration. #### Checkout ### Créer une session Checkout (Client-side) (Server-side) Une session Checkout détermine ce qu’un client voit sur la page de paiement hébergée par Stripe, notamment les sous-postes de facture, le montant et la devise de la commande, ainsi que les moyens de paiement acceptés. Dans le cas de paiements directs, Checkout utilise les paramètres de marque du compte connecté. Pour en savoir plus, consultez la section relative à la [personnalisation de l’image de marque](https://docs.stripe.com/connect/direct-charges.md?platform=web&ui=stripe-hosted#branding). Les comptes connectés ne sont pas responsables des paiements indirects ou des paiements et transferts distincts. En revanche, c’est à eux qu’il revient de gérer les litiges concernant les paiements directs et non à la plateforme. Pour créer une session Checkout, ajoutez un bouton de paiement qui appelle un endpoint côté serveur sur votre site Web. ```html Checkout
``` Sur votre serveur, effectuez l’appel suivant à l’API Stripe. Après avoir créé une session Checkout, redirigez votre client vers l’[URL](https://docs.stripe.com/api/checkout/sessions/object.md#checkout_session_object-url) renvoyée dans la réponse. ```curl curl https://api.stripe.com/v1/checkout/sessions \ -u "<>:" \ -H "Stripe-Account: {{CONNECTEDACCOUNT_ID}}" \ -d mode=payment \ -d "line_items[0][price]={{PRICE_ID}}" \ -d "line_items[0][quantity]=1" \ -d "payment_intent_data[application_fee_amount]=123" \ --data-urlencode "success_url=https://example.com/success" ``` - `line_items` : ce paramètre représente les articles achetés par votre client, qui apparaissent dans l’interface utilisateur hébergée. - `success_url` : cet argument permet de rediriger le client une fois le paiement effectué. - `Stripe-Account` : cet en-tête signale un [paiement direct](https://docs.stripe.com/connect/direct-charges.md) pour votre compte connecté. Lors d’un paiement direct, le compte connecté est responsable du paiement des frais Stripe, des remboursements et des contestations de paiement. Checkout reflète l’image de marque du compte connecté, ce qui donne l’impression aux clients d’être directement en contact avec le compte connecté et non avec votre plateforme. - (Facultatif) `payment_intent_data[application_fee_amount]` : cet argument spécifie le montant que votre plateforme prévoit de prélever sur la transaction. Une fois le paiement traité sur le compte connecté, le montant `application_fee_amount` est transféré sur la plateforme et les frais de Stripe sont déduits du solde du compte connecté. ### Gérer les événements post-paiement (Côté serveur) Stripe envoie un événement [checkout.session.completed](https://docs.stripe.com/api/events/types.md#event_types-checkout.session.completed) une fois le paiement effectué. [Utilisez un webhook pour recevoir ces événements](https://docs.stripe.com/webhooks/quickstart.md) et exécuter des actions, comme envoyer une confirmation de commande par e-mail à votre client, enregistrer la vente dans une base de données ou lancer un flux de livraison. Nous vous conseillons d’écouter ces événements plutôt que d’attendre un rappel du client. Côté client, il arrive en effet que l’utilisateur ferme la fenêtre de son navigateur ou quitte l’application avant l’exécution du rappel. Avec certains moyens de paiement, la confirmation du paiement peut par ailleurs prendre entre 2 et 14 jours. Configurer votre intégration de manière à ce qu’elle écoute les événements asynchrones vous permettra d’accepter plusieurs [moyens de paiement](https://stripe.com/payments/payment-methods-guide) avec une seule intégration. En plus de gérer l’événement `checkout.session.completed`, nous vous recommandons de gérer deux autres événements lorsque vous encaissez des paiements avec Checkout : | Événement | Description | Étapes suivantes | | -------------------------------------------------------------------------------------------------------------------------------------------- | -------------------------------------------------------------------- | ---------------------------------------------------------------------------------- | | [checkout.session.completed](https://docs.stripe.com/api/events/types.md#event_types-checkout.session.completed) | Le client a autorisé le paiement en envoyant le formulaire Checkout. | Attendez que le paiement aboutisse ou échoue. | | [checkout.session.async_payment_succeeded](https://docs.stripe.com/api/events/types.md#event_types-checkout.session.async_payment_succeeded) | Le paiement du client a abouti. | Traitez la commande de biens ou de services de votre client. | | [checkout.session.async_payment_failed](https://docs.stripe.com/api/events/types.md#event_types-checkout.session.async_payment_failed) | Le paiement a été refusé ou a échoué pour une autre raison. | Contactez votre client par e-mail et demandez-lui de passer une nouvelle commande. | Ces événements incluent tous l’objet [Checkout Session](https://docs.stripe.com/api/checkout/sessions.md). Une fois le paiement effectué, l’état sous-jacent du *PaymentIntent* (The Payment Intents API tracks the lifecycle of a customer checkout flow and triggers additional authentication steps when required by regulatory mandates, custom Radar fraud rules, or redirect-based payment methods) passe de `processing` à `succeeded`. #### Payment Element ### Créer un PaymentIntent (Côté serveur) Pour représenter votre intention d’encaisser le paiement d’un client, Stripe utilise un objet [PaymentIntent](https://docs.stripe.com/api/payment_intents.md) qui suit vos tentatives de débit et les changements d’état du paiement tout au long du processus. ![Diagramme illustrant l'ensemble du tunnel de paiement](https://b.stripecdn.com/docs-statics-srv/assets/accept-a-payment-payment-element.5cf6795a02f864923f9953611493d735.svg) Les moyens de paiement présentés à votre client lors du processus de paiement sont également inclus dans ce PaymentIntent. Vous pouvez laisser Stripe extraire automatiquement (depuis les paramètres de votre Dashboard) les moyens de paiement à présenter, ou bien les répertorier manuellement. Stripe recommande l’option automatisée, sauf si votre intégration nécessite de coder les moyens de paiement à proposer. En effet, Stripe prend en compte la devise, les restrictions applicables aux différents moyens de paiement, ainsi que d’autres paramètres pour dresser la liste des moyens de paiement pris en charge. Les moyens de paiement les plus pertinents au regard de la devise et du lieu de résidence du client et générant les meilleurs taux de conversion sont automatiquement mis en avant. Ceux de moindre priorité sont uniquement accessibles via un menu de débordement (⋯). #### Gérer les moyens de paiement depuis le Dashboard Sur votre serveur, créez un PaymentIntent qui spécifie le montant et la devise. Dans la dernière version de l’API, la spécification du paramètre `automatic_payment_methods` est facultative, car Stripe active sa fonctionnalité par défaut. Vous pouvez gérer les moyens de paiement depuis le [Dashboard](https://dashboard.stripe.com/settings/payment_methods). Stripe renvoie les moyens de paiement admissibles en fonction de facteurs tels que le montant de la transaction, la devise et le tunnel de paiement. Ce processus garantit que votre PaymentIntent prend en charge les moyens de paiement que vous configurez dans le Dashboard, le cas échéant. Assurez-vous toujours que vous avez choisi le montant à facturer côté serveur, qui est environnement sécurisé, plutôt que côté client. Cette précaution empêchera les clients mal intentionnés de fixer leurs propres tarifs. ```curl curl https://api.stripe.com/v1/payment_intents \ -u "<>:" \ -H "Stripe-Account: {{CONNECTEDACCOUNT_ID}}" \ -d amount=1099 \ -d currency=eur \ -d "automatic_payment_methods[enabled]=true" \ -d application_fee_amount=123 ``` #### Référencer manuellement les moyens de paiement ```curl curl https://api.stripe.com/v1/payment_intents \ -u "<>:" \ -H "Stripe-Account: {{CONNECTEDACCOUNT_ID}}" \ -d amount=1099 \ -d currency=eur \ -d "payment_method_types[]=bancontact" \ -d "payment_method_types[]=card" \ -d "payment_method_types[]=eps" \ -d "payment_method_types[]=ideal" \ -d "payment_method_types[]=p24" \ -d "payment_method_types[]=sepa_debit" \ -d "payment_method_types[]=sofort" \ -d application_fee_amount=123 ``` Lors de la création d’un PaymentIntent, vous devez spécifier certains paramètres : - `amount` : créez un PaymentIntent sur votre serveur avec un montant spécifié. Déterminez toujours le montant à débiter côté serveur, car il s’agit d’un environnement sécurisé. Cette approche permet d’éviter que des clients malveillants ne choisissent eux-mêmes leurs tarifs. - `currency` : la devise que vous incluez dans le PaymentIntent filtre les moyens de paiement présentés au client, et le choix de la devise doit donc s’opérer en fonction des moyens de paiement que vous souhaitez proposer. Par exemple, si vous transmettez `eur` et que vous avez activé OXXO dans votre Dashboard, votre client ne verra pas ce moyen de paiement, car OXXO ne prend pas en charge les paiements libellés en `eur`. Certains moyens de paiement prennent en charge plusieurs devises et pays. Les exemples de code donnés dans ce guide implémentent les moyens de paiement suivants : Bancontact, les cartes de crédit, EPS, iDEAL, Przelewy24, le prélèvement automatique SEPA et Sofort. - `"payment_method_types[]"` : dressez manuellement la liste de tous les moyens de paiement que vous souhaitez prendre en charge. - (Facultatif) `payment_intent_data[application_fee_amount]` : cet argument spécifie le montant que votre plateforme prévoit de prélever sur la transaction. Si vous utilisez l’[outil de tarification pour plateforme](https://docs.stripe.com/connect/platform-pricing-tools.md) de Stripe pour gérer la tarification de vos frais de plateforme à partir du [Dashboard](https://dashboard.stripe.com/test/settings/connect/platform_pricing/payments), n’incluez pas cet argument, car il remplacerait toute logique de tarification définie par l’outil. Une fois le paiement traité sur le compte connecté, le `application_fee_amount` est transféré à la plateforme et les frais de Stripe sont déduits du solde du compte connecté. > Chacun des moyens de paiement doit prendre en charge la devise transmise dans le PaymentIntent et votre activité doit par ailleurs être basée dans l’un des pays pris en charge par chaque moyen de paiement. Veuillez consulter la page consacrée aux [options d’intégration des moyens de paiement](https://docs.stripe.com/payments/payment-methods/integration-options.md) pour en savoir plus. ### Récupérer la clé secrète du client Le PaymentIntent contient une *clé secrète* (The client secret is a unique key returned from Stripe as part of a PaymentIntent. This key lets the client access important fields from the PaymentIntent (status, amount, currency) while hiding sensitive ones (metadata, customer)) à utiliser côté client pour finaliser le processus de paiement en toute sécurité. Vous pouvez adopter différentes approches pour transmettre cette clé secrète côté client. #### Application monopage Récupérez la clé secrète du client à partir d’un endpoint sur votre serveur, à l’aide de la fonction `fetch` du navigateur. Cette approche est recommandée si votre côté client est une application d’une seule page, en particulier si elle repose sur un framework front-end moderne tel que React. Créez l’endpoint de serveur qui gère la clé secrète du client : #### Ruby ```ruby get '/secret' do intent = # ... Create or retrieve the PaymentIntent {client_secret: intent.client_secret}.to_json end ``` Récupérez ensuite la clé secrète du client à l’aide JavaScript côté client : ```javascript (async () => { const response = await fetch('/secret'); const {client_secret: clientSecret} = await response.json(); // Render the form using the clientSecret })(); ``` #### Rendu côté serveur Transmettez la clé secrète à votre client depuis votre serveur. Cette approche fonctionne mieux si votre application génère du contenu statique sur le serveur avant de l’envoyer sur le navigateur. Ajoutez le [client_secret](https://docs.stripe.com/api/payment_intents/object.md#payment_intent_object-client_secret) à votre formulaire de paiement. Dans votre code côté serveur, récupérez la clé secrète du client à partir du PaymentIntent : #### Ruby ```erb
``` ```ruby get '/checkout' do @intent = # ... Fetch or create the PaymentIntent erb :checkout end ``` ### Collecter les informations de paiement (Côté client) Collectez les informations de paiement de votre client à l’aide de Payment Element, un composant préconfiguré de l’interface utilisateur qui simplifie cette collecte pour de nombreux moyens de paiement. Le Payment Element contient un iframe qui envoie les informations de paiement à Stripe de manière sécurisée via une connexion HTTPS. Évitez de placer le Payment Element dans un autre iframe, car certains moyens de paiement nécessitent une redirection vers une autre page pour la confirmation du paiement. Pour que votre intégration fonctionne, l’adresse de la page de paiement doit commencer par `https://` et non par `http://`. Vous pouvez tester votre intégration sans utiliser le protocole HTTPS, mais n’oubliez pas de l’[activer](https://docs.stripe.com/security/guide.md#tls) lorsque vous souhaitez commencer à accepter des paiements réels. #### Configurer Stripe.js #### HTML + JS Le Payment Element est automatiquement disponible en tant que fonctionnalité de Stripe.js. Intégrez le script Stripe.js à votre page de paiement en l’ajoutant au `head` votre fichier HTML. Chargez toujours Stripe.js directement à partir de js.stripe.com pour rester conforme aux normes PCI. N’incluez pas le script dans un lot et n’en hébergez pas de copie. ```html Checkout ``` Créez une instance de `Stripe` avec le code JavaScript suivant sur votre page de paiement : ```javascript // Initialize Stripe.js with the same connected account ID used when creating // the PaymentIntent. const stripe = Stripe('<>', { stripeAccount: '{{CONNECTED_ACCOUNT_ID}}' }); ``` ### Ajouter Stripe Elements et le composant Payment Element à votre page de paiement Le Payment Element doit avoir un emplacement dédié dans votre page de paiement. Créez un nœud DOM (conteneur) vide avec un ID unique dans votre formulaire de paiement. ```html
``` Une fois que le formulaire a été chargé, créez une instance du Payment Element et intégrez-la au nœud DOM conteneur. Lorsque vous créez l’instance [Elements](https://docs.stripe.com/js/elements_object/create), transmettez la [clé secrète du client](https://docs.stripe.com/api/payment_intents/object.md#payment_intent_object-client_secret) obtenue à l’étape précédente en tant qu’option. La clé secrète du client doit être utilisée avec prudence, car elle peut servir à finaliser le paiement. Ne l’enregistrez pas, ne l’intégrez pas dans des URL et ne la dévoilez à personne d’autre que votre client. ```javascript const options = { clientSecret: '{{CLIENT_SECRET}}', // Fully customizable with the Appearance API appearance: {/*...*/}, }; // Set up Stripe.js and Elements to use in checkout form using the client secret const elements = stripe.elements(options); // Create and mount the Payment Element const paymentElement = elements.create("payment"); paymentElement.mount("#payment-element"); ``` Le Payment Element affiche un formulaire dynamique qui permet à votre client de choisir un moyen de paiement. Ce formulaire recueille automatiquement toutes les informations nécessaires pour le moyen de paiement sélectionné par le client. Vous pouvez [personnaliser l’apparence du Payment Element](https://docs.stripe.com/elements/appearance-api.md) pour qu’il corresponde au design de votre site lorsque vous configurez l’objet `Elements`. #### React Installez les bibliothèques Connect.js et React Connect.js à partir du [registre public npm](https://www.npmjs.com/package/@stripe/react-connect-js). ```bash npm install --save @stripe/connect-js @stripe/react-connect-js ``` ### Ajouter et configurer le fournisseur Elements sur votre page de paiement Pour utiliser le composant Payment Element, enveloppez votre composant de page de paiement dans un [fournisseur Elements](https://docs.stripe.com/sdks/stripejs-react.md#elements-provider). Appelez `loadStripe` avec votre clé publique, puis transmettez le paramètre `Promise` renvoyé ainsi que la [clé secrète du client](https://docs.stripe.com/api/payment_intents/object.md#payment_intent_object-client_secret) définie à l’étape précédente en tant qu’`options` dans le fournisseur `Elements`. ```jsx import React from 'react'; import ReactDOM from 'react-dom'; import {Elements} from '@stripe/react-stripe-js'; import {loadStripe} from '@stripe/stripe-js'; import CheckoutForm from './CheckoutForm'; // Make sure to call `loadStripe` outside of a component’s render to avoid // recreating the `Stripe` object on every render. const stripePromise = loadStripe("<>", { stripeAccount: '{{CONNECTED_ACCOUNT_ID}}' }); function App() { const options = { // pass the client secret from the previous step clientSecret: '{{CLIENT_SECRET}}', // Fully customizable with the Appearance API appearance: {/*...*/}, }; return ( ); }; ReactDOM.render(, document.getElementById('root')); ``` #### Ajouter le composant Element Payment Utilisez le composant `PaymentElement` pour créer votre formulaire. ```jsx import React from 'react'; import {PaymentElement} from '@stripe/react-stripe-js'; const CheckoutForm = () => { return (
); }; export default CheckoutForm; ``` Le Payment Element affiche un formulaire dynamique qui permet à votre client de choisir un type de moyen de paiement. Ce formulaire collecte automatiquement toutes les informations requises pour le moyen de paiement sélectionné par le client. Vous pouvez [personnaliser l’apparence du Payment Element](https://docs.stripe.com/elements/appearance-api.md) pour qu’il corresponde au design de votre site lorsque vous configurez le fournisseur `Elements`. ### Envoyer le paiement à Stripe (Côté client) Utilisez [stripe.confirmPayment](https://docs.stripe.com/js/payment_intents/confirm_payment) pour effectuer le paiement à l’aide des informations du composant Payment Element. Ajoutez un paramètre [return_url](https://docs.stripe.com/api/payment_intents/create.md#create_payment_intent-return_url) à cette fonction pour indiquer la page vers laquelle Stripe doit rediriger l’utilisateur à l’issue du paiement. Votre utilisateur peut être redirigé en premier lieu vers un site intermédiaire, comme une page d’autorisation bancaire, avant d’être redirigé vers la page spécifiée par le paramètre `return_url`. L’utilisateur sera immédiatement redirigé vers la page `return_url` après un paiement réussi par carte. Si vous ne souhaitez pas effectuer de redirection à la fin des paiements par carte, vous pouvez assigner au paramètre [redirect](https://docs.stripe.com/js/payment_intents/confirm_payment#confirm_payment_intent-options-redirect) la valeur `if_required`. De cette manière, seuls les clients qui choisissent un moyen de paiement avec redirection seront redirigés. #### HTML + JS ```javascript const form = document.getElementById('payment-form'); form.addEventListener('submit', async (event) => { event.preventDefault(); const {error} = await stripe.confirmPayment({ //`Elements` instance that was used to create the Payment Element elements, confirmParams: { return_url: 'https://example.com/order/123/complete', }, }); if (error) { // This point will only be reached if there is an immediate error when // confirming the payment. Show error to your customer (for example, payment // details incomplete) const messageContainer = document.querySelector('#error-message'); messageContainer.textContent = error.message; } else { // Your customer will be redirected to your `return_url`. For some payment // methods like iDEAL, your customer will be redirected to an intermediate // site first to authorize the payment, then redirected to the `return_url`. } }); ``` #### React Pour appeler [stripe.confirmPayment](https://docs.stripe.com/js/payment_intents/confirm_payment) depuis votre composant de formulaire de paiement, utilisez les hooks [useStripe](https://docs.stripe.com/sdks/stripejs-react.md#usestripe-hook) et [useElements](https://docs.stripe.com/sdks/stripejs-react.md#useelements-hook). Si vous préférez les composants de classe traditionnels aux hooks, vous pouvez utiliser un [ElementsConsumer](https://docs.stripe.com/sdks/stripejs-react.md#elements-consumer). ```jsx import React, {useState} from 'react'; import {useStripe, useElements, PaymentElement} from '@stripe/react-stripe-js'; const CheckoutForm = () => { const stripe = useStripe(); const elements = useElements(); const [errorMessage, setErrorMessage] = useState(null); const handleSubmit = async (event) => { // We don't want to let default form submission happen here, // which would refresh the page. event.preventDefault(); if (!stripe || !elements) { // Stripe.js hasn't yet loaded. // Make sure to disable form submission until Stripe.js has loaded. return; } const {error} = await stripe.confirmPayment({ //`Elements` instance that was used to create the Payment Element elements, confirmParams: { return_url: 'https://example.com/order/123/complete', }, }); if (error) { // This point will only be reached if there is an immediate error when // confirming the payment. Show error to your customer (for example, payment // details incomplete) setErrorMessage(error.message); } else { // Your customer will be redirected to your `return_url`. For some payment // methods like iDEAL, your customer will be redirected to an intermediate // site first to authorize the payment, then redirected to the `return_url`. } }; return (
{/* Show error message to your customers */} {errorMessage &&
{errorMessage}
} ); }; export default CheckoutForm; ``` Veillez à ce que le paramètre `return_url` corresponde à une page de votre site web qui indique l’état du paiement. Lorsque Stripe redirige le client vers la page `return_url`, nous fournissons les paramètres de requête d’URL suivants : | Paramètre | Description | | ------------------------------ | ------------------------------------------------------------------------------------------------------------------------------------------------- | | `payment_intent` | L’identifiant unique du `PaymentIntent`. | | `payment_intent_client_secret` | La [clé secrète du client](https://docs.stripe.com/api/payment_intents/object.md#payment_intent_object-client_secret) de l’objet `PaymentIntent`. | > Si vous disposez d’outils qui assurent le suivi de la session navigateur du client, vous devrez peut-être ajouter le domaine `stripe.com` à la liste d’exclusion des sites référents. Les redirections font que certains outils créent de nouvelles sessions, ce qui empêche le suivi de la session dans son ensemble. Utilisez l’un des paramètres de requête pour récupérer le PaymentIntent. Consultez l’[état du PaymentIntent](https://docs.stripe.com/payments/paymentintents/lifecycle.md) pour déterminer les informations à présenter à vos clients. Vous pouvez également ajouter vos propres paramètres de requête lorsque vous ajoutez l’URL `return_url` ; ils seront conservés tout au long du processus de redirection. #### HTML + JS ```javascript // Initialize Stripe.js using your publishable key const stripe = Stripe('<>'); // Retrieve the "payment_intent_client_secret" query parameter appended to // your return_url by Stripe.js const clientSecret = new URLSearchParams(window.location.search).get( 'payment_intent_client_secret' ); // Retrieve the PaymentIntent stripe.retrievePaymentIntent(clientSecret).then(({paymentIntent}) => { const message = document.querySelector('#message') // Inspect the PaymentIntent `status` to indicate the status of the payment // to your customer. // // Some payment methods will [immediately succeed or fail][0] upon // confirmation, while others will first enter a `processing` state. // // [0]: https://stripe.com/docs/payments/payment-methods#payment-notification switch (paymentIntent.status) { case 'succeeded': message.innerText = 'Success! Payment received.'; break; case 'processing': message.innerText = "Payment processing. We'll update you when payment is received."; break; case 'requires_payment_method': message.innerText = 'Payment failed. Please try another payment method.'; // Redirect your user back to your payment page to attempt collecting // payment again break; default: message.innerText = 'Something went wrong.'; break; } }); ``` #### React ```jsx import React, {useState, useEffect} from 'react'; import {useStripe} from '@stripe/react-stripe-js'; const PaymentStatus = () => { const stripe = useStripe(); const [message, setMessage] = useState(null); useEffect(() => { if (!stripe) { return; } // Retrieve the "payment_intent_client_secret" query parameter appended to // your return_url by Stripe.js const clientSecret = new URLSearchParams(window.location.search).get( 'payment_intent_client_secret' ); // Retrieve the PaymentIntent stripe .retrievePaymentIntent(clientSecret) .then(({paymentIntent}) => { // Inspect the PaymentIntent `status` to indicate the status of the payment // to your customer. // // Some payment methods will [immediately succeed or fail][0] upon // confirmation, while others will first enter a `processing` state. // // [0]: https://stripe.com/docs/payments/payment-methods#payment-notification switch (paymentIntent.status) { case 'succeeded': setMessage('Success! Payment received.'); break; case 'processing': setMessage("Payment processing. We'll update you when payment is received."); break; case 'requires_payment_method': // Redirect your user back to your payment page to attempt collecting // payment again setMessage('Payment failed. Please try another payment method.'); break; default: setMessage('Something went wrong.'); break; } }); }, [stripe]); return message; }; export default PaymentStatus; ``` ### Gérer les événements post-paiement (Côté serveur) Stripe envoie un événement [payment_intent.succeeded](https://docs.stripe.com/api/events/types.md#event_types-payment_intent.succeeded) à l’issue du paiement. Utilisez l’[outil de webhook du Dashboard](https://dashboard.stripe.com/webhooks) ou suivez le [guide consacré aux webhooks](https://docs.stripe.com/webhooks/quickstart.md) pour recevoir ces événements et exécuter des actions, comme envoyer une confirmation de commande par e-mail à votre client, enregistrer la vente dans une base de données ou lancer un flux de livraison. Plutôt que d’attendre un rappel de votre client, écoutez ces événements. Côté client, il arrive en effet que l’utilisateur ferme la fenêtre de son navigateur ou quitte l’application avant l’exécution du rappel. Certains clients malintentionnés peuvent d’autre part tenter de manipuler la réponse. En configurant votre intégration de manière à ce qu’elle écoute les événements asynchrones, vous pourrez accepter [plusieurs types de moyens de paiement](https://stripe.com/payments/payment-methods-guide) avec une seule et même intégration. En plus de l’événement `payment_intent.succeeded`, nous vous recommandons de gérer ces autres événements lorsque vous encaissez des paiements à l’aide de l’Element Payment : | Événement | Description | Action | | ------------------------------------------------------------------------------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | | [payment_intent.succeeded](https://docs.stripe.com/api/events/types.md?lang=php#event_types-payment_intent.succeeded) | Envoyé lorsqu’un client effectue un paiement avec succès. | Envoyez au client une confirmation de commande et *traitez* (Fulfillment is the process of providing the goods or services purchased by a customer, typically after payment is collected) sa commande. | | [payment_intent.processing](https://docs.stripe.com/api/events/types.md?lang=php#event_types-payment_intent.processing) | Envoyé lorsqu’un client initie un paiement, mais qu’il ne l’a pas encore finalisé. Dans la plupart des cas, cet événement est envoyé lorsque le client initie un prélèvement bancaire. Il est suivi par un événement `payment_intent.succeeded` ou `payment_intent.payment_failed`. | Envoyez au client une confirmation de commande qui indique que son paiement est en attente. Pour des marchandises dématérialisées, vous pourrez traiter la commande sans attendre que le paiement soit effectué. | | [payment_intent.payment_failed](https://docs.stripe.com/api/events/types.md?lang=php#event_types-payment_intent.payment_failed) | Envoyé lorsqu’un client effectue une tentative de paiement qui se solde par un échec. | Si un paiement passe de l’état `processing` à `payment_failed`, proposez au client de retenter le paiement. | ## Configurer les communications par e-mail avec les comptes connectés Stripe communique en votre nom avec vos comptes connectés pour gérer les risques et garantir le maintien de la conformité. Vous pouvez personnaliser et marquer ces communications par e-mail avec votre propre domaine de messagerie et votre propre marque de plateforme. Nous envoyons les e-mails suivants à vos comptes connectés : - Les **e-mails de compte** permettent de vérifier les informations d’un compte telles que les ajouts ou les modifications d’adresses e-mail, de numéro de téléphone ou de compte bancaire. - Les **e-mails relatifs à la conformité** demandent aux comptes de fournir les informations requises. Stripe a souvent besoin de collecter des informations supplémentaires pour maintenir sa conformité vis-à-vis de ses partenaires financiers. - Les **e-mails relatifs aux risques** informent les comptes lorsqu’ils font l’objet d’un examen des risques. Ces e-mails fournissent souvent des instructions sur la manière de soumettre des informations en vue de la résolution d’une action à risque, par exemple pour lever une suspension des virements. - Les **e-mails fiscaux** (uniquement lorsque Stripe perçoit directement des frais Stripe sur les comptes connectés) informent les utilisateurs lorsque leurs factures fiscales, ou formulaires 1099, sont disponibles au téléchargement. Si vous souhaitez envoyer d’autres e-mails relatifs aux paiements à vos comptes connectés, vous devez les envoyer vous-même. Par exemple, pour envoyer des e-mails concernant de nouveaux litiges, [écoutez](https://docs.stripe.com/webhooks.md) l’événement `charge.dispute.created` sur un compte connecté. Lorsque cet événement se produit, utilisez [l’API Disputes](https://docs.stripe.com/api/disputes.md) pour obtenir les détails et les envoyer par e-mail au compte. Vous devez [mettre à jour vos paramètres Connect avec les URL](https://dashboard.stripe.com/settings/connect/site-links) de vos paiements et des workflows de vos comptes connectés afin que les communications par e-mail de Stripe puissent rediriger vos comptes connectés vers ceux-ci. Vous devez définir ces liens avant de créer une `AccountSession` ou un `AccountLink` en mode production. ## Gérer les redirections des liens des e-mails Les e-mails envoyés par Stripe qui contiennent un appel à l’action doivent inclure un lien vers cette action. Par exemple, si nous envoyons un e-mail appelant à l’action sur un compte connecté, il doit inclure un lien vers votre composant de gestion de compte. Avant de pouvoir créer une Account Session en mode production, vous devez fournir les URL sur lesquelles vous avez intégré les composants à votre site Web. Configurez le domaine de l’e-mail d’envoi et les URL des composants intégrés dans la section **Liens vers le site** des [paramètres Connect de votre plateforme](https://dashboard.stripe.com/settings/connect/site-links). > Les environnements de test utilisent les mêmes URL que le mode production. Pour les composants intégrés à votre site, sélectionnez **Oui** et entrez l’URL de la page qui héberge le composant. Pour toutes les actions qui ne sont pas gérées par un composant intégré, sélectionnez **Non** et entrez l’URL de la page de votre site où le compte peut effectuer l’action. Après avoir saisi les URL, testez-les pour vérifier qu’elles ouvrent les bonnes pages. Vous devez définir des URL pour les éléments suivants : - Bannière de notification - Gestion de compte - Paiements - Virements - Soldes - Documents (lorsque Stripe perçoit des frais Stripe directement à partir des comptes connectés) Lors de l’envoi d’un e-mail, Stripe ajoute automatiquement l’identifiant du compte connecté à l’URL de redirection en tant que paramètre `stripe_account_id`. Utilisez ce paramètre pour identifier le compte et vérifier qu’il est authentifié. Configurez l’itinéraire sur votre serveur pour lire les paramètres et afficher le composant intégré approprié. Pour en savoir plus sur la configuration des e-mails envoyés par Stripe à vos comptes connectés, consultez la documentation sur les [communications par e-mail dans les intégrations Connect](https://docs.stripe.com/connect/embedded-comms.md). ## Configurer les paramètres et l’adaptation de vos e-mails à votre marque Stripe peut envoyer des e-mails reflétant les paramètres de la marque de votre plateforme depuis votre propre domaine de messagerie vers vos comptes connectés. Pour configurer les e-mails de Stripe à vos comptes connectés, accédez à la section [E-mails](https://dashboard.stripe.com/settings/connect/emails) du Dashboard de votre plateforme. ## Passer en mode production À ce stade, vous avez configuré l’intégration de votre plateforme en procédant comme suit : - Comptes connectés créés avec la configuration adéquate - Composants intégrés permettant aux comptes connectés de s’inscrire, de gérer leur compte et de répondre aux actions liées aux risques par le biais de votre site Web - Configurer des paiements à l’aide des paiements directs avec commission de la plateforme - Configurez la communication par e-mail de votre marque pour permettre à Stripe de transmettre à vos utilisateurs des informations relatives à la conformité, aux actions à risque et aux documents nécessaires. ## Tester votre intégration Testez votre flux de création de comptes en utilisant l’inscription de compte intégrée à votre plateforme. Testez les paramètres de vos moyens de paiement pour vos comptes connectés en vous connectant à l’un de vos comptes test et en accédant aux [paramètres des moyens de paiement](https://dashboard.stripe.com/settings/payment_methods). Testez votre tunnel de paiement à l’aide de vos clés de test et d’un compte de test. Vous pouvez utiliser nos [cartes de test](https://docs.stripe.com/testing.md) pour tester votre flux de paiement et simuler divers scénarios.