# Erstellen Sie eine SaaS-Plattform mit Accounts v1 Erstellen Sie verbundene Konten mit Accounts v1 und ermöglichen Sie anschließend direkte Zahlungen an diese auf Ihrer SaaS-Plattform. > #### Integrationen der Accounts v2 API > > Dieser Leitfaden gilt nur für bestehende Connect-Plattformen, die die Accounts v1 API verwenden. Wenn Sie ein/e neue/r Connect-Nutzer/in sind oder die Accounts v2 API nutzen, beachten Sie den [Leitfaden zur SaaS-Plattform v2](https://docs.stripe.com/connect/saas.md). In diesem Leitfaden erfahren Sie, wie Sie Ihren Nutzerinnen und Nutzern das Annehmen von Zahlungen ermöglichen, einen Teil der Einnahmen auf Ihr Guthaben übertragen und den Rest auf die Nutzerbankkonten auszahlen. Wir veranschaulichen diese Konzepte am Beispiel einer Plattform, mit der Unternehmen einen eigenen Online-Shop einrichten können. # Web > This is a Web for when platform is web. View the full page at https://docs.stripe.com/connect/end-to-end-saas-platform?platform=web. ## Voraussetzungen 1. [Registrieren Sie Ihre Plattform](https://dashboard.stripe.com/connect). 1. [Unternehmensdetails im Dashboard überprüfen und hinzufügen](https://dashboard.stripe.com/account/onboarding). 1. [Vervollständigen Sie Ihr Plattform-Profil](https://dashboard.stripe.com/connect/settings/profile). 1. [Passen Sie Ihre Markeneinstellungen an](https://dashboard.stripe.com/settings/connect/stripe-dashboard/branding). Fügen Sie einen Firmennamen, ein Symbol und eine Markenfarbe hinzu. ## Stripe einrichten [Serverseitig] Installieren Sie die offiziellen Bibliotheken von Stripe für den Zugriff auf die Stripe-API über Ihre Anwendung: #### Ruby ```bash # Available as a gem sudo gem install stripe ``` ```ruby # If you use bundler, you can add this line to your Gemfile gem 'stripe' ``` ## Verbundenes Konto erstellen Wenn sich Nutzer/innen (Verkäufer/innen oder Dienstleister/innen) auf Ihrer Plattform registrieren, erstellen Sie ein [Nutzerkonto](https://docs.stripe.com/api/accounts.md) (auch *verbundenes Konto* genannt), damit Sie Zahlungen einziehen und anschließend an die Nutzer/innen auszahlen können. Verbundene Konten entsprechen in der API von Stripe Ihren Nutzerinnen und Nutzern und helfen, die für deren Identitätsprüfung erforderlichen Informationen zu erfassen. In unserem Beispiel mit der Store-Builder-Plattform ist das verbundene Konto das Unternehmen, das einen Online-Shop einrichtet. ![Screenshot des Connect Onboarding-Formulars](https://b.stripecdn.com/docs-statics-srv/assets/Kavholm-Seamless-Standard.78b64d90c0bf87130c8b6ba1ef53df7f.png) ### Verbundenes Konto erstellen und Informationen vorab ausfüllen Verwenden Sie die `/v1/accounts` API, um ein verbundenes Konto zu [erstellen](https://docs.stripe.com/api/accounts/create.md). Sie können das verbundene Konto erstellen, indem Sie die [Standardparameter des verbundenen Kontos](https://docs.stripe.com/connect/migrate-to-controller-properties.md) verwenden oder den Kontotyp angeben. #### Mit Standardeigenschaften ```curl curl -X POST https://api.stripe.com/v1/accounts \ -u "<>:" ``` #### Mit Kontotyp ```curl curl https://api.stripe.com/v1/accounts \ -u "<>:" \ -d type=standard ``` Falls Sie bereits Informationen für Ihre verbundenen Konten erfasst haben, können Sie diese im `Account`-Objekt vorab angeben. Sie können alle Kontoinformationen vorab ausfüllen, einschließlich persönlicher und geschäftlicher Informationen, externer Kontoinformationen usw. Nachdem Sie das `Account` erstellt haben, erstellen Sie eine [Person](https://docs.stripe.com/api/persons/create.md), die die für die Kontoeröffnung verantwortliche Person repräsentiert, wobei Sie `relationship.representative` auf „true“ setzen und alle Kontoinformationen, die Sie vorab ausfüllen möchten (z. B. Vor- und Nachname), eingeben. ```curl curl https://api.stripe.com/v1/accounts/{{ACCOUNT_ID}}/persons \ -u "<>:" \ -d first_name=Jenny \ -d last_name=Rosen \ -d "relationship[representative]=true" ``` Connect Onboarding fragt keine vorab ausgefüllten Informationen ab. Kontoinhaber/innen müssen vorausgefüllte Informationen jedoch bestätigen, bevor sie den [Connect-Rahmenvertrag](https://docs.stripe.com/connect/service-agreement-types.md) akzeptieren können. Füllen Sie beim Testen Ihrer Integration die Kontoinformationen vorab mit [Testdaten](https://docs.stripe.com/connect/testing.md) aus. ### Konto-Link erstellen Sie können einen Konto-Link erstellen, indem Sie die [Account Links](https://docs.stripe.com/api/account_links.md) API mit den folgenden Parametern aufrufen: - `account` - `refresh_url` - `return_url` - `type` = `account_onboarding` ```curl curl https://api.stripe.com/v1/account_links \ -u "<>:" \ -d "account={{CONNECTEDACCOUNT_ID}}" \ --data-urlencode "refresh_url=https://example.com/reauth" \ --data-urlencode "return_url=https://example.com/return" \ -d type=account_onboarding ``` ### Nutzer/innen an die Konto-Link-URL weiterleiten Die Antwort auf Ihre [Account Links](https://docs.stripe.com/api/account_links.md)-Anfrage enthält einen Wert für den Schlüssel `url`. Leiten Sie Ihre Nutzer/innen an diesen Link weiter, um sie an das Verfahren zu übergeben. Konto-Links sind temporär und können nur einmal verwendet werden, da sie Zugang zu den persönlichen Daten der Inhaber/innen der verbundenen Konten gewähren. Führen Sie die Authentifizierung der Nutzer/innen in Ihrer Anwendung durch, bevor Sie sie an diese URL weiterleiten. Wenn Sie Informationen vorab angeben möchten, müssen Sie dies vor der Erstellung des Konto-Links tun. Nach der Erstellung des Konto-Links können Informationen für das Konto weder angezeigt noch geändert werden. > Versenden Sie keine Konto-Link-URLs per E-Mail, Textnachricht oder anderweitig außerhalb Ihrer Plattformanwendung. Stellen Sie die URLs Ihren authentifizierten Kontoinhaberinnen und Kontoinhabern stattdessen in Ihrer Anwendung zur Verfügung. ### Umgang mit Nutzerinnen/Nutzern, die zu Ihrer Plattform zurückkehren Connect Onboarding verlangt, dass Sie sowohl eine `return_url` als auch eine `refresh_url` übergeben, um alle Fälle steuern zu können, in denen die Nutzer/innen an Ihre Plattform weitergeleitet werden. Es ist wichtig, dass Sie diese URLs korrekt implementieren, um Ihren Nutzerinnen/Nutzern die bestmögliche Erfahrung zu bieten. > In einer Testumgebung können Sie für Ihre `return_url` und `refresh_url` HTTP verwenden (beispielsweise um mit „localhost“ zu testen), im Live-Modus wird jedoch nur HTTPS akzeptiert. Sie müssen alle Test-URLs vor der Inbetriebnahme durch HTTPS-URLs ersetzen. #### return_url Stripe löst eine Weiterleitung zu dieser URL aus, wenn die Nutzer/innen das Connect Onboarding abschließen. Das heißt nicht, dass alle Informationen erfasst wurden oder keine offenen Anforderungen für das Konto bestehen. Es bedeutet lediglich, dass die Nutzer/innen das Verfahren ordnungsgemäß durchlaufen und beendet haben. Über diese URL wird kein Status übergeben. Nachdem Nutzer/innen zu Ihrer `return_url` weitergeleitet wurden, überprüfen Sie den Status des Parameters `details_submitted` für das jeweilige Konto, indem Sie eine der folgenden Aktionen ausführen: - `account.updated`-Webhooks überwachen - Rufen Sie die [Accounts](https://docs.stripe.com/api/accounts.md)-API auf und prüfen Sie das zurückgegebene Objekt. #### refresh_url Stripe leitet Ihre Nutzer/innen in den folgenden Fällen an die `refresh_url` weiter: - Der Link ist abgelaufen (seit Erstellung des Links sind ein paar Minuten vergangen). - Die Nutzerin/der Nutzer hat den Link bereits aufgerufen (sie/er hat die Seite aktualisiert oder auf die Zurück-/Vorwärts-Schaltfläche im Browser geklickt). - Ihre Plattform hat keinen Zugang mehr zu diesem Konto. - Das Konto wurde abgelehnt. Ihre `refresh_url` sollte eine Methode auf Ihrem Server auslösen, um [Account Links](https://docs.stripe.com/api/account_links.md) erneut mit denselben Parametern aufzurufen und Nutzer/innen an das Connect Onboarding zurückzuleiten, damit ein nahtloses Erlebnis entsteht. ### Umgang mit Nutzerinnen/Nutzern, die das Onboarding nicht abgeschlossen haben Wenn Nutzer/innen an Ihre `return_url` weitergeleitet werden, haben sie das Onboarding möglicherweise nicht abgeschlossen. Rufen Sie mithilfe des Endpoints `/v1/accounts` das Nutzerkonto auf und prüfen Sie den Wert für `charges_enabled`. Wenn das Onboarding für das Konto nicht komplett abgeschlossen wurde, geben Sie der Nutzerin/dem Nutzer mithilfe entsprechender Eingabeaufforderungen der Nutzeroberfläche die Möglichkeit, das Onboarding zu einem späteren Zeitpunkt fortzusetzen. Nutzer/innen können ihre Konto-Aktivierung über einen neuen (von Ihrer Integration generierten) Link abschließen. Anhand des Status des Parameters `details_submitted` im Nutzerkonto können Sie überprüfen, ob das Onboarding abgeschlossen wurde. ## Zahlungsmethoden aktivieren Zeigen Sie die [Einstellungen für Ihre Zahlungsmethoden](https://dashboard.stripe.com/settings/connect/payment_methods) an und aktivieren Sie die Zahlungsmethoden, die Sie unterstützen möchten. Kartenzahlungen werden standardmäßig aktiviert, aber Sie können Zahlungsmethoden nach Bedarf aktivieren und deaktivieren. In diesem Leitfaden wird davon ausgegangen, dass Bancontact, Kreditkarten, EPS, iDEAL, Przelewy24, SEPA-Lastschriften und Sofort aktiviert sind. Bevor das Zahlungsformular angezeigt wird, wertet Stripe die Währung, Einschränkungen für Zahlungsmethoden und andere Parameter aus, um die Liste der unterstützten Zahlungsmethoden zu ermitteln. Zahlungsmethoden, die die Konversion steigern und die für die Währung und den Standort der Kundin/des Kunden am relevantesten sind, erhalten Priorität. Zahlungsmethoden mit niedrigerer Priorität sind in einem Überlaufmenü verborgen. > Mit der **eingebetteten Komponente für Einstellungen der Zahlungsmethode** können verbundene Konten die Zahlungsmethoden konfigurieren, die sie beim Bezahlvorgang anbieten, ohne auf das Stripe-Dashboard zugreifen zu müssen. Erfahren Sie mehr über die [eingebettete Komponente für Einstellungen der Zahlungsmethode](https://docs.stripe.com/connect/supported-embedded-components/payment-method-settings.md). Sie werden benachrichtigt, sobald sie verfügbar ist. ## Zahlung annehmen Betten Sie [Stripe Checkout](https://stripe.com/payments/checkout) als Zahlungsformular direkt auf Ihrer Website ein oder leiten Sie Nutzer/innen auf eine von Stripe gehostete Seite weiter, um Zahlungen zu akzeptieren. Checkout unterstützt mehrere Zahlungsarten und zeigt Ihrem Kunden automatisch die relevantesten an. Sie können auch das Zahlungselement verwenden, eine vorgefertigte UI-Komponente, die als iframe in Ihr Zahlungsformular eingebettet wird, um mehrere Zahlungsmethoden mit einer einzigen Frontend-Integration zu akzeptieren. #### Von Stripe gehostete Seite ### Checkout-Sitzung erstellen (Client-side) (Server-side) Über eine Checkout-Sitzung wird gesteuert, was die Kundinnen/Kunden im einbettbaren Zahlungsformular sehen, zum Beispiel Positionen, den Bestellbetrag und die Währung sowie die akzeptierten Zahlungsmethoden. Bei der Durchführung von direkten Abbuchungen verwendet Checkout die Branding-Einstellungen des verbundenen Kontos. Weitere Informationen finden Sie im Abschnitt „[Branding anpassen](https://docs.stripe.com/connect/direct-charges.md?platform=web&ui=stripe-hosted#branding)“. Anders als bei Destination Charges und separaten Zahlungen und Überweisungen sind die Nutzer/innen (verbundenen Konten) bei Direct Charges für den Umgang mit Zahlungsanfechtungen verantwortlich – die Verantwortung liegt nicht bei der Plattform. Führen Sie auf Ihrem Server den folgenden Aufruf der Stripe API durch. Leiten Sie Ihre Kundinnen/Kunden nach dem Erstellen einer Checkout-Sitzung zu der in der Antwort zurückgegebenen [URL](https://docs.stripe.com/api/checkout/sessions/object.md#checkout_session_object-url) weiter. ```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` – Dieses Argument steht für Artikel, die Ihre Kundinnen/Kunden kaufen und die in der gehosteten Nutzeroberfläche angezeigt werden. - `success_url` - Dieses Argument leitet Nutzer/innen weiter, nachdem sie eine Zahlung abgeschlossen haben. - `Stripe-Account`: Dieser Header gibt eine [direct charge](https://docs.stripe.com/connect/direct-charges.md) für Ihr verbundenes Konto an. Bei Direct Charges ist das verbundene Konto für Stripe-Gebühren, Rückerstattungen und Rückbuchungen verantwortlich. In Checkout wird das Branding des verbundenen Kontos verwendet, wodurch Kundinnen und Kunden den Eindruck haben, direkt mit dem Unternehmen und nicht mit Ihrer Plattform zu kommunizieren. - (Optional) `payment_intent_data[application_fee_amount]` – Dieses Argument bestimmt den Betrag, den Ihre Plattform von der Transaktion abziehen möchte. Nachdem die Zahlung auf dem verbundenen Konto abgewickelt wurde, wird der `application_fee_amount` an die Plattform übertragen, und die Stripe-Gebühr wird vom Guthaben des verbundenen Kontos abgezogen. ![Ablauf der Kontoerstellung](https://b.stripecdn.com/docs-statics-srv/assets/direct_charges.a2a8b68037ac95fe22140d6dde9740d3.svg) ### Mit Ereignissen nach der Zahlung umgehen (Serverseitig) Stripe übermittelt ein [checkout.session.completed](https://docs.stripe.com/api/events/types.md#event_types-checkout.session.completed)-Ereignis, wenn die Zahlung abgeschlossen ist. [Verwenden Sie einen Webhook, um diese Ereignisse zu empfangen](https://docs.stripe.com/webhooks/quickstart.md) und Aktionen auszuführen (Versenden einer Bestellbestätigung per E-Mail an die Kundinnen/Kunden, Erfassen des Verkaufs in einer Datenbank oder Einleiten des Versandablaufs). Überwachen Sie diese Ereignisse, anstatt auf einen Callback vom Client zu warten. Auf dem Client könnten die Kundinnen und Kunden das Browserfenster schließen oder die App beenden, bevor der Callback erfolgt ist. Einige Zahlungsmethoden benötigen auch 2 bis 14 Tage bis zur Zahlungsbestätigung. Wenn Sie Ihre Integration so einrichten, dass sie asynchrone Ereignisse überwacht, können Sie mehrere [Zahlungsmethoden](https://stripe.com/payments/payment-methods-guide) mit einer einzelnen Integration akzeptieren. Neben der Abwicklung des Ereignisses `checkout.session.completed` empfehlen wir die Abwicklung von zwei weiteren Ereignissen, wenn Sie Zahlungen mit Checkout erfassen: | Ereignis | Beschreibung | Nächste Schritte | | -------------------------------------------------------------------------------------------------------------------------------------------- | ---------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------ | | [checkout.session.completed](https://docs.stripe.com/api/events/types.md#event_types-checkout.session.completed) | Der Kunde/die Kundin hat die Zahlung nach der Übermittlung des Checkout-Formulars erfolgreich autorisiert. | Warten Sie, bis die Zahlung erfolgt ist oder fehlschlägt. | | [checkout.session.async_payment_succeeded](https://docs.stripe.com/api/events/types.md#event_types-checkout.session.async_payment_succeeded) | Die Kundenzahlung war erfolgreich. | Führen Sie die Bestellung der gekauften Waren oder Dienstleistungen aus. | | [checkout.session.async_payment_failed](https://docs.stripe.com/api/events/types.md#event_types-checkout.session.async_payment_failed) | Die Zahlung wurde abgelehnt oder ist aus einem anderen Grund fehlgeschlagen. | Kontaktieren Sie den Kunden/die Kundin per E-Mail und fordern Sie eine neue Bestellung von ihm/ihr an. | Diese Ereignisse beinhalten das [Checkout-Sitzungsobjekt](https://docs.stripe.com/api/checkout/sessions.md). Nach erfolgreicher Zahlung ändert sich der Status des zugrunde liegenden *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) von `processing` zu `succeeded`. #### Vollständig eingebettete Seite ### Checkout-Sitzung erstellen (Client-side) (Server-side) Über eine Checkout-Sitzung wird gesteuert, was die Kundinnen und Kunden auf der von Stripe gehosteten Zahlungsseite sehen, z. B. Posten, den Bestellbetrag und die Währung sowie die akzeptierten Zahlungsmethoden. Bei der Durchführung von separaten Zahlungen und Überweisungen verwendet Checkout die Branding-Einstellungen des verbundenen Kontos. Weitere Informationen finden Sie im Abschnitt [Branding anpassen](https://docs.stripe.com/connect/direct-charges.md?platform=web&ui=stripe-hosted#branding). Anders als bei Destination Charges und separaten Zahlungen und Überweisungen sind die Nutzer/innen (verbundenen Konten) bei Direct Charges für den Umgang mit Zahlungsanfechtungen verantwortlich – die Verantwortung liegt nicht bei der Plattform. Führen Sie auf Ihrem Server den folgenden Aufruf der Stripe API durch. Die von der Checkout-Sitzung erstellte Antwort enthält ein `client_secret`, das Sie im nächsten Schritt zum Verbinden von Checkout verwenden. ```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" \ -d ui_mode=embedded_page \ --data-urlencode "return_url=https://example.com/checkout/return?session_id={CHECKOUT_SESSION_ID}" ``` - `line_items` – Dieses Argument steht für Artikel, die Ihre Kundinnen und Kunden kaufen und die in der gehosteten Nutzeroberfläche angezeigt werden. - `return_url` - Dieses Argument leitet Nutzer/innen weiter, nachdem sie einen Zahlungsversuch abgeschlossen haben. - `Stripe-Account` – Dieser Header gibt eine [Direct Charge](https://docs.stripe.com/connect/direct-charges.md) für Ihr verbundenes Konto an. Bei Direct Charges ist das verbundene Konto für Stripe-Gebühren, Rückerstattungen und Rückbuchungen verantwortlich. In Checkout wird das Branding des verbundenen Kontos verwendet, wodurch Kundinnen/Kunden den Eindruck haben, direkt mit dem Händler und nicht mit Ihrer Plattform zu kommunizieren. - (Optional) `payment_intent_data[application_fee_amount]` – Dieses Argument bestimmt den Betrag, den Ihre Plattform von der Transaktion abziehen möchte. Wenn Sie das [Platform Pricing Tool](https://docs.stripe.com/connect/platform-pricing-tools.md) von Stripe verwenden, um die Preisgestaltung für Plattformgebühren vom [Dashboard](https://dashboard.stripe.com/test/settings/connect/platform_pricing/payments) aus zu verwalten, sollten Sie dieses Argument nicht einfügen, da es die vom Tool festgelegte Preislogik überschreibt. Nachdem die Zahlung auf dem verbundenen Konto abgewickelt wurde, wird der `application_fee_amount` an die Plattform übertragen, und die Stripe Gebühr wird vom Guthaben des verbundenen Kontos abgezogen. Achten Sie darauf, dass die `return_url` einer Seite auf Ihrer Website entspricht, die den Status der Zahlung anzeigt. Wenn Stripe Kundinnen/Kunden zur `return_url` weiterleitet, ersetzen wir die Zeichenfolge `{CHECKOUT_SESSION_ID}` durch die ID der Checkout-Sitzung. Verwenden Sie diese ID, um die Checkout-Sitzung abzurufen und den Status zu überprüfen, um zu entscheiden, was Ihren Kundinnen/Kunden angezeigt werden soll. Sie können bei der Bereitstellung der `return_url` auch Ihre eigenen Abfrageparameter anhängen, die während des Weiterleitungsprozesses bestehen bleiben. ![Ablauf der Kontoerstellung](https://b.stripecdn.com/docs-statics-srv/assets/direct_charges.a2a8b68037ac95fe22140d6dde9740d3.svg) ### Checkout verbinden (Clientseitig) #### HTML + JS Checkout ist als Teil von [Stripe.js](https://docs.stripe.com/js.md) verfügbar. Nehmen Sie das Stripe.js-Skript in Ihre Seite auf, indem Sie es zum Header Ihrer HTML-Datei hinzufügen. Als Nächstes erstellen Sie einen leeren DOM-Knoten (Container), der zum Verbinden verwendet wird. ```html
``` Initialisieren Sie Stripe.js mit Ihrem veröffentlichbaren API-Schlüssel. Erstellen Sie eine asynchrone `fetchClientSecret`-Funktion, die eine Anfrage an Ihren Server stellt, um eine Checkout-Sitzung zu erstellen und das Client-Geheimnis abzurufen. Übergeben Sie diese Funktion an `options`, wenn Sie die Checkout-Instanz erstellen: ```javascript // Initialize Stripe.js const stripe = Stripe('<>', { stripeAccount: '{{CONNECTED_ACCOUNT_ID}}', }); initialize(); // Fetch Checkout Session and retrieve the client secret async function initialize() { const fetchClientSecret = async () => { const response = await fetch("/create-checkout-session", { method: "POST", }); const { clientSecret } = await response.json(); return clientSecret; }; // Initialize Checkout const checkout = await stripe.createEmbeddedCheckoutPage({ fetchClientSecret, }); // Mount Checkout checkout.mount('#checkout'); } ``` #### React Installieren Sie Bibliotheken von Connect.js und die React Connect.js aus der [öffentlichen Registry von npm](https://www.npmjs.com/package/@stripe/react-connect-js). ```bash npm install --save @stripe/connect-js @stripe/react-connect-js ``` Um die eingebettete Checkout-Komponente zu verwenden, erstellen Sie einen `EmbeddedCheckoutProvider`. Rufen Sie `loadStripe` mit Ihrem veröffentlichbaren API-Schlüssel auf und übergeben Sie das zurückgegebene `Promise` an den Anbieter. Erstellen Sie eine asynchrone `fetchClientSecret`-Funktion, die eine Anfrage an Ihren Server stellt, um eine Checkout-Sitzung zu erstellen und das Client-Geheimnis abzurufen. Übergeben Sie diese Funktion an die vom Anbieter akzeptierte Eigenschaft `options`. ```jsx import * as React from 'react'; import {loadStripe} from '@stripe/stripe-js'; import { EmbeddedCheckoutProvider, EmbeddedCheckout } from '@stripe/react-stripe-js'; // Make sure to call `loadStripe` outside of a component’s render to avoid // recreating the `Stripe` object on every render. const stripePromise = loadStripe('pk_test_123'); const App = ({fetchClientSecret}) => { const options = {fetchClientSecret}; return ( ) } ``` Checkout wird in einem iFrame gerendert, der Zahlungsinformationen über eine sichere HTTPS-Verbindung an Stripe sendet. Vermeiden Sie es, Checkout in einem anderen iFrame zu platzieren, da einige Zahlungsmethoden die Weiterleitung an eine gesonderte Seite zur Zahlungsbestätigung voraussetzen. ### Erscheinungsbild anpassen Passen Sie Checkout an das Design Ihrer Website an, indem Sie Hintergrundfarbe, Schaltflächenfarbe, Rahmenradius und Schriftarten in den [Branding-Einstellungen](https://dashboard.stripe.com/settings/branding) Ihres Kontos festlegen. Checkout wird standardmäßig ohne externes Padding oder Ränder gerendert. Um Ihren gewünschten Rand hinzuzufügen (z. B. 16px auf allen Seiten), empfehlen wir, ein Container-Element zu verwenden. ### Mit Ereignissen nach der Zahlung umgehen (Serverseitig) Stripe übermittelt ein [checkout.session.completed](https://docs.stripe.com/api/events/types.md#event_types-checkout.session.completed)-Ereignis, wenn die Zahlung abgeschlossen ist. [Verwenden Sie einen Webhook, um diese Ereignisse zu empfangen](https://docs.stripe.com/webhooks/quickstart.md) und Aktionen auszuführen (Versenden einer Bestellbestätigung per E-Mail an die Kundinnen/Kunden, Erfassen des Verkaufs in einer Datenbank oder Einleiten des Versandablaufs). Überwachen Sie diese Ereignisse, anstatt auf einen Callback vom Client zu warten. Auf dem Client könnten die Kundinnen und Kunden das Browserfenster schließen oder die App beenden, bevor der Callback erfolgt ist. Einige Zahlungsmethoden benötigen auch 2 bis 14 Tage bis zur Zahlungsbestätigung. Wenn Sie Ihre Integration so einrichten, dass sie asynchrone Ereignisse überwacht, können Sie mehrere [Zahlungsmethoden](https://stripe.com/payments/payment-methods-guide) mit einer einzelnen Integration akzeptieren. Neben der Abwicklung des Ereignisses `checkout.session.completed` empfehlen wir die Abwicklung von zwei weiteren Ereignissen, wenn Sie Zahlungen mit Checkout erfassen: | Ereignis | Beschreibung | Nächste Schritte | | -------------------------------------------------------------------------------------------------------------------------------------------- | ---------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------ | | [checkout.session.completed](https://docs.stripe.com/api/events/types.md#event_types-checkout.session.completed) | Der Kunde/die Kundin hat die Zahlung nach der Übermittlung des Checkout-Formulars erfolgreich autorisiert. | Warten Sie, bis die Zahlung erfolgt ist oder fehlschlägt. | | [checkout.session.async_payment_succeeded](https://docs.stripe.com/api/events/types.md#event_types-checkout.session.async_payment_succeeded) | Die Kundenzahlung war erfolgreich. | Führen Sie die Bestellung der gekauften Waren oder Dienstleistungen aus. | | [checkout.session.async_payment_failed](https://docs.stripe.com/api/events/types.md#event_types-checkout.session.async_payment_failed) | Die Zahlung wurde abgelehnt oder ist aus einem anderen Grund fehlgeschlagen. | Kontaktieren Sie den Kunden/die Kundin per E-Mail und fordern Sie eine neue Bestellung von ihm/ihr an. | Diese Ereignisse beinhalten das [Checkout-Sitzungsobjekt](https://docs.stripe.com/api/checkout/sessions.md). Nach erfolgreicher Zahlung ändert sich der Status des zugrunde liegenden *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) von `processing` zu `succeeded`. #### Personalisierter Ablauf ### PaymentIntent erstellen (Serverseitig) Stripe verwendet ein [PaymentIntent](https://docs.stripe.com/api/payment_intents.md)-Objekt, um Ihre Absicht darzustellen, eine Kundenzahlung einzuziehen. Dabei werden die Abbuchungsversuche und Zahlungsstatusänderungen während des gesamten Vorgangs dokumentiert. > Wenn Sie das Payment Element vor dem Erstellen eines PaymentIntent rendern möchten, finden Sie weitere Informationen unter [Erfassen von Zahlungsdetails vor dem Erstellen eines Intent](https://docs.stripe.com/payments/accept-a-payment-deferred.md?type=payment). ![Ein Übersichtsdiagramm des gesamten Zahlungsablaufs](https://b.stripecdn.com/docs-statics-srv/assets/accept-a-payment-payment-element.5cf6795a02f864923f9953611493d735.svg) Die Zahlungsmethoden, die Kundinnen/Kunden während des Bezahlvorgangs angezeigt werden, sind ebenfalls im PaymentIntent enthalten. Sie können Zahlungsmethoden durch Stripe automatisch aus Ihren Dashboard-Einstellungen abrufen lassen oder sie manuell auflisten. Sofern Ihre Integration keine codebasierte Option zum Anbieten von Zahlungsmethoden erfordert, listen Sie Zahlungsmethoden nicht manuell auf. Stripe wertet die Währung, die Einschränkungen für Zahlungsmethoden und andere Parameter aus, um die Liste der unterstützten Zahlungsmethoden zu ermitteln. Stripe priorisiert Zahlungsmethoden, die die Konversion steigern und die für die Währung und den Standort des Kunden/der Kundin am relevantesten sind. Wir verbergen Zahlungsmethoden mit niedrigerer Priorität in einem Überlaufmenü. #### Zahlungsmethoden über das Dashboard verwalten ```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 ``` Beim Erstellen eines PaymentIntent müssen Sie bestimmte Parameter angeben: - `amount` und `currency` – Erstellen Sie einen PaymentIntent auf Ihrem Server mit einem Betrag und einer Währung. - (Optional) `automatic_payment_methods` – In der neuesten Version der API müssen Sie diesen Parameter nicht angeben, da Stripe seine Funktionalität standardmäßig aktiviert. Zahlungsmethoden können Sie über die [Dashboard](https://dashboard.stripe.com/settings/payment_methods) verwalten. Stripe gibt automatisch geeignete Zahlungsmethoden basierend auf Faktoren wie Betrag, Währung und Zahlungsablauf der Transaktion zurück. - (Optional) `payment_intent_data[application_fee_amount]` – Dieses Argument bestimmt den Betrag, den Ihre Plattform von der Transaktion abziehen möchte. Wenn Sie das [Platform Pricing Tool](https://docs.stripe.com/connect/platform-pricing-tools.md) von Stripe verwenden, um die Preisgestaltung für Plattformgebühren vom [Dashboard](https://dashboard.stripe.com/test/settings/connect/platform_pricing/payments) aus zu verwalten, sollten Sie dieses Argument nicht einfügen, da es die vom Tool festgelegte Preislogik überschreibt. Nachdem die Zahlung auf dem verbundenen Konto abgewickelt wurde, wird der `application_fee_amount` an die Plattform übertragen, und die Stripe Gebühr wird vom Guthaben des verbundenen Kontos abgezogen. #### Zahlungsmethoden manuell auflisten ```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 ``` Beim Erstellen eines PaymentIntent müssen Sie bestimmte Parameter angeben: - `amount` – Erstellen Sie einen PaymentIntent auf Ihrem Server mit einem bestimmten Betrag. Bestimmen Sie immer auf der Serverseite, wie viel berechnet werden soll, da dies eine vertrauenswürdige Umgebung ist. Dieser Ansatz verhindert, dass böswillige Kundinnen und Kunden ihre eigenen Preise wählen können. - `currency` – Die Währung, die Sie in den PaymentIntent aufnehmen, filtert die Zahlungsmethoden, die dem Kunden/der Kundin angezeigt werden. Wählen Sie also die Zahlungsmethode aus, die Sie anbieten möchten. Wenn Sie beispielsweise `eur` übergeben und OXXO im Dashboard aktiviert ist, wird OXXO dem Kunden/der Kundin nicht angezeigt, da `eur`-Zahlungen nicht unterstützt werden. Einige Zahlungsmethoden unterstützen mehrere Währungen und Länder. Im Beispielcode dieses Leitfadens werden Bancontact, Kreditkarten, EPS, iDEAL, Przelewy24, SEPA-Lastschriften und Sofort verwendet. - `"payment_method_types[]"` – Führen Sie manuell alle Zahlungsmethoden auf, die Sie unterstützen möchten. - (Optional) `payment_intent_data[application_fee_amount]` – Dieses Argument bestimmt den Betrag, den Ihre Plattform von der Transaktion abziehen möchte. Wenn Sie das [Platform Pricing Tool](https://docs.stripe.com/connect/platform-pricing-tools.md) von Stripe verwenden, um die Preisgestaltung für Plattformgebühren vom [Dashboard](https://dashboard.stripe.com/test/settings/connect/platform_pricing/payments) aus zu verwalten, sollten Sie dieses Argument nicht einfügen, da es die vom Tool festgelegte Preislogik überschreibt. Nachdem die Zahlung auf dem verbundenen Konto abgewickelt wurde, wird der `application_fee_amount` an die Plattform übertragen, und die Stripe Gebühr wird vom Guthaben des verbundenen Kontos abgezogen. > Jede Zahlungsmethode muss die im PaymentIntent übergebene Währung unterstützen, und Ihr Unternehmen muss in einem der Länder niedergelassen sein, das von jeder Zahlungsmethode unterstützt wird. Auf der Seite [Integrationsoptionen für Zahlungsmethoden](https://docs.stripe.com/payments/payment-methods/integration-options.md) finden Sie weitere Informationen zu den unterstützten Optionen. ### Client-Geheimnis abrufen Im PaymentIntent ist ein *Client-Geheimnis* (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)) enthalten, das auf dem Client verwendet wird, um Zahlungen sicher abzuschließen. Es gibt verschiedene Verfahren zum Übergeben des Client-Geheimnisses an den Client. #### Einseitige Anwendung Rufen Sie das Client-Geheimnis von einem Endpoint auf Ihrem Server ab, indem Sie die Browser-Funktion `fetch` verwenden. Diese Vorgehensweise funktioniert am besten, wenn es sich bei Ihrer Client-Seite um eine einseitige Anwendung handelt, insbesondere wenn sie mit einem modernen Frontend-Framework wie React erstellt wurde. Erstellen Sie den Server-Endpoint, der das Client-Geheimnis bereitstellt: #### Ruby ```ruby get '/secret' do intent = # ... Create or retrieve the PaymentIntent {client_secret: intent.client_secret}.to_json end ``` Und dann rufen Sie das Client-Geheimnis mit JavaScript auf der Client-Seite ab: ```javascript (async () => { const response = await fetch('/secret'); const {client_secret: clientSecret} = await response.json(); // Render the form using the clientSecret })(); ``` #### Serverseitiges Rendering Übergeben Sie das Client-Geheimnis von Ihrem Server an den Client. Diese Vorgehensweise funktioniert am besten, wenn Ihre Anwendung statische Inhalte auf dem Server generiert, bevor sie an den Browser gesendet werden. Fügen Sie das [client_secret](https://docs.stripe.com/api/payment_intents/object.md#payment_intent_object-client_secret) in Ihr Bezahlformular ein. Rufen Sie in Ihrem serverseitigen Code das Client-Geheimnis aus dem PaymentIntent ab: #### Ruby ```erb
``` ```ruby get '/checkout' do @intent = # ... Fetch or create the PaymentIntent erb :checkout end ``` ### Zahlungsdetails erfassen (Clientseitig) Erfassen Sie mit dem Payment Element Zahlungsdaten auf dem Client. Das Payment Element ist eine vorgefertigte Komponente der Nutzeroberfläche, das die Erfassung von Zahlungsdaten für verschiedene Zahlungsmethoden vereinfacht. Das Payment Element enthält einen iFrame, der Zahlungsinformationen über eine sichere HTTPS-Verbindung an Stripe sendet. Vermeiden Sie es, das Payment Element in einem anderen iFrame zu platzieren, da einige Zahlungsmethoden die Weiterleitung an eine andere Seite zur Zahlungsbestätigung voraussetzen. Die Adresse der Bezahlseite muss mit `https://` beginnen, nicht mit `http://`, damit Ihre Integration funktioniert. Sie können Ihre Integration ohne HTTPS testen. Denken Sie jedoch daran, dieses zu [aktivieren](https://docs.stripe.com/security/guide.md#tls), wenn Sie bereit sind, Live-Zahlungen zu akzeptieren. #### Stripe.js einrichten #### HTML + JS Das Payment Element ist ein Feature von Stripe.js und steht damit automatisch zur Verfügung. Fügen Sie das Stripe.js-Skript auf Ihrer Bezahlseite ein, indem Sie es in den `head` Ihrer HTML-Datei einbinden. Laden Sie Stripe.js immer direkt von js.stripe.com, um die PCI-Konformität zu gewährleisten. Fügen Sie das Skript nicht in ein Paket ein und hosten Sie selbst keine Kopie davon. ```html Checkout ``` Erstellen Sie auf Ihrer Bezahlseite eine Instanz von `Stripe`mit dem folgenden JavaScript: ```javascript // Initialize Stripe.js with the same connected account ID used when creating // the PaymentIntent. const stripe = Stripe('<>', { stripeAccount: '{{CONNECTED_ACCOUNT_ID}}' }); ``` #### Stripe Elements und das Payment Element zu Ihrer Zahlungsseite hinzufügen Das Payment Element benötigt einen festen Platz auf Ihrer Zahlungsseite. Erstellen Sie einen leeren DOM-Knoten (Container) mit einer eindeutigen ID in Ihrem Zahlungsformular. ```html
``` Wenn das Formular geladen wurde, erstellen Sie eine Instanz des Payment Element und verbinden Sie es zusammen mit dem [Client-Geheimnis](https://docs.stripe.com/api/payment_intents/object.md#payment_intent_object-client_secret) aus dem vorherigen Schritt mit dem Container-DOM-Knoten. Übergeben Sie diesen Wert als Option, wenn Sie die Instanz von [Elements](https://docs.stripe.com/js/elements_object/create) erstellen. Gehen Sie vorsichtig mit dem Client-Geheimnis um, da mit ihm die Zahlung abgeschlossen werden kann. Es darf nicht protokolliert, in URLs eingebettet oder Personen außer dem Kunden/der Kundin selbst zugänglich gemacht werden. ```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"); ``` Das Payment Element stellt ein dynamisches Formular dar, mit dem Ihre Kundinnen und Kunden eine Zahlungsmethode auswählen können. Das Formular erfasst automatisch alle erforderlichen Zahlungsdetails für die vom Kunden/der Kundin ausgewählte Zahlungsmethode. Sie können die [Darstellung des Payment Element](https://docs.stripe.com/elements/appearance-api.md) an das Design Ihrer Website anpassen, wenn Sie das Objekt `Elements` einrichten. #### React Installieren Sie [React Stripe.js](https://www.npmjs.com/package/@stripe/react-stripe-js) und den [Stripe.js-Loader](https://www.npmjs.com/package/@stripe/stripe-js) aus dem öffentlichen npm-Register: ```bash npm install --save @stripe/react-stripe-js @stripe/stripe-js ``` ### Den Elements-Anbieter zu Ihrer Zahlungsseite hinzufügen und konfigurieren Um die Payment Element-Komponente zu verwenden, schließen Sie die Bezahlseitenkomponente in einem [Elements-Anbieter](https://docs.stripe.com/sdks/stripejs-react.md#elements-provider) ein. Rufen Sie `loadStripe` mit Ihrem veröffentlichbaren Schlüssel auf und übergeben Sie das zurückgegebene `Promise` zusammen mit dem [Client-Geheimnis](https://docs.stripe.com/api/payment_intents/object.md#payment_intent_object-client_secret) aus dem vorherigen Schritt als `options` im `Elements`-Anbieter. ```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')); ``` #### PaymentElement-Komponente hinzufügen Verwenden Sie die Komponente `PaymentElement`, um Ihr Formular zu erstellen. ```jsx import React from 'react'; import {PaymentElement} from '@stripe/react-stripe-js'; const CheckoutForm = () => { return (
); }; export default CheckoutForm; ``` Das Payment Element stellt ein dynamisches Formular dar, mit dem Ihre Kundinnen und Kunden eine Zahlungsmethode auswählen können. Das Formular erfasst automatisch alle erforderlichen Zahlungsdetails für die vom Kunden/der Kundin ausgewählte Zahlungsmethode. Sie können die [Darstellung des Payment Element](https://docs.stripe.com/elements/appearance-api.md) an das Design Ihrer Website anpassen, wenn Sie den `Elements`-Anbieter konfigurieren. ### Zahlung an Stripe senden (Clientseitig) Verwenden Sie [stripe.confirmPayment](https://docs.stripe.com/js/payment_intents/confirm_payment), um die Zahlung mit Details aus dem Payment Element vorzunehmen. Geben Sie für diese Funktion eine [return_url](https://docs.stripe.com/api/payment_intents/create.md#create_payment_intent-return_url) an, um anzugeben, wohin Stripe die Nutzer/innen nach Durchführung der Zahlung weiterleiten soll. Ihre Nutzer/innen werden möglicherweise zunächst an eine zwischengeschaltete Seite weitergeleitet, wie z. B. eine Bankautorisierungsseite, bevor sie zur `return_url` weitergeleitet werden. Kartenzahlungen werden sofort zur `return_url` weitergeleitet, wenn eine Zahlung erfolgreich war. Wenn Sie Kartenzahlungen nach Abschluss der Zahlung nicht weiterleiten möchten, können Sie [redirect](https://docs.stripe.com/js/payment_intents/confirm_payment#confirm_payment_intent-options-redirect) auf `if_required` festlegen. Dadurch werden nur Kundinnen/Kunden weitergeleitet, die mit weiterleitungsbasierten Zahlungsmethoden bezahlen. #### 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 Verwenden Sie die Hooks [useStripe](https://docs.stripe.com/sdks/stripejs-react.md#usestripe-hook) und [useElements](https://docs.stripe.com/sdks/stripejs-react.md#useelements-hook), um [stripe.confirmPayment](https://docs.stripe.com/js/payment_intents/confirm_payment) über die Komponente Ihres Zahlungsformulars aufzurufen. Wenn Sie herkömmliche Klassenkomponenten gegenüber Hooks bevorzugen, können Sie stattdessen einen [ElementsConsumer](https://docs.stripe.com/sdks/stripejs-react.md#elements-consumer) verwenden. ```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; ``` Achten Sie darauf, dass die `return_url` auf eine Seite Ihrer Website verweist, die den Status der Zahlung angibt. Wenn Stripe den/die Kund/in an die `return_url` weiterleitet, stellen wir die folgenden URL-Abfrageparameter bereit: | Parameter | Beschreibung | | ------------------------------ | ---------------------------------------------------------------------------------------------------------------------------------------------- | | `payment_intent` | Die eindeutige ID für die `PaymentIntent`. | | `payment_intent_client_secret` | Das [Client-Geheimnis](https://docs.stripe.com/api/payment_intents/object.md#payment_intent_object-client_secret) des `PaymentIntent`-Objekts. | > Wenn Sie über Tools verfügen, die die Browser-Sitzung der Kund/innen verfolgen, müssen Sie möglicherweise die Domain `stripe.com` zur Referenz-Ausschlussliste hinzufügen. Weiterleitungen haben zur Folge, dass einige Tools neue Sitzungen erstellen. Dies wiederum hindert Sie daran, die gesamte Sitzung zu verfolgen. Verwenden Sie einen der Abfrageparameter, um den PaymentIntent abzurufen. Überprüfen Sie den [Status des PaymentIntent](https://docs.stripe.com/payments/paymentintents/lifecycle.md), um zu entscheiden, was Ihren Kundinnen/Kunden angezeigt werden soll. Sie können bei der Angabe der `return_url` auch Ihre eigenen Abfrageparameter anhängen, die während des Weiterleitungsvorgangs erhalten bleiben. #### 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; ``` ### Mit Ereignissen nach der Zahlung umgehen (Serverseitig) Stripe sendet ein [payment_intent.succeeded](https://docs.stripe.com/api/events/types.md#event_types-payment_intent.succeeded)-Ereignis, wenn die Zahlung abgeschlossen ist. Verwenden Sie [Webhook-Tool im Dashboard](https://dashboard.stripe.com/webhooks) oder folgen Sie der [Webhook-Anleitung](https://docs.stripe.com/webhooks/quickstart.md), um diese Ereignisse zu empfangen und führen Sie Aktionen aus, wie beispielsweise das Senden einer Bestellbestätigung per E-Mail, das Protokollieren des Verkaufs in der Datenbank oder das Starten eines Versand-Workflows. Überwachen Sie diese Ereignisse, statt auf einen Callback vom Client zu warten. Auf dem Client könnten die Kund/innen das Browserfenster schließen oder die App beenden, bevor der Callback erfolgt ist. Bösartige Clients könnten dann die Antwort manipulieren. Wenn Sie Ihre Integration so einrichten, dass sie asynchrone Ereignisse überwacht, können Sie [verschiedene Arten von Zahlungsmethoden](https://stripe.com/payments/payment-methods-guide) mit einer einzelnen Integration akzeptieren. Neben der Abwicklung des `payment_intent.succeeded`-Ereignisses empfehlen wir die Abwicklung von diesen weiteren Ereignissen, wenn Sie Zahlungen mit dem Payment Element erfassen: | Ereignis | Beschreibung | Aktion | | ------------------------------------------------------------------------------------------------------------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | | [payment_intent.succeeded](https://docs.stripe.com/api/events/types.md?lang=php#event_types-payment_intent.succeeded) | Wird gesendet, wenn Kundinnen und Kunden eine Zahlung erfolgreich abgeschlossen haben. | Senden Sie den Kund/innen eine Auftragsbestätigung und *wickeln* (Fulfillment is the process of providing the goods or services purchased by a customer, typically after payment is collected) Sie die Bestellung ab. | | [payment_intent.processing](https://docs.stripe.com/api/events/types.md?lang=php#event_types-payment_intent.processing) | Wird gesendet, wenn eine/e Kund/in eine Zahlung erfolgreich veranlasst hat, die Zahlung aber noch nicht abgeschlossen ist. Dieses Ereignis wird am häufigsten gesendet, wenn der Kunde/die Kundin eine Bankabbuchung veranlasst. In Zukunft folgt darauf entweder ein `payment_intent.succeeded`- oder ein `payment_intent.payment_failed`-Ereignis. | Senden Sie eine Bestellbestätigung an die Kund/innen, in der angegeben ist, dass die Zahlung noch aussteht. Bei digitalen Waren können Sie die Bestellung abwickeln, bevor Sie darauf warten, dass die Zahlung erfolgt. | | [payment_intent.payment_failed](https://docs.stripe.com/api/events/types.md?lang=php#event_types-payment_intent.payment_failed) | Wird gesendet, wenn ein Kunde/eine Kundin einen Zahlungsversuch durchführt, die Zahlung jedoch fehlschlägt. | Wenn eine Zahlung von `processing` zu `payment_failed` übergeht, bieten Sie der Kundin/dem Kunden einen weiteren Zahlungsversuch an. | ## Testen Testen Sie Ihren Ablauf zur Kontoerstellung, indem Sie [Konten erstellen](https://docs.stripe.com/connect/testing.md#creating-accounts) und [OAuth verwenden](https://docs.stripe.com/connect/testing.md#using-oauth). Testen Sie Ihre Einstellungen für **Zahlungsmethoden** für Ihre verbundenen Konten, indem Sie sich bei einem Ihrer Testkonten anmelden und zu den [Einstellungen für Zahlungsmethoden](https://dashboard.stripe.com/settings/payment_methods) navigieren. Testen Sie Ihren Bezahlvorgang mit Ihren Testschlüsseln und einem Testkonto. Mit den [verfügbaren Testkarten](https://docs.stripe.com/testing.md) können Sie außerdem Ihren Zahlungsablauf testen und verschiedene Zahlungsbedingungen simulieren. # Zahlungsformular > This is a Zahlungsformular for when platform is ios and mobile-ui is payment-sheet. View the full page at https://docs.stripe.com/connect/end-to-end-saas-platform?platform=ios&mobile-ui=payment-sheet. ![](https://b.stripecdn.com/docs-statics-srv/assets/ios-overview.9e0d68d009dc005f73a6f5df69e00458.png) Integrieren Sie die vorgefertigte Zahlungs-UI von Stripe in den Bezahlvorgang Ihrer iOS app mit der [PaymentSheet](https://stripe.dev/stripe-ios/stripe-paymentsheet/Classes/PaymentSheet.html)-Klasse. Sehen Sie sich unsere Beispielintegration [auf GitHub](https://github.com/stripe/stripe-ios/tree/master/Example/PaymentSheet%20Example) an. > #### Accounts v2 API unterstützt > > Das Payment Sheet unterstützt *von Kund/innen konfigurierte Konten* nicht. Es unterstützt nur `Kund/innen`-Objekte. ## Voraussetzungen 1. [Registrieren Sie Ihre Plattform](https://dashboard.stripe.com/connect). 1. [Unternehmensdetails im Dashboard überprüfen und hinzufügen](https://dashboard.stripe.com/account/onboarding). 1. [Vervollständigen Sie Ihr Plattform-Profil](https://dashboard.stripe.com/connect/settings/profile). 1. [Passen Sie Ihre Markeneinstellungen an](https://dashboard.stripe.com/settings/connect/stripe-dashboard/branding). Fügen Sie einen Firmennamen, ein Symbol und eine Markenfarbe hinzu. ## Stripe einrichten [Serverseitig] [Clientseitig] Zunächst benötigen Sie ein Stripe-Konto. [Jetzt registrieren](https://dashboard.stripe.com/register). ### Serverseitig Diese Integration erfordert Endpoints auf Ihrem Server, die mit der Stripe-API kommunizieren können. Nutzen Sie unsere offiziellen Bibliotheken für den Zugriff auf die Stripe-API von Ihrem Server aus: #### Ruby ```bash # Available as a gem sudo gem install stripe ``` ```ruby # If you use bundler, you can add this line to your Gemfile gem 'stripe' ``` ### Clientseitig Das [Stripe iOS SDK](https://github.com/stripe/stripe-ios) ist Open Source, [vollständig dokumentiert](https://stripe.dev/stripe-ios/index.html) und kompatibel mit Apps, die iOS 13 oder höher unterstützen. #### Swift Package Manager Führen Sie zur Installation des SDK die folgenden Schritte aus: 1. Wählen Sie in Xcode **Datei** > **Add Package Dependencies** (Paketabhängigkeiten hinzufügen) aus und geben Sie als Repository-URL `https://github.com/stripe/stripe-ios-spm` ein. 1. Wählen auf unserer [Veröffentlichungsseite](https://github.com/stripe/stripe-ios/releases) die neueste Version aus. 1. Fügen Sie das Produkt **StripePaymentSheet** zum [Ziel Ihrer App](https://developer.apple.com/documentation/swift_packages/adding_package_dependencies_to_your_app) hinzu. #### CocoaPods 1. Falls noch nicht geschehen, installieren Sie bitte die aktuellste Version von [CocoaPods](https://guides.cocoapods.org/using/getting-started.html). 1. Wenn Sie keine bestehende [Podfile](https://guides.cocoapods.org/syntax/podfile.html) haben, führen Sie folgenden Befehl aus, um eine zu erstellen: ```bash pod init ``` 1. Fügen Sie folgende Zeile in Ihre `Podfile` ein: ```podfile pod 'StripePaymentSheet' ``` 1. Führen Sie folgenden Befehl aus: ```bash pod install ``` 1. Vergessen Sie nicht, ab jetzt in Zukunft anstelle der Datei `.xcodeproj` die Datei `.xcworkspace` zum Öffnen Ihres Projekts in Xcode zu verwenden. 1. Führen Sie für zukünftige Updates auf die jeweils aktuelle Version des SDK Folgendes aus: ```bash pod update StripePaymentSheet ``` #### Carthage 1. Falls noch nicht geschehen, installieren Sie bitte die aktuelle Version von [Carthage](https://github.com/Carthage/Carthage#installing-carthage). 1. Fügen Sie folgende Zeile in Ihre `Cartfile` ein: ```cartfile github "stripe/stripe-ios" ``` 1. Befolgen Sie die [Carthage-Installationsanweisungen](https://github.com/Carthage/Carthage#if-youre-building-for-ios-tvos-or-watchos). Vergewissern Sie sich, dass Sie alle [hier](https://github.com/stripe/stripe-ios/tree/master/StripePaymentSheet/README.md#manual-linking) aufgeführten erforderlichen Frameworks einbetten. 1. Führen Sie für zukünftige Updates auf die aktuelle Version unseres SDK einfach folgenden Befehl aus: ```bash carthage update stripe-ios --platform ios ``` #### Manuelles Framework 1. Gehen Sie auf unsere [GitHub-Release-Seite](https://github.com/stripe/stripe-ios/releases/latest), laden Sie **Stripe.xcframework.zip** herunter und entpacken Sie die Datei. 1. Ziehen Sie **StripePaymentSheet.xcframework** in den Abschnitt **Embedded Binaries** (Eingebettete Binärdateien) der Einstellungen unter **General** (Allgemeines) Ihres Xcode-Projekts. Aktivieren Sie dabei die Option **Copy items if needed** (Elemente kopieren, falls nötig). 1. Wiederholen Sie Schritt 2 für alle [hier](https://github.com/stripe/stripe-ios/tree/master/StripePaymentSheet/README.md#manual-linking) aufgeführten erforderlichen Frameworks. 1. Wiederholen Sie für zukünftige Updates auf die jeweils aktuelle Version des SDK die Schritte 1–3. > Details zur aktuellen SDK-Version und zu vorherigen Versionen finden Sie auf der Seite [Releases](https://github.com/stripe/stripe-ios/releases) auf GitHub. Um bei Veröffentlichung einer neuen Version eine Benachrichtigung zu erhalten, [achten Sie auf die Releases zum jeweiligen Repository](https://help.github.com/en/articles/watching-and-unwatching-releases-for-a-repository#watching-releases-for-a-repository). Konfigurieren Sie das SDK mit Ihrem [veröffentlichbaren Schlüssel](https://dashboard.stripe.com/test/apikeys) von Stripe, um es beim Start der App auszuführen. Dadurch kann Ihre App Anfragen an die Stripe-API senden. #### Swift ```swift import UIKitimportStripePaymentSheet @main class AppDelegate: UIResponder, UIApplicationDelegate { func application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey: Any]?) -> Bool {StripeAPI.defaultPublishableKey = "<>" // do any other necessary launch configuration return true } } ``` > Verwenden Sie Ihre [Testschlüssel](https://docs.stripe.com/keys.md#obtain-api-keys) beim Testen und Entwickeln Ihrer App und Ihre [Live-Modus](https://docs.stripe.com/keys.md#test-live-modes)-Schlüssel beim Veröffentlichen Ihrer App. ## Verbundenes Konto erstellen Wenn sich Nutzer/innen (Verkäufer/innen oder Dienstleister/innen) auf Ihrer Plattform registrieren, erstellen Sie ein [Nutzerkonto](https://docs.stripe.com/api/accounts.md) (auch *verbundenes Konto* genannt), damit Sie Zahlungen einziehen und anschließend an die Nutzer/innen auszahlen können. Verbundene Konten entsprechen in der API von Stripe Ihren Nutzerinnen und Nutzern und helfen, die für deren Identitätsprüfung erforderlichen Informationen zu erfassen. In unserem Beispiel mit der Store-Builder-Plattform ist das verbundene Konto das Unternehmen, das einen Online-Shop einrichtet. ![Ablauf der Kontoerstellung](https://b.stripecdn.com/docs-statics-srv/assets/standard-ios.10c6b24cef1d683d36f2264c726beb1d.png) ### Schritt 2.1: Verbundenes Konto erstellen und Informationen vorab angeben (Server-side) Verwenden Sie die `/v1/accounts` API, um ein verbundenes Konto zu [erstellen](https://docs.stripe.com/api/accounts/create.md). Sie können das verbundene Konto erstellen, indem Sie die [Standardparameter des verbundenen Kontos](https://docs.stripe.com/connect/migrate-to-controller-properties.md) verwenden oder den Kontotyp angeben. #### Mit Standardeigenschaften ```curl curl -X POST https://api.stripe.com/v1/accounts \ -u "<>:" ``` #### Mit Kontotyp ```curl curl https://api.stripe.com/v1/accounts \ -u "<>:" \ -d type=standard ``` Falls Sie bereits Informationen für Ihre verbundenen Konten erfasst haben, können Sie diese im `Account`-Objekt vorab angeben. Sie können alle Kontoinformationen vorab ausfüllen, einschließlich persönlicher und geschäftlicher Informationen, externer Kontoinformationen usw. Nachdem Sie das `Account` erstellt haben, erstellen Sie eine [Person](https://docs.stripe.com/api/persons/create.md), die die für die Kontoeröffnung verantwortliche Person repräsentiert, wobei Sie `relationship.representative` auf „true“ setzen und alle Kontoinformationen, die Sie vorab ausfüllen möchten (z. B. Vor- und Nachname), eingeben. ```curl curl https://api.stripe.com/v1/accounts/{{ACCOUNT_ID}}/persons \ -u "<>:" \ -d first_name=Jenny \ -d last_name=Rosen \ -d "relationship[representative]=true" ``` Connect Onboarding fragt keine vorab ausgefüllten Informationen ab. Kontoinhaber/innen müssen vorausgefüllte Informationen jedoch bestätigen, bevor sie den [Connect-Rahmenvertrag](https://docs.stripe.com/connect/service-agreement-types.md) akzeptieren können. Füllen Sie beim Testen Ihrer Integration die Kontoinformationen vorab mit [Testdaten](https://docs.stripe.com/connect/testing.md) aus. ### Schritt 2.2: Konto-Link erstellen (Server-side) Sie können einen Konto-Link erstellen, indem Sie die [Account Links](https://docs.stripe.com/api/account_links.md) API mit den folgenden Parametern aufrufen: - `account` - `refresh_url` - `return_url` - `type` = `account_onboarding` ```curl curl https://api.stripe.com/v1/account_links \ -u "<>:" \ -d "account={{CONNECTEDACCOUNT_ID}}" \ --data-urlencode "refresh_url=https://example.com/reauth" \ --data-urlencode "return_url=https://example.com/return" \ -d type=account_onboarding ``` ### Schritt 2.3: Nutzer/innen an die Konto-Link-URL weiterleiten (Client-side) Die Antwort auf Ihre [Account Links](https://docs.stripe.com/api/account_links.md)-Anforderung enthält einen Wert für den Schlüssel `url`. Leiten Sie Ihre Nutzer/innen an diesen Link weiter, um sie an das Verfahren zu übergeben. Konto-Links sind temporär und können nur einmal verwendet werden, da sie Zugang zu den persönlichen Daten der Inhaber/innen der verbundenen Konten gewähren. Führen Sie die Authentifizierung der Nutzer/innen in Ihrer Anwendung durch, bevor Sie sie an diese URL weiterleiten. Wenn Sie Informationen vorab angeben möchten, müssen Sie dies vor der Erstellung des Konto-Links tun. Nach der Erstellung des Konto-Links für ein Standard-Konto können Informationen für das Konto weder gelesen noch geschrieben werden. > Versenden Sie keine Konto-Link-URLs per E-Mail, Textnachricht oder anderweitig außerhalb Ihrer Plattformanwendung. Stellen Sie die URLs Ihren authentifizierten Kontoinhaberinnen und Kontoinhabern stattdessen in Ihrer Anwendung zur Verfügung. #### Swift ```swift import UIKit import SafariServices let BackendAPIBaseURL: String = "" // Set to the URL of your backend server class ConnectOnboardViewController: UIViewController { // ... override func viewDidLoad() { super.viewDidLoad() let connectWithStripeButton = UIButton(type: .system) connectWithStripeButton.setTitle("Connect with Stripe", for: .normal) connectWithStripeButton.addTarget(self, action: #selector(didSelectConnectWithStripe), for: .touchUpInside) view.addSubview(connectWithStripeButton) // ... } @objc func didSelectConnectWithStripe() { if let url = URL(string: BackendAPIBaseURL)?.appendingPathComponent("onboard-user") { var request = URLRequest(url: url) request.httpMethod = "POST" let task = URLSession.shared.dataTask(with: request) { (data, response, error) in guard let data = data, let json = try? JSONSerialization.jsonObject(with: data, options: []) as? [String : Any], let accountURLString = json["url"] as? String, let accountURL = URL(string: accountURLString) else { // handle error } let safariViewController = SFSafariViewController(url: accountURL) safariViewController.delegate = self DispatchQueue.main.async { self.present(safariViewController, animated: true, completion: nil) } } } } // ... } extension ConnectOnboardViewController: SFSafariViewControllerDelegate { func safariViewControllerDidFinish(_ controller: SFSafariViewController) { // the user may have closed the SFSafariViewController instance before a redirect // occurred. Sync with your backend to confirm the correct state } } ``` ### Schritt 2.4: Rückkehr der Nutzer/innen zu Ihrer Plattform steuern (Client-side) *Connect* (Connect is Stripe's solution for multi-party businesses, such as marketplace or software platforms, to route payments between sellers, customers, and other recipients) Onboarding verlangt, dass Sie sowohl eine `return_url` als auch eine `refresh_url` übergeben, um alle Fälle steuern zu können, in denen die Nutzer/innen an Ihre Plattform weitergeleitet werden. Es ist wichtig, dass Sie diese URLs korrekt implementieren, um Ihren Nutzerinnen/Nutzern die bestmögliche Erfahrung zu bieten. Sie können einen [universellen Link](https://developer.apple.com/documentation/xcode/allowing-apps-and-websites-to-link-to-your-content) einrichten, damit iOS automatisch zur Ihrer App weiterleiten kann. #### return_url Stripe löst eine Weiterleitung zu dieser URL aus, wenn die Nutzer/innen das Connect Onboarding abschließen. Das heißt nicht, dass alle Informationen erfasst wurden oder keine offenen Anforderungen für das Konto bestehen. Es bedeutet lediglich, dass die Nutzer/innen das Verfahren ordnungsgemäß durchlaufen und beendet haben. Über diese URL wird kein Status übergeben. Nachdem ein/eine Nutzer/in zu Ihrer `return_url` weitergeleitet wurde, überprüfen Sie den Status des Parameters `details_submitted` für das jeweilige Konto, indem Sie eine der folgenden Aktionen ausführen: - Überwachen von `account.updated` *webhooks* (A webhook is a real-time push notification sent to your application as a JSON payload through HTTPS requests) - Rufen Sie die [Accounts](https://docs.stripe.com/api/accounts.md)-API auf und prüfen Sie das zurückgegebene Objekt. #### refresh_url Stripe leitet Ihre Nutzer/innen in den folgenden Fällen an die `refresh_url` weiter: - Der Link ist abgelaufen (seit Erstellung des Links sind ein paar Minuten vergangen). - Der/die Nutzer/in hat den Link bereits aufgerufen (er/sie hat die Seite aktualisiert oder auf die Zurück/Vorwärts-Schaltfläche geklickt) - Ihre Plattform hat keinen Zugang mehr zu diesem Konto. - Das Konto wurde abgelehnt. Ihre `refresh_url` sollte eine Methode auf Ihrem Server auslösen, um [Account Links](https://docs.stripe.com/api/account_links.md) erneut mit denselben Parametern aufzurufen und Nutzer/innen an das Connect Onboarding zurückzuleiten, damit ein nahtloses Erlebnis entsteht. ### Schritt 2.5: Umgang mit Nutzer/innen, die das Onboarding nicht abgeschlossen haben Wenn Nutzer/innen an Ihre `return_url` weitergeleitet werden, haben sie das Onboarding möglicherweise nicht abgeschlossen. Rufen Sie mithilfe des Endpoints `/v1/accounts` das Nutzerkonto auf und prüfen Sie den Wert für `charges_enabled`. Wenn das Onboarding für das Konto nicht komplett abgeschlossen wurde, geben Sie den Nutzerinnen/Nutzern mithilfe entsprechender Eingabeaufforderungen der Nutzeroberfläche die Möglichkeit, das Onboarding zu einem späteren Zeitpunkt fortzusetzen. Diese können ihre Konto-Aktivierung dann über einen neuen (von Ihrer Integration generierten) Link abschließen. Anhand des Status des Parameters `details_submitted` im Nutzerkonto können Sie überprüfen, ob das Onboarding abgeschlossen wurde. ## Zahlungsmethoden aktivieren Zeigen Sie die [Einstellungen für Ihre Zahlungsmethoden](https://dashboard.stripe.com/settings/connect/payment_methods) an und aktivieren Sie die Zahlungsmethoden, die Sie unterstützen möchten. Kartenzahlungen werden standardmäßig aktiviert, aber Sie können Zahlungsmethoden nach Bedarf aktivieren und deaktivieren. ## Endpoint hinzufügen [Serverseitig] > #### Hinweis > > Um das PaymentSheet vor dem Erstellen eines PaymentIntent anzuzeigen, finden Sie weitere Informationen unter [Erfassen von Zahlungsdetails vor dem Erstellen eines Intent](https://docs.stripe.com/payments/accept-a-payment-deferred.md?type=payment). Diese Integration verwendet drei Stripe-API-Objekte: 1. [PaymentIntent](https://docs.stripe.com/api/payment_intents.md): Stripe verwendet diesen, um Ihre Absicht darzustellen, Zahlungen von Ihren Kundinnen/Kunden anzufordern, wobei Abbuchungsversuche und Zahlungsstatusänderungen im gesamten Vorgang dokumentiert werden. 1. (Optional) Ein von [Kundinnen/Kunden konfiguriertes Konto](https://docs.stripe.com/api/v2/core/accounts/object.md#v2_account_object-applied_configurations) oder ein [Customer](https://docs.stripe.com/api/customers.md)-Objekt: Um eine Zahlungsmethode für zukünftige Zahlungen einzurichten, müssen Sie diese einem Kunden/einer Kundin zuordnen. Erstellen Sie ein Objekt, das Ihre Kundin/Ihren Kunden repräsentiert, wenn sie/er ein Konto bei Ihrem Unternehmen anlegt. Wenn Ihre Kundin/Ihr Kunde eine Zahlung als Gast durchführt, können Sie vor der Zahlung ein `Account`- oder `Customer`-Objekt erstellen und es zu einem späteren Zeitpunkt mit Ihrer eigenen Darstellung des Kundenkontos verknüpfen. 1. (Optional) [CustomerSession](https://docs.stripe.com/api/customer_sessions.md): Informationen zum Objekt, das Ihre Kundin/Ihren Kunden repräsentiert, sind vertraulich und können nicht direkt über eine App abgerufen werden. Eine `CustomerSession` gewährt dem SDK vorübergehenden, bereichsbezogenen Zugriff auf das `Account` oder die/den `Customer` und stellt zusätzliche Konfigurationsoptionen bereit. Hier finden Sie eine vollständige Liste der [Konfigurationsoptionen](https://docs.stripe.com/api/customer_sessions/create.md#create_customer_session-components). > Wenn Sie niemals Karten für eine Kundin/einen Kunden speichern und wiederkehrenden Kundinnen und Kunden nicht erlauben, gespeicherte Karten wiederzuverwenden, können Sie das `Account`- oder `Customer`-Objekt und das `CustomerSession`-Objekt aus Ihrer Integration weglassen. Aus Sicherheitsgründen kann Ihre App diese Objekte nicht erstellen. Fügen Sie stattdessen einen Endpoint auf Ihrem Server hinzu, der: 1. Ruft das `Account` oder die/den `Customer` ab oder erstellt ein neues bzw eine/einen neue/n. 1. Erstellt eine [CustomerSession](https://docs.stripe.com/api/customer_sessions.md) für das `Account` oder die/den `Customer`. 1. Erstellt einen `PaymentIntent` mit dem [Betrag](https://docs.stripe.com/api/payment_intents/create.md#create_payment_intent-amount), der [Währung](https://docs.stripe.com/api/payment_intents/create.md#create_payment_intent-currency), und entweder mit dem [customer_account](https://docs.stripe.com/api/payment_intents/create.md#create_payment_intent-customer_account) oder der [Kundin/dem Kunden](https://docs.stripe.com/api/payment_intents/create.md#create_payment_intent-customer). 1. Gibt das *Client-Geheimnis* (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)) des `PaymentIntent`, das `client_secret` der `CustomerSession`, die ID des `Account`s oder der/des `Customer` und Ihren [veröffentlichbaren Schlüssel](https://dashboard.stripe.com/apikeys) für Ihre App zurück. Die Zahlungsmethoden, die Kund/innen während des Bezahlvorgangs angezeigt werden, sind ebenfalls in der PaymentIntent enthalten. Sie können Stripe Zahlungsmethoden aus Ihren Dashboard-Einstellungen abrufen lassen oder sie manuell auflisten. Gleich welche Option Sie wählen, die in der PaymentIntent übergebene Währung filtert die Zahlungsmethoden, die dem/r Kund/in angezeigt werden. Wenn Sie beispielsweise `eur` für den PaymentIntent übergeben und OXXO im Dashboard aktiviert ist, wird dem/r Kund/in OXXO nicht angezeigt, da OXXO `eur`-Zahlungen nicht unterstützt. Sofern Ihre Integration keine codebasierte Option zum Anbieten von Zahlungsmethoden erfordert, empfiehlt Stripe die automatisierte Option, da Stripe die Währung, Einschränkungen für Zahlungsmethoden und andere Parameter auswertet, um die Liste der unterstützten Zahlungsmethoden zu ermitteln. Zahlungsmethoden, die die Konversion steigern und die für die Währung und den Standort des/r Kund/in am relevantesten sind, erhalten Priorität. #### Zahlungsmethoden über das Dashboard verwalten Zahlungsmethoden können Sie über das [Dashboard](https://dashboard.stripe.com/settings/payment_methods) verwalten. Stripe handhabt die Rückgabe geeigneter Zahlungsmethoden basierend auf Faktoren wie Betrag, Währung und Zahlungsablauf der Transaktion. Der PaymentIntent wird mit den Zahlungsmethoden erstellt, die Sie im Dashboard konfiguriert haben. Wenn Sie das Dashboard nicht verwenden möchten oder wenn Sie Zahlungsmethoden manuell angeben möchten, können Sie sie mit dem Attribut `payment_method_types` auflisten. #### Curl ```bash # Create a Customer (use an existing Customer ID if this is a returning customer) curl https://api.stripe.com/v1/customers \ -u <>: \ -X "POST" \ -H "Stripe-Account: {{CONNECTED_ACCOUNT_ID}}" # Create an CustomerSession for the Customer curl https://api.stripe.com/v1/customer_sessions \ -u <>: \ -X "POST" \ -d "customer"="{{CUSTOMER_ID}}" \ -d "components[mobile_payment_element][enabled]"=true \ -d "components[mobile_payment_element][features][payment_method_save]"=enabled \ -d "components[mobile_payment_element][features][payment_method_redisplay]"=enabled \ -d "components[mobile_payment_element][features][payment_method_remove]"=enabled # Create a PaymentIntent curl https://api.stripe.com/v1/payment_intents \ -u <>: \ -H "Stripe-Account: {{CONNECTED_ACCOUNT_ID}}" -X "POST" \ -d "customer"="{{CUSTOMER_ID}}" \ -d "amount"=1099 \ -d "currency"="eur" \ -d "automatic_payment_methods[enabled]"=true \ -d application_fee_amount="123" \ ``` #### Zahlungsmethoden manuell auflisten #### Curl ```bash # Create a Customer (use an existing Customer ID if this is a returning customer) curl https://api.stripe.com/v1/customers \ -u <>: \ -X "POST" \ -H "Stripe-Account: {{CONNECTED_ACCOUNT_ID}}" # Create an CustomerSession for the Customer curl https://api.stripe.com/v1/customer_sessions \ -u <>: \ -X "POST" \ -d "customer"="{{CUSTOMER_ID}}" \ -d "components[mobile_payment_element][enabled]"=true \ -d "components[mobile_payment_element][features][payment_method_save]"=enabled \ -d "components[mobile_payment_element][features][payment_method_redisplay]"=enabled \ -d "components[mobile_payment_element][features][payment_method_remove]"=enabled # Create a PaymentIntent curl https://api.stripe.com/v1/payment_intents \ -u <>: \ -H "Stripe-Account: {{CONNECTED_ACCOUNT_ID}}" -X "POST" \ -d "customer"="{{CUSTOMER_ID}}" \ -d "amount"=1099 \ -d "currency"="eur" \ -d "payment_method_types[]"="bancontact" \ -d "payment_method_types[]"="card" \ -d "payment_method_types[]"="ideal" \ -d "payment_method_types[]"="klarna" \ -d "payment_method_types[]"="sepa_debit" \ -d application_fee_amount="123" \ ``` > Jede Zahlungsmethode muss die im PaymentIntent übergebene Währung unterstützen, und Ihr Unternehmen muss in einem der Länder ansässig sein, die jede Zahlungsmethode unterstützt. Auf der Seite [Optionen für die Integration von Zahlungsmethoden](https://docs.stripe.com/payments/payment-methods/integration-options.md) finden Sie weitere Informationen zu den unterstützten Zahlungsmethoden. ## Zahlungsformular integrieren [Clientseitig] So zeigen Sie das Mobile Payment Element auf Ihrem Checkout-Bildschirm an: - Zeigen Sie vom Kunden/von der Kundin gekaufte Produkte und den Gesamtbetrag an - Verwenden Sie das [Address Element](https://docs.stripe.com/elements/address-element.md?platform=ios), um alle benötigten Versanddaten des Kunden/der Kundin zu erfassen - Fügen Sie eine Checkout-Schaltfläche ein, um die Nutzeroberfläche von Stripe anzuzeigen #### UIKit #### Accounts v2 Rufen Sie auf dem Checkout-Bildschirm Ihrer App das PaymentIntent-Client-Geheimnis, das `CustomerSession`-Client-Geheimnis, die Kunden/Kundin konfigurierte `Konto`-ID und den veröffentlichbaren Schlüssel von dem Endpoint ab, den Sie im vorherigen Schritt erstellt haben. Legen Sie Ihren veröffentlichbaren Schlüssel mit `STPAPIClient.shared` fest und initialisieren Sie das [PaymentSheet](https://stripe.dev/stripe-ios/stripe-paymentsheet/Classes/PaymentSheet.html). Legen Sie dann `STPAPIClient.shared.stripeAccount` als ID des verbundenen Kontos fest. #### iOS (Swift) ```swift import UIKit@_spi(CustomerSessionBetaAccess) import StripePaymentSheet class CheckoutViewController: UIViewController { @IBOutlet weak var checkoutButton: UIButton! var paymentSheet: PaymentSheet? let backendCheckoutUrl = URL(string: "Your back-end endpoint/payment-sheet")! // Your back-end endpoint override func viewDidLoad() { super.viewDidLoad() checkoutButton.addTarget(self, action: #selector(didTapCheckoutButton), for: .touchUpInside) checkoutButton.isEnabled = false // MARK: Fetch the PaymentIntent client secret, CustomerSession client secret, customer-configured Account ID, and publishable key var request = URLRequest(url: backendCheckoutUrl) request.httpMethod = "POST" let task = URLSession.shared.dataTask(with: request, completionHandler: { [weak self] (data, response, error) in guard let data = data, let json = try? JSONSerialization.jsonObject(with: data, options: []) as? [String : Any], let customerAccountId = json["customerAccount"] as? String, let customerSessionClientSecret = json["customerSessionClientSecret"] as? String, let paymentIntentClientSecret = json["paymentIntent"] as? String, let publishableKey = json["publishableKey"] as? String, let self = self else { // Handle error return } STPAPIClient.shared.publishableKey = publishableKeySTPAPIClient.shared.stripeAccount = ""{{CONNECTED_ACCOUNT_ID}}""// MARK: Create a PaymentSheet instance var configuration = PaymentSheet.Configuration() configuration.merchantDisplayName = "Example, Inc." configuration.customerAccount = .init(id: customerAccountId, customerSessionClientSecret: customerSessionClientSecret) // Set `allowsDelayedPaymentMethods` to true if your business handles // delayed notification payment methods like US bank accounts. configuration.allowsDelayedPaymentMethods = true self.paymentSheet = PaymentSheet(paymentIntentClientSecret:paymentIntentClientSecret, configuration: configuration) DispatchQueue.main.async { self.checkoutButton.isEnabled = true } }) task.resume() } } ``` #### Customers v1 Rufen Sie auf dem Checkout-Bildschirm Ihrer App das PaymentIntent-Client-Geheimnis, das `CustomerSession`-Client-Geheimnis, die `Kunden`-ID und den veröffentlichbaren Schlüssel von dem Endpoint ab, den Sie im vorherigen Schritt erstellt haben. Legen Sie Ihren veröffentlichbaren Schlüssel mit `STPAPIClient.shared` fest und initialisieren Sie das [PaymentSheet](https://stripe.dev/stripe-ios/stripe-paymentsheet/Classes/PaymentSheet.html). Legen Sie dann `STPAPIClient.shared.stripeAccount` als ID des verbundenen Kontos fest. #### iOS (Swift) ```swift import UIKit@_spi(CustomerSessionBetaAccess) import StripePaymentSheet class CheckoutViewController: UIViewController { @IBOutlet weak var checkoutButton: UIButton! var paymentSheet: PaymentSheet? let backendCheckoutUrl = URL(string: "Your backend endpoint/payment-sheet")! // Your backend endpoint override func viewDidLoad() { super.viewDidLoad() checkoutButton.addTarget(self, action: #selector(didTapCheckoutButton), for: .touchUpInside) checkoutButton.isEnabled = false // MARK: Fetch the PaymentIntent client secret, CustomerSession client secret, Customer ID, and publishable key var request = URLRequest(url: backendCheckoutUrl) request.httpMethod = "POST" let task = URLSession.shared.dataTask(with: request, completionHandler: { [weak self] (data, response, error) in guard let data = data, let json = try? JSONSerialization.jsonObject(with: data, options: []) as? [String : Any], let customerId = json["customer"] as? String, let customerSessionClientSecret = json["customerSessionClientSecret"] as? String, let paymentIntentClientSecret = json["paymentIntent"] as? String, let publishableKey = json["publishableKey"] as? String, let self = self else { // Handle error return } STPAPIClient.shared.publishableKey = publishableKeySTPAPIClient.shared.stripeAccount = ""{{CONNECTED_ACCOUNT_ID}}""// MARK: Create a PaymentSheet instance var configuration = PaymentSheet.Configuration() configuration.merchantDisplayName = "Example, Inc." configuration.customer = .init(id: customerId, customerSessionClientSecret: customerSessionClientSecret) // Set `allowsDelayedPaymentMethods` to true if your business handles // delayed notification payment methods like US bank accounts. configuration.allowsDelayedPaymentMethods = true self.paymentSheet = PaymentSheet(paymentIntentClientSecret:paymentIntentClientSecret, configuration: configuration) DispatchQueue.main.async { self.checkoutButton.isEnabled = true } }) task.resume() } } ``` Wenn Kund/innen auf die Schaltfläche **Checkout** tippen, rufen Sie bitte `present` auf, um das Zahlungsformular anzuzeigen. Nachdem die Zahlung abgeschlossen wurde, verwirft Stripe das Formular und der Abschlussblock wird mit einem [PaymentSheetResult](https://stripe.dev/stripe-ios/stripe-paymentsheet/Enums/PaymentSheetResult.html) aufgerufen. #### iOS (Swift) ```swift @objc func didTapCheckoutButton() { // MARK: Start the checkout process paymentSheet?.present(from: self) { paymentResult in // MARK: Handle the payment result switch paymentResult { case .completed: print("Your order is confirmed") case .canceled: print("Canceled!") case .failed(let error): print("Payment failed: \(error)") } } } ``` #### SwiftUI #### Accounts v2 Erstellen Sie ein `ObservableObject`-Modell für Ihren Bezahlbildschirm. Dieses Modell veröffentlicht ein [PaymentSheet](https://stripe.dev/stripe-ios/stripe-paymentsheet/Classes/PaymentSheet.html) und ein [PaymentSheetResult](https://stripe.dev/stripe-ios/stripe-paymentsheet/Enums/PaymentSheetResult.html). ```swift import StripePaymentSheet import SwiftUI class CheckoutViewModel: ObservableObject { let backendCheckoutUrl = URL(string: "Your back-end endpoint/payment-sheet")! // Your back-end endpoint @Published var paymentSheet: PaymentSheet? @Published var paymentResult: PaymentSheetResult? } ``` Rufen Sie das PaymentIntent-Client-Geheimnis, das `CustomerSession`-Client-Geheimnis, die Kunden/Kundin konfigurierte `Konto`-ID und den veröffentlichbaren Schlüssel von dem Endpoint ab, den Sie im vorherigen Schritt erstellt haben. Legen Sie Ihren veröffentlichbaren Schlüssel mit `STPAPIClient.shared` fest und initialisieren Sie das [PaymentSheet](https://stripe.dev/stripe-ios/stripe-paymentsheet/Classes/PaymentSheet.html). Legen Sie dann `STPAPIClient.shared.stripeAccount` als ID des verbundenen Kontos fest. ```swift @_spi(CustomerSessionBetaAccess) import StripePaymentSheet import SwiftUI class CheckoutViewModel: ObservableObject { let backendCheckoutUrl = URL(string: "Your back-end endpoint/payment-sheet")! // Your back-end endpoint @Published var paymentSheet: PaymentSheet? @Published var paymentResult: PaymentSheetResult? func preparePaymentSheet() { // MARK: Fetch thePaymentIntent and customer information from the back end var request = URLRequest(url: backendCheckoutUrl) request.httpMethod = "POST" let task = URLSession.shared.dataTask(with: request, completionHandler: { [weak self] (data, response, error) in guard let data = data, let json = try? JSONSerialization.jsonObject(with: data, options: []) as? [String : Any], let customerAccountId = json["customerAccount"] as? String, let customerSessionClientSecret = json["customerSessionClientSecret"] as? String, letpaymentIntentClientSecret = json["paymentIntent"] as? String, let publishableKey = json["publishableKey"] as? String, let self = self else { // Handle error return } STPAPIClient.shared.publishableKey = publishableKeySTPAPIClient.shared.stripeAccount = ""{{CONNECTED_ACCOUNT_ID}}""// MARK: Create a PaymentSheet instance var configuration = PaymentSheet.Configuration() configuration.merchantDisplayName = "Example, Inc." configuration.customerAccount = .init(id: customerAccountId, customerSessionClientSecret: customerSessionClientSecret) // Set `allowsDelayedPaymentMethods` to true if your business handles // delayed notification payment methods like US bank accounts. configuration.allowsDelayedPaymentMethods = true DispatchQueue.main.async { self.paymentSheet = PaymentSheet(paymentIntentClientSecret:paymentIntentClientSecret, configuration: configuration) } }) task.resume() } } struct CheckoutView: View { @ObservedObject var model = CheckoutViewModel() var body: some View { VStack { if model.paymentSheet != nil { Text("Ready to pay.") } else { Text("Loading…") } }.onAppear { model.preparePaymentSheet() } } } ``` Fügen Sie Ihrer `View` ein [PaymentSheet.PaymentButton](https://stripe.dev/stripe-ios/stripe-paymentsheet/Classes/PaymentSheet/PaymentButton.html) hinzu. Diese verhält sich ähnlich wie eine SwiftUI-`Button` und kann durch Hinzufügen einer `View` angepasst werden. Wenn Sie auf die Schaltfläche tippen, wird das PaymentSheet angezeigt. Beim Abschließen der Zahlung verwirft Stripe das PaymentSheet und der `onCompletion`-Handler mit einem [PaymentSheetResult](https://stripe.dev/stripe-ios/stripe-paymentsheet/Enums/PaymentSheetResult.html)-Objekt aufgerufen. ```swift @_spi(CustomerSessionBetaAccess) import StripePaymentSheet import SwiftUI class CheckoutViewModel: ObservableObject { let backendCheckoutUrl = URL(string: "Your back-end endpoint/payment-sheet")! // Your back-end endpoint @Published var paymentSheet: PaymentSheet? @Published var paymentResult: PaymentSheetResult? func preparePaymentSheet() { // MARK: Fetch the PaymentIntent and customer information from the back end var request = URLRequest(url: backendCheckoutUrl) request.httpMethod = "POST" let task = URLSession.shared.dataTask(with: request, completionHandler: { [weak self] (data, response, error) in guard let data = data, let json = try? JSONSerialization.jsonObject(with: data, options: []) as? [String : Any], let customerAccountId = json["customerAccount"] as? String, let customerSessionClientSecret = json["customerSessionClientSecret"] as? String, let paymentIntentClientSecret = json["paymentIntent"] as? String, let publishableKey = json["publishableKey"] as? String, let self = self else { // Handle error return } STPAPIClient.shared.publishableKey = publishableKey STPAPIClient.shared.stripeAccount = ""{{CONNECTED_ACCOUNT_ID}}"" // MARK: Create a PaymentSheet instance var configuration = PaymentSheet.Configuration() configuration.merchantDisplayName = "Example, Inc." configuration.customerAccount = .init(id: customerAccountId, customerSessionClientSecret: customerSessionClientSecret) // Set `allowsDelayedPaymentMethods` to true if your business can handle payment methods // that complete payment after a delay, like SEPA Debit and Sofort. configuration.allowsDelayedPaymentMethods = true DispatchQueue.main.async { self.paymentSheet = PaymentSheet(paymentIntentClientSecret: paymentIntentClientSecret, configuration: configuration) } }) task.resume() } func onPaymentCompletion(result: PaymentSheetResult) { self.paymentResult = result } } struct CheckoutView: View { @ObservedObject var model = CheckoutViewModel() var body: some View { VStack {if let paymentSheet = model.paymentSheet { PaymentSheet.PaymentButton( paymentSheet: paymentSheet, onCompletion: model.onPaymentCompletion ) { Text("Buy") } } else { Text("Loading…") }if let result = model.paymentResult { switch result { case .completed: Text("Payment complete") case .failed(let error): Text("Payment failed: \(error.localizedDescription)") case .canceled: Text("Payment canceled.") } } }.onAppear { model.preparePaymentSheet() } } } ``` #### Customers v1 Erstellen Sie ein `ObservableObject`-Modell für Ihren Bezahlbildschirm. Dieses Modell veröffentlicht ein [PaymentSheet](https://stripe.dev/stripe-ios/stripe-paymentsheet/Classes/PaymentSheet.html) und ein [PaymentSheetResult](https://stripe.dev/stripe-ios/stripe-paymentsheet/Enums/PaymentSheetResult.html). ```swift import StripePaymentSheet import SwiftUI class CheckoutViewModel: ObservableObject { let backendCheckoutUrl = URL(string: "Your back-end endpoint/payment-sheet")! // Your back-end endpoint @Published var paymentSheet: PaymentSheet? @Published var paymentResult: PaymentSheetResult? } ``` Rufen Sie das PaymentIntent-Client-Geheimnis, das CustomerSession-Client-Geheimnis, die `Kunden-ID` und den veröffentlichbaren Schlüssel von dem Endpoint ab, den Sie im vorherigen Schritt erstellt haben. Legen Sie Ihren veröffentlichbaren Schlüssel mit `STPAPIClient.shared` fest und initialisieren Sie das [PaymentSheet](https://stripe.dev/stripe-ios/stripe-paymentsheet/Classes/PaymentSheet.html). Legen Sie dann `STPAPIClient.shared.stripeAccount` als ID des verbundenen Kontos fest. ```swift @_spi(CustomerSessionBetaAccess) import StripePaymentSheet import SwiftUI class CheckoutViewModel: ObservableObject { let backendCheckoutUrl = URL(string: "Your back-end endpoint/payment-sheet")! // Your back-end endpoint @Published var paymentSheet: PaymentSheet? @Published var paymentResult: PaymentSheetResult? func preparePaymentSheet() { // MARK: Fetch thePaymentIntent and Customer information from the back end var request = URLRequest(url: backendCheckoutUrl) request.httpMethod = "POST" let task = URLSession.shared.dataTask(with: request, completionHandler: { [weak self] (data, response, error) in guard let data = data, let json = try? JSONSerialization.jsonObject(with: data, options: []) as? [String : Any], let customerId = json["customer"] as? String, let customerSessionClientSecret = json["customerSessionClientSecret"] as? String, letpaymentIntentClientSecret = json["paymentIntent"] as? String, let publishableKey = json["publishableKey"] as? String, let self = self else { // Handle error return } STPAPIClient.shared.publishableKey = publishableKeySTPAPIClient.shared.stripeAccount = ""{{CONNECTED_ACCOUNT_ID}}""// MARK: Create a PaymentSheet instance var configuration = PaymentSheet.Configuration() configuration.merchantDisplayName = "Example, Inc." configuration.customer = .init(id: customerId, customerSessionClientSecret: customerSessionClientSecret) // Set `allowsDelayedPaymentMethods` to true if your business handles // delayed notification payment methods like US bank accounts. configuration.allowsDelayedPaymentMethods = true DispatchQueue.main.async { self.paymentSheet = PaymentSheet(paymentIntentClientSecret:paymentIntentClientSecret, configuration: configuration) } }) task.resume() } } struct CheckoutView: View { @ObservedObject var model = CheckoutViewModel() var body: some View { VStack { if model.paymentSheet != nil { Text("Ready to pay.") } else { Text("Loading…") } }.onAppear { model.preparePaymentSheet() } } } ``` Fügen Sie Ihrer `View` ein [PaymentSheet.PaymentButton](https://stripe.dev/stripe-ios/stripe-paymentsheet/Classes/PaymentSheet/PaymentButton.html) hinzu. Diese verhält sich ähnlich wie eine SwiftUI-`Button` und kann durch Hinzufügen einer `View` angepasst werden. Wenn Sie auf die Schaltfläche tippen, wird das PaymentSheet angezeigt. Beim Abschließen der Zahlung verwirft Stripe das PaymentSheet und der `onCompletion`-Handler mit einem [PaymentSheetResult](https://stripe.dev/stripe-ios/stripe-paymentsheet/Enums/PaymentSheetResult.html)-Objekt aufgerufen. ```swift @_spi(CustomerSessionBetaAccess) import StripePaymentSheet import SwiftUI class CheckoutViewModel: ObservableObject { let backendCheckoutUrl = URL(string: "Your back-end endpoint/payment-sheet")! // Your back-end endpoint @Published var paymentSheet: PaymentSheet? @Published var paymentResult: PaymentSheetResult? func preparePaymentSheet() { // MARK: Fetch the PaymentIntent and Customer information from the back end var request = URLRequest(url: backendCheckoutUrl) request.httpMethod = "POST" let task = URLSession.shared.dataTask(with: request, completionHandler: { [weak self] (data, response, error) in guard let data = data, let json = try? JSONSerialization.jsonObject(with: data, options: []) as? [String : Any], let customerId = json["customer"] as? String, let customerSessionClientSecret = json["customerSessionClientSecret"] as? String, let paymentIntentClientSecret = json["paymentIntent"] as? String, let publishableKey = json["publishableKey"] as? String, let self = self else { // Handle error return } STPAPIClient.shared.publishableKey = publishableKey STPAPIClient.shared.stripeAccount = ""{{CONNECTED_ACCOUNT_ID}}"" // MARK: Create a PaymentSheet instance var configuration = PaymentSheet.Configuration() configuration.merchantDisplayName = "Example, Inc." configuration.customer = .init(id: customerId, customerSessionClientSecret: customerSessionClientSecret) // Set `allowsDelayedPaymentMethods` to true if your business can handle payment methods // that complete payment after a delay, like SEPA Debit and Sofort. configuration.allowsDelayedPaymentMethods = true DispatchQueue.main.async { self.paymentSheet = PaymentSheet(paymentIntentClientSecret: paymentIntentClientSecret, configuration: configuration) } }) task.resume() } func onPaymentCompletion(result: PaymentSheetResult) { self.paymentResult = result } } struct CheckoutView: View { @ObservedObject var model = CheckoutViewModel() var body: some View { VStack {if let paymentSheet = model.paymentSheet { PaymentSheet.PaymentButton( paymentSheet: paymentSheet, onCompletion: model.onPaymentCompletion ) { Text("Buy") } } else { Text("Loading…") }if let result = model.paymentResult { switch result { case .completed: Text("Payment complete") case .failed(let error): Text("Payment failed: \(error.localizedDescription)") case .canceled: Text("Payment canceled.") } } }.onAppear { model.preparePaymentSheet() } } } ``` Wenn `PaymentSheetResult` `.completed` ist, informieren Sie den/die Kund/in (zum Beispiel durch die Anzeige einer Bestellbestätigung). Wenn Sie `allowsDelayedPaymentMethods` auf true festlegen, werden Zahlungsmethoden mit [verzögerter Benachrichtigung](https://docs.stripe.com/payments/payment-methods.md#payment-notification) wie US-Bankkonten zugelassen. Für diese Zahlungsmethoden ist der endgültige Zahlungsstatus nicht bekannt, wenn das `PaymentSheet` abgeschlossen wird. Stattdessen ist sie erfolgreich oder schlägt fehl. Wenn Sie diese Art von Zahlungsmethoden unterstützen, informieren Sie den Kunden/die Kundin darüber, dass seine/ihre Bestellung bestätigt ist, und führen seine/ihre Bestellung erst aus (z. B. das Produkt versenden), wenn die Zahlung erfolgreich ist. ## Rückgabe-URL einrichten [Clientseitig] Der Kunde/Die Kundin verlässt ggf. Ihre App, um sich zu authentifizieren (z. B. in Safari oder einer Banking-App). Damit sie nach der Authentifizierung automatisch zu Ihrer App zurückkehren können, [konfigurieren Sie ein benutzerdefiniertes URL-Schema](https://developer.apple.com/documentation/xcode/defining-a-custom-url-scheme-for-your-app) und richten Sie Ihren App-Delegate so ein, dass die URL an das SDK weitergeleitet wird. Stripe unterstützt keine [universellen Links](https://developer.apple.com/documentation/xcode/allowing-apps-and-websites-to-link-to-your-content). #### SceneDelegate #### Swift ```swift // This method handles opening custom URL schemes (for example, "your-app://stripe-redirect") func scene(_ scene: UIScene, openURLContexts URLContexts: Set) { guard let url = URLContexts.first?.url else { return } let stripeHandled = StripeAPI.handleURLCallback(with: url) if (!stripeHandled) { // This was not a Stripe url – handle the URL normally as you would } } ``` #### AppDelegate #### Swift ```swift // This method handles opening custom URL schemes (for example, "your-app://stripe-redirect") func application(_ app: UIApplication, open url: URL, options: [UIApplication.OpenURLOptionsKey: Any] = [:]) -> Bool { let stripeHandled = StripeAPI.handleURLCallback(with: url) if (stripeHandled) { return true } else { // This was not a Stripe url – handle the URL normally as you would } return false } ``` #### SwiftUI #### Swift ```swift @main struct MyApp: App { var body: some Scene { WindowGroup { Text("Hello, world!").onOpenURL { incomingURL in let stripeHandled = StripeAPI.handleURLCallback(with: incomingURL) if (!stripeHandled) { // This was not a Stripe url – handle the URL normally as you would } } } } } ``` ## Handhabung von Ereignissen nach der Zahlung [Serverseitig] Stripe sendet ein [payment_intent.succeeded](https://docs.stripe.com/api/events/types.md#event_types-payment_intent.succeeded)-Ereignis, wenn die Zahlung abgeschlossen ist. Verwenden Sie [Webhook-Tool im Dashboard](https://dashboard.stripe.com/webhooks) oder folgen Sie der [Webhook-Anleitung](https://docs.stripe.com/webhooks/quickstart.md), um diese Ereignisse zu empfangen und führen Sie Aktionen aus, wie beispielsweise das Senden einer Bestellbestätigung per E-Mail, das Protokollieren des Verkaufs in der Datenbank oder das Starten eines Versand-Workflows. Überwachen Sie diese Ereignisse, statt auf einen Callback vom Client zu warten. Auf dem Client könnten die Kund/innen das Browserfenster schließen oder die App beenden, bevor der Callback erfolgt ist. Bösartige Clients könnten dann die Antwort manipulieren. Wenn Sie Ihre Integration so einrichten, dass sie asynchrone Ereignisse überwacht, können Sie [verschiedene Arten von Zahlungsmethoden](https://stripe.com/payments/payment-methods-guide) mit einer einzelnen Integration akzeptieren. Neben der Abwicklung des `payment_intent.succeeded`-Ereignisses empfehlen wir die Abwicklung von diesen weiteren Ereignissen, wenn Sie Zahlungen mit dem Payment Element erfassen: | Ereignis | Beschreibung | Aktion | | ------------------------------------------------------------------------------------------------------------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | | [payment_intent.succeeded](https://docs.stripe.com/api/events/types.md?lang=php#event_types-payment_intent.succeeded) | Wird gesendet, wenn Kundinnen und Kunden eine Zahlung erfolgreich abgeschlossen haben. | Senden Sie den Kund/innen eine Auftragsbestätigung und *wickeln* (Fulfillment is the process of providing the goods or services purchased by a customer, typically after payment is collected) Sie die Bestellung ab. | | [payment_intent.processing](https://docs.stripe.com/api/events/types.md?lang=php#event_types-payment_intent.processing) | Wird gesendet, wenn eine/e Kund/in eine Zahlung erfolgreich veranlasst hat, die Zahlung aber noch nicht abgeschlossen ist. Dieses Ereignis wird am häufigsten gesendet, wenn der Kunde/die Kundin eine Bankabbuchung veranlasst. In Zukunft folgt darauf entweder ein `payment_intent.succeeded`- oder ein `payment_intent.payment_failed`-Ereignis. | Senden Sie eine Bestellbestätigung an die Kund/innen, in der angegeben ist, dass die Zahlung noch aussteht. Bei digitalen Waren können Sie die Bestellung abwickeln, bevor Sie darauf warten, dass die Zahlung erfolgt. | | [payment_intent.payment_failed](https://docs.stripe.com/api/events/types.md?lang=php#event_types-payment_intent.payment_failed) | Wird gesendet, wenn ein Kunde/eine Kundin einen Zahlungsversuch durchführt, die Zahlung jedoch fehlschlägt. | Wenn eine Zahlung von `processing` zu `payment_failed` übergeht, bieten Sie der Kundin/dem Kunden einen weiteren Zahlungsversuch an. | ## Integration testen #### Karten | Kartennummer | Szenario | So führen Sie den Test durch | | ------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | -------------------------------------------------------------------------------------------------------------------------------------- | | 4242424242424242 | Die Kartenzahlung ist erfolgreich und es ist keine Authentifizierung erforderlich. | Füllen Sie das Kreditkartenformular aus und geben Sie die Kreditkartennummer mit beliebiger Gültigkeitsdauer, CVC und Postleitzahl an. | | 4000002500003155 | Für die Kartenzahlung ist eine *Authentifizierung* (Strong Customer Authentication (SCA) is a regulatory requirement in effect as of September 14, 2019, that impacts many European online payments. It requires customers to use two-factor authentication like 3D Secure to verify their purchase) erforderlich. | Füllen Sie das Kreditkartenformular aus und geben Sie die Kreditkartennummer mit beliebiger Gültigkeitsdauer, CVC und Postleitzahl an. | | 4000000000009995 | Die Karte wird mit einem Ablehnungscode wie `insufficient_funds` abgelehnt. | Füllen Sie das Kreditkartenformular aus und geben Sie die Kreditkartennummer mit beliebiger Gültigkeitsdauer, CVC und Postleitzahl an. | | 6205500000000000004 | Die UnionPay-Karte hat eine variable Länge von 13 bis 19 Ziffern. | Füllen Sie das Kreditkartenformular aus und geben Sie die Kreditkartennummer mit beliebiger Gültigkeitsdauer, CVC und Postleitzahl an. | #### Bankumleitungen | Zahlungsmethode | Szenario | So führen Sie den Test durch | | ----------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | | Bancontact, iDEAL | Ihr/e Kund/in konnte sich auf der iDEAL-Weiterleitungsseite für eine auf Weiterleitung basierende Zahlungsmethode mit sofortiger Benachrichtigung nicht authentifizieren. | Wählen Sie eine beliebige, auf Weiterleitung basierende Zahlungsmethode aus, füllen Sie die erforderlichen Informationen aus und bestätigen Sie die Zahlung. Klicken Sie dann auf der Weiterleitungsseite auf **Testzahlung fehlgeschlagen**. | | Pay by Bank | Ihr Kunde/Ihre Kundin zahlt erfolgreich mit einer auf Weiterleitung basierenden Zahlungsmethode mit [verzögerter Benachrichtigung](https://docs.stripe.com/payments/payment-methods.md#payment-notification). | Wählen Sie die Zahlungsmethode aus, füllen Sie die erforderlichen Informationen aus und bestätigen Sie die Zahlung. Klicken Sie dann auf der Weiterleitungsseite auf **Testzahlung abschließen**. | | Pay by Bank | Ihr/e Kund/in konnte sich auf der iDEAL-Weiterleitungsseite für eine auf Weiterleitung basierende Zahlungsmethode mit verzögerter Benachrichtigung nicht authentifizieren. | Wählen Sie die Zahlungsmethode aus, füllen Sie die erforderlichen Informationen aus und bestätigen Sie die Zahlung. Klicken Sie dann auf der Weiterleitungsseite auf **Testzahlung fehlgeschlagen**. | | BLIK | BLIK-Zahlungen können aus verschiedenen Gründen fehlschlagen. Es gibt sofortige Fehler (der Code ist abgelaufen oder ungültig), verzögerte Fehler (die Bank lehnt ab) oder Zeitüberschreitungen (der/die Kund/in hat nicht rechtzeitig reagiert). | Verwenden Sie E-Mail-Muster, um [die verschiedenen Fehler zu simulieren](https://docs.stripe.com/payments/blik/accept-a-payment.md#simulate-failures) | #### Banklastschriften | Zahlungsmethode | Szenario | So führen Sie den Test durch | | ---------------- | -------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | | SEPA-Lastschrift | Ihr/e Kund/in zahlt erfolgreich mit dem SEPA-Lastschriftverfahren. | Füllen Sie das Formular mit der Kontonummer `AT321904300235473204` aus. Die bestätigte PaymentIntent geht zunächst in den Status „wird verarbeitet“ und dann drei Minuten später in den Status „erfolgreich“ über. | | SEPA-Lastschrift | Der Status der PaymentIntent Ihres/Ihrer Kund/in wechselt von `processing` zu `requires_payment_method`. | Füllen Sie das Formular mit der Kontonummer `AT861904300235473202` aus. | Hier finden Sie weitere Informationen zum [Testen](https://docs.stripe.com/testing.md) Ihrer Integration. ## Optional: Apple Pay aktivieren > Wenn auf Ihrem Checkout-Bildschirm die Schaltfläche **Apple Pay** angezeigt wird, folgen Sie der [Apple Pay-Anleitung](https://docs.stripe.com/apple-pay.md#present-payment-sheet) und verwenden Sie `ApplePayContext`, um Zahlungen über Ihre Apple Pay-Schaltfläche einzuziehen. Mit `PaymentSheet` können Sie andere Arten von Zahlungsmethoden abwickeln. ### Für eine Apple-Händler-ID registrieren Beantragen Sie eine Apple-Händler-ID, indem Sie sich auf der Apple Developer-Website [für eine neue Kennung registrieren](https://developer.apple.com/account/resources/identifiers/add/merchant). Tragen Sie eine Beschreibung und eine Kennung in das Formular ein. Die Beschreibung ist nur für Ihre internen Zwecke bestimmt und kann später geändert werden. Stripe empfiehlt, dass Sie den Namen Ihrer App als Kennung verwenden, zum Beispiel `merchant.com.{{YOUR_APP_NAME}}`. ### Neues Apple Pay-Zertifikat erstellen Erstellen Sie ein Zertifikat für Ihre App, um Zahlungsdaten zu verschlüsseln. Gehen Sie zu den [iOS-Zertifikateinstellungen](https://dashboard.stripe.com/settings/ios_certificates) im Dashboard, klicken Sie auf **Neue Anwendung hinzufügen** und befolgen Sie die Anleitung. Laden Sie eine Certificate Signing Request (CSR)-Datei herunter, um ein sicheres Zertifikat von Apple zu erhalten, mit dem Sie Apple Pay verwenden können. Eine CSR-Datei muss verwendet werden, um genau ein Zertifikat auszustellen. Wenn Sie Ihre Apple-Händler-ID wechseln, müssen Sie zu den [iOS-Zertifikateinstellungen](https://dashboard.stripe.com/settings/ios_certificates) im Dashboard gehen, um eine neue CSR und ein Zertifikat zu erhalten. ### Mit Xcode integrieren Fügen Sie Ihrer App die **Apple Pay**-Funktion hinzu. Öffnen Sie in Xcode Ihre Projekteinstellungen, klicken Sie auf die Registerkarte **Signing & Capabilities** (Anmeldung und Funktionen) und fügen Sie die **Apple Pay**-Funktion hinzu. Möglicherweise werden Sie an dieser Stelle aufgefordert, sich bei Ihrem Entwicklerkonto anzumelden. Wählen Sie die zuvor erstellte Händler-ID aus. Ihre App sollte nun Apple Pay unterstützen. ![](https://b.stripecdn.com/docs-statics-srv/assets/xcode.a701d4c1922d19985e9c614a6f105bf1.png) Apple Pay-Funktion in Xcode aktivieren ### Apple Pay hinzufügen #### Einmalige Zahlung Um Apple Pay zum PaymentSheet hinzuzufügen, setzen Sie [applePay](https://stripe.dev/stripe-ios/stripe-paymentsheet/Classes/PaymentSheet/Configuration.html#/s:6Stripe12PaymentSheetC13ConfigurationV8applePayAC05ApplefD0VSgvp), nachdem Sie `PaymentSheet.Configuration` mit Ihrer Apple-Händler-ID und dem [Ländercode Ihres Unternehmens](https://dashboard.stripe.com/settings/account) initialisiert haben. #### iOS (Swift) ```swift var configuration = PaymentSheet.Configuration() configuration.applePay = .init( merchantId: "merchant.com.your_app_name", merchantCountryCode: "US" ) ``` #### Wiederkehrende Zahlungen Um Apple Pay zum PaymentSheet hinzuzufügen, setzen Sie [applePay](https://stripe.dev/stripe-ios/stripe-paymentsheet/Classes/PaymentSheet/Configuration.html#/s:6Stripe12PaymentSheetC13ConfigurationV8applePayAC05ApplefD0VSgvp), nachdem Sie `PaymentSheet.Configuration` mit Ihrer Apple-Händler-ID und dem [Ländercode Ihres Unternehmens](https://dashboard.stripe.com/settings/account) initialisiert haben. Gemäß den [Apple-Richtlinien](https://developer.apple.com/design/human-interface-guidelines/apple-pay#Supporting-subscriptions) für wiederkehrende Zahlungen müssen Sie auch zusätzliche Attribute für `PKPaymentRequest` festlegen. Fügen Sie in [ApplePayConfiguration.paymentRequestHandlers](https://stripe.dev/stripe-ios/stripepaymentsheet/documentation/stripepaymentsheet/paymentsheet/applepayconfiguration/handlers/paymentrequesthandler) einen Handler hinzu, um die [PKPaymentRequest.paymentSummaryItems](https://developer.apple.com/documentation/passkit/pkpaymentrequest/1619231-paymentsummaryitems) mit dem Betrag zu konfigurieren, den Sie berechnen möchten (z. B. 9,95 USD pro Monat). Sie können auch [Händler-Token](https://developer.apple.com/apple-pay/merchant-tokens/) übernehmen, indem Sie die Eigenschaften `recurringPaymentRequest` oder `automaticReloadPaymentRequest` für `PKPaymentRequest` festlegen. Weitere Informationen zur Verwendung wiederkehrender Zahlungen mit Apple Pay finden Sie in der [PassKit-Dokumentation von Apple](https://developer.apple.com/documentation/passkit/pkpaymentrequest). #### iOS (Swift) ```swift let customHandlers = PaymentSheet.ApplePayConfiguration.Handlers( paymentRequestHandler: { request in // PKRecurringPaymentSummaryItem is available on iOS 15 or later if #available(iOS 15.0, *) { let billing = PKRecurringPaymentSummaryItem(label: "My Subscription", amount: NSDecimalNumber(string: "59.99")) // Payment starts today billing.startDate = Date() // Payment ends in one year billing.endDate = Date().addingTimeInterval(60 * 60 * 24 * 365) // Pay once a month. billing.intervalUnit = .month billing.intervalCount = 1 // recurringPaymentRequest is only available on iOS 16 or later if #available(iOS 16.0, *) { request.recurringPaymentRequest = PKRecurringPaymentRequest(paymentDescription: "Recurring", regularBilling: billing, managementURL: URL(string: "https://my-backend.example.com/customer-portal")!) request.recurringPaymentRequest?.billingAgreement = "You'll be billed $59.99 every month for the next 12 months. To cancel at any time, go to Account and click 'Cancel Membership.'" } request.paymentSummaryItems = [billing] request.currencyCode = "USD" } else { // On older iOS versions, set alternative summary items. request.paymentSummaryItems = [PKPaymentSummaryItem(label: "Monthly plan starting July 1, 2022", amount: NSDecimalNumber(string: "59.99"), type: .final)] } return request } ) var configuration = PaymentSheet.Configuration() configuration.applePay = .init(merchantId: "merchant.com.your_app_name", merchantCountryCode: "US", customHandlers: customHandlers) ``` ### Bestellverfolgung Um Informationen zur [Bestellverfolgung](https://developer.apple.com/design/human-interface-guidelines/technologies/wallet/designing-order-tracking) in iOS 16 oder höher hinzuzufügen, konfigurieren Sie einen [authorizationResultHandler](https://stripe.dev/stripe-ios/stripepaymentsheet/documentation/stripepaymentsheet/paymentsheet/applepayconfiguration/handlers/authorizationresulthandler) in Ihren `PaymentSheet.ApplePayConfiguration.Handlers`. Stripe ruft Ihre Implementierung auf, nachdem die Zahlung durchgeführt wurde, aber bevor iOS das Apple Pay-Formular schließt. Rufen Sie in Ihrer Implementierung von `authorizationResultHandler` die Bestelldetails für die abgeschlossene Bestellung von Ihrem Server ab. Fügen Sie die Details dem bereitgestellten [PKPaymentAuthorizationResult](https://developer.apple.com/documentation/passkit/pkpaymentauthorizationresult) hinzu und geben Sie das geänderte Ergebnis zurück. Weitere Informationen zur Bestellverfolgung finden Sie in der [Dokumentation zu Wallet-Bestellungen von Apple](https://developer.apple.com/documentation/walletorders). #### iOS (Swift) ```swift let customHandlers = PaymentSheet.ApplePayConfiguration.Handlers( authorizationResultHandler: { result in do { // Fetch the order details from your service let myOrderDetails = try await MyAPIClient.shared.fetchOrderDetails(orderID: orderID) result.orderDetails = PKPaymentOrderDetails( orderTypeIdentifier: myOrderDetails.orderTypeIdentifier, // "com.myapp.order" orderIdentifier: myOrderDetails.orderIdentifier, // "ABC123-AAAA-1111" webServiceURL: myOrderDetails.webServiceURL, // "https://my-backend.example.com/apple-order-tracking-backend" authenticationToken: myOrderDetails.authenticationToken) // "abc123" // Return your modified PKPaymentAuthorizationResult return result } catch { return PKPaymentAuthorizationResult(status: .failure, errors: [error]) } } ) var configuration = PaymentSheet.Configuration() configuration.applePay = .init(merchantId: "merchant.com.your_app_name", merchantCountryCode: "US", customHandlers: customHandlers) ``` ## Scannen von Karten aktivieren Um die Unterstützung für das Scannen von Karten für iOS zu aktivieren, setzen Sie `NSCameraUsageDescription` (**Datenschutz – Beschreibung Kameranutzung**) in der `Info.plist` Ihrer Anwendung und geben einen Grund für den Zugriff auf die Kamera an (z. B. „Zum Scannen von Karten“). ## Optional: Formular anpassen Alle Anpassungen werden mithilfe des [PaymentSheet.Configuration](https://stripe.dev/stripe-ios/stripe-paymentsheet/Classes/PaymentSheet/Configuration.html)-Objekts konfiguriert. ### Erscheinungsbild Passen Sie mit der [Appearance API](https://docs.stripe.com/elements/appearance-api/mobile.md?platform=ios) Farben, Schriftarten und mehr an das Erscheinungsbild Ihrer App an. ### Layout der Zahlungsmethode Konfigurieren Sie das Layout der Zahlungsmethoden im Formular mit [paymentMethodLayout](https://stripe.dev/stripe-ios/stripepaymentsheet/documentation/stripepaymentsheet/paymentsheet/configuration-swift.struct/paymentmethodlayout). Sie können sie horizontal oder vertikal anzeigen oder das Layout von Stripe automatisch optimieren lassen. ![](https://b.stripecdn.com/docs-statics-srv/assets/ios-mpe-payment-method-layouts.9d0513e2fcec5660378ba1824d952054.png) #### Swift ```swift var configuration = PaymentSheet.Configuration() configuration.paymentMethodLayout = .automatic ``` ### Adressen der Nutzer/innen erfassen Erfassen Sie lokale und internationale Versand- und Rechnungsadressen von Ihren Kundinnen und Kunden mithilfe des [Address Element](https://docs.stripe.com/elements/address-element.md?platform=ios). ### Anzeigename des Händlers Geben Sie einen kundenorientierten Unternehmensnamen an, indem Sie [merchantDisplayName](https://stripe.dev/stripe-ios/stripe-paymentsheet/Classes/PaymentSheet/Configuration.html#/s:18StripePaymentSheet0bC0C13ConfigurationV19merchantDisplayNameSSvp) festlegen. Standardmäßig handelt es sich dabei um den Namen Ihrer App. #### Swift ```swift var configuration = PaymentSheet.Configuration() configuration.merchantDisplayName = "My app, Inc." ``` ### Dunkelmodus `PaymentSheet` passt sich automatisch an die systemweiten Erscheinungsbildeinstellungen des Nutzers/der Nutzerin an (heller und dunkler Modus). Wenn Ihre App den Dunkelmodus nicht unterstützt, können Sie den [Stil](https://stripe.dev/stripe-ios/stripe-paymentsheet/Classes/PaymentSheet/Configuration.html#/s:18StripePaymentSheet0bC0C13ConfigurationV5styleAC18UserInterfaceStyleOvp) auf den Modus `alwaysLight` oder `alwaysDark` einstellen. ```swift var configuration = PaymentSheet.Configuration() configuration.style = .alwaysLight ``` ### Standardabrechnungsdetails Um Standardwerte für die im Zahlungsformular erfassten Rechnungsdetails festzulegen, konfigurieren Sie die Eigenschaft `defaultBillingDetails`. Die Felder von `PaymentSheet` werden vorab mit den von Ihnen angegebenen Werten ausgefüllt. ```swift var configuration = PaymentSheet.Configuration() configuration.defaultBillingDetails.address.country = "US" configuration.defaultBillingDetails.email = "foo@bar.com" ``` ### Erfassung der Rechnungsdetails Verwenden Sie `billingDetailsCollectionConfiguration`, um anzugeben, wie Sie Rechnungsdetails im Zahlungsformular erfassen möchten. Sie können den Namen, die E-Mail-Adresse, die Telefonnummer und die Adresse Ihrer Kundinnen und Kunden erfassen. Wenn Sie nur die für die Zahlungsmethode erforderlichen Rechnungsdetails angeben möchten, legen Sie `billingDetailsCollectionConfiguration.attachDefaultsToPaymentMethod` auf „true“ fest. In diesem Fall werden `PaymentSheet.Configuration.defaultBillingDetails` als [Abrechnungsdetails](https://docs.stripe.com/api/payment_methods/object.md?lang=node#payment_method_object-billing_details) der Zahlungsmethode festgelegt. Wenn Sie zusätzliche Rechnungsdetails erfassen möchten, die für die Zahlungsmethode nicht unbedingt erforderlich sind, legen Sie `billingDetailsCollectionConfiguration.attachDefaultsToPaymentMethod` auf „false“ fest. In diesem Fall werden die über das `PaymentSheet` erfassten Rechnungsdetails als Rechnungsdetails der Zahlungsmethode festgelegt. ```swift var configuration = PaymentSheet.Configuration() configuration.defaultBillingDetails.email = "foo@bar.com" configuration.billingDetailsCollectionConfiguration.name = .always configuration.billingDetailsCollectionConfiguration.email = .never configuration.billingDetailsCollectionConfiguration.address = .full configuration.billingDetailsCollectionConfiguration.attachDefaultsToPaymentMethod = true ``` > Wenden Sie sich an Ihren Rechtsbeistand bezüglich der Gesetze, die für das Erfassen von Informationen gelten. Erfassen Sie Telefonnummern nur, wenn Sie sie für die Transaktion benötigen. ## Optional: Zahlung in Ihrer Nutzeroberfläche durchführen Sie können das Zahlungsformular anzeigen, um nur die Details einer Zahlungsmethode zu erfassen, und später eine `confirm`-Methode aufrufen, um die Zahlung in der Nutzeroberfläche Ihrer App abzuschließen. Dies ist nützlich, wenn Sie eine nutzerspezifische Kaufschaltfläche haben oder zusätzliche Schritte erforderlich sind, nachdem Sie die Zahlungsdetails erfasst haben. ![](https://b.stripecdn.com/docs-statics-srv/assets/ios-multi-step.cd631ea4f1cd8cf3f39b6b9e1e92b6c5.png) Schließen Sie die Zahlung über die Nutzeroberfläche Ihrer App ab #### UIKit Die folgenden Schritte führen Sie durch den Abschluss der Zahlung in der Nutzeroberfläche Ihrer Nutzeroberfläche. Sehen Sie sich unsere Beispiel-Integration auf [GitHub](https://github.com/stripe/stripe-ios/blob/master/Example/PaymentSheet%20Example/PaymentSheet%20Example/ExampleCustomCheckoutViewController.swift) an. 1. Initialisieren Sie zunächst [PaymentSheet.FlowController](https://stripe.dev/stripe-ios/stripepaymentsheet/documentation/stripepaymentsheet/paymentsheet/flowcontroller) anstelle von `PaymentSheet` und aktualisieren Sie Ihre Nutzeroberfläche mit der Eigenschaft `paymentOption`. Diese Eigenschaft enthält ein Bild und ein Label, die die ursprünglich ausgewählte Standardzahlungsmethode des/der Kund/in darstellen. ```swift PaymentSheet.FlowController.create(paymentIntentClientSecret: paymentIntentClientSecret, configuration: configuration) { [weak self] result in switch result { case .failure(let error): print(error) case .success(let paymentSheetFlowController): self?.paymentSheetFlowController = paymentSheetFlowController // Update your UI using paymentSheetFlowController.paymentOption } } ``` 1. Rufen Sie als Nächstes `presentPaymentOptions` auf, um die Zahlungsdetails zu erfassen. Wenn Sie fertig sind, aktualisieren Sie Ihre Nutzeroberfläche erneut mit der Eigenschaft `paymentOption`. ```swift paymentSheetFlowController.presentPaymentOptions(from: self) { // Update your UI using paymentSheetFlowController.paymentOption } ``` 1. Rufen Sie schließlich `confirm` auf. ```swift paymentSheetFlowController.confirm(from: self) { paymentResult in // MARK: Handle the payment result switch paymentResult { case .completed: print("Payment complete!") case .canceled: print("Canceled!") case .failed(let error): print(error) } } ``` #### SwiftUI Die folgenden Schritte führen Sie durch den Abschluss der Zahlung in der Nutzeroberfläche Ihrer Nutzeroberfläche. Sehen Sie sich unsere Beispielintegration auf [GitHub](https://github.com/stripe/stripe-ios/blob/master/Example/PaymentSheet%20Example/PaymentSheet%20Example/ExampleSwiftUICustomPaymentFlow.swift) an. 1. Initialisieren Sie zunächst [PaymentSheet.FlowController](https://stripe.dev/stripe-ios/stripepaymentsheet/documentation/stripepaymentsheet/paymentsheet/flowcontroller) anstelle von `PaymentSheet`. Die Eigenschaft `paymentOption` enthält ein Bild und eine Beschriftung, die die aktuell ausgewählte Zahlungsmethode des/der Kund/in darstellen und die Sie in Ihrer Nutzeroberfläche verwenden können. ```swift PaymentSheet.FlowController.create(paymentIntentClientSecret: paymentIntentClientSecret, configuration: configuration) { [weak self] result in switch result { case .failure(let error): print(error) case .success(let paymentSheetFlowController): self?.paymentSheetFlowController = paymentSheetFlowController // Use the paymentSheetFlowController.paymentOption properties in your UI myPaymentMethodLabel = paymentSheetFlowController.paymentOption?.label ?? "Select a payment method" myPaymentMethodImage = paymentSheetFlowController.paymentOption?.image ?? UIImage(systemName: "square.and.pencil")! } } ``` 1. Verwenden Sie [PaymentSheet.FlowController.PaymentOptionsButton](https://stripe.dev/stripe-ios/stripepaymentsheet/documentation/stripepaymentsheet/paymentsheet/flowcontroller/paymentoptionsbutton), um die Schaltfläche anzuordnen, die das Formular zum Erfassen der Zahlungsdetails vorlegt. Wenn `PaymentSheet.FlowController` das Argument `onSheetDismissed` aufruft, spiegelt die `paymentOption` für die `PaymentSheet.FlowController`-Instanz die aktuell ausgewählte Zahlungsmethode wider. ```swift PaymentSheet.FlowController.PaymentOptionsButton( paymentSheetFlowController: paymentSheetFlowController, onSheetDismissed: { myPaymentMethodLabel = paymentSheetFlowController.paymentOption?.label ?? "Select a payment method" myPaymentMethodImage = paymentSheetFlowController.paymentOption?.image ?? UIImage(systemName: "square.and.pencil")! }, content: { /* An example button */ HStack { Text(myPaymentMethodLabel) Image(uiImage: myPaymentMethodImage) } } ) ``` 1. Verwenden Sie [PaymentSheet.FlowController.PaymentOptionsButton](https://stripe.dev/stripe-ios/stripepaymentsheet/documentation/stripepaymentsheet/paymentsheet/flowcontroller/paymentoptionsbutton), um die Schaltfläche zur Bestätigung der Zahlung anzuordnen. ```swift PaymentSheet.FlowController.ConfirmButton( paymentSheetFlowController: paymentSheetFlowController, onCompletion: { result in // MARK: Handle the payment result switch result { case .completed: print("Payment complete!") case .canceled: print("Canceled!") case .failed(let error): print(error) } }, content: { /* An example button */ Text("Pay") } ) ``` Wenn `PaymentSheetResult` `.completed` ist, informieren Sie den/die Kund/in (zum Beispiel durch die Anzeige einer Bestellbestätigung). Wenn Sie `allowsDelayedPaymentMethods` auf true festlegen, werden Zahlungsmethoden mit [verzögerter Benachrichtigung](https://docs.stripe.com/payments/payment-methods.md#payment-notification) wie US-Bankkonten zugelassen. Für diese Zahlungsmethoden ist der endgültige Zahlungsstatus nicht bekannt, wenn das `PaymentSheet` abgeschlossen wird. Stattdessen ist sie erfolgreich oder schlägt fehl. Wenn Sie diese Art von Zahlungsmethoden unterstützen, informieren Sie den Kunden/die Kundin darüber, dass seine/ihre Bestellung bestätigt ist, und führen seine/ihre Bestellung erst aus (z. B. das Produkt versenden), wenn die Zahlung erfolgreich ist. ## Tests Testen Sie Ihren Ablauf zur Kontoerstellung, indem Sie [Konten erstellen](https://docs.stripe.com/connect/testing.md#creating-accounts) und [OAuth verwenden](https://docs.stripe.com/connect/testing.md#using-oauth). Testen Sie Ihre Einstellungen für **Zahlungsmethoden** für Ihre verbundenen Konten, indem Sie sich bei einem Ihrer Testkonten anmelden und zu den [Einstellungen für Zahlungsmethoden](https://dashboard.stripe.com/settings/payment_methods) navigieren. Testen Sie Ihren Bezahlvorgang mit Ihren Testschlüsseln und einem Testkonto. Mit den [verfügbaren Testkarten](https://docs.stripe.com/testing.md) können Sie außerdem Ihren Zahlungsablauf testen und verschiedene Zahlungsbedingungen simulieren. # Nur Kartenelement > This is a Nur Kartenelement for when platform is ios and mobile-ui is card-element. View the full page at https://docs.stripe.com/connect/end-to-end-saas-platform?platform=ios&mobile-ui=card-element. Erfassen Sie Kartendaten auf dem Client sicher mit [STPPaymentCardTextField](https://stripe.dev/stripe-ios/stripe-payments-ui/Classes/STPPaymentCardTextField.html). Hierbei handelt es sich um eine Drop-In-Komponente der Nutzeroberfläche aus dem SDK, die die Kartennummer, das Ablaufdatum, die Prüfziffer (CVC) und die Postleitzahl erfasst. ![](https://d37ugbyn3rpeym.cloudfront.net/docs/mobile/ios/card-field.mp4) ## Voraussetzungen 1. [Registrieren Sie Ihre Plattform](https://dashboard.stripe.com/connect). 1. [Unternehmensdetails im Dashboard überprüfen und hinzufügen](https://dashboard.stripe.com/account/onboarding). 1. [Vervollständigen Sie Ihr Plattform-Profil](https://dashboard.stripe.com/connect/settings/profile). 1. [Passen Sie Ihre Markeneinstellungen an](https://dashboard.stripe.com/settings/connect/stripe-dashboard/branding). Fügen Sie einen Firmennamen, ein Symbol und eine Markenfarbe hinzu. ## Stripe einrichten [Serverseitig] [Clientseitig] Zunächst benötigen Sie ein Stripe-Konto. [Registrieren Sie sich jetzt](https://dashboard.stripe.com/register). ### Serverseitig Diese Integration erfordert Endpoints auf Ihrem Server, die mit der Stripe-API kommunizieren können. Nutzen Sie die offiziellen Bibliotheken für den Zugriff auf die Stripe-API von Ihrem Server aus: #### Ruby ```bash # Available as a gem sudo gem install stripe ``` ```ruby # If you use bundler, you can add this line to your Gemfile gem 'stripe' ``` ### Clientseitig Das [Stripe iOS SDK](https://github.com/stripe/stripe-ios) ist Open Source, [vollständig dokumentiert](https://stripe.dev/stripe-ios/index.html) und kompatibel mit Apps, die iOS 13 oder höher unterstützen. #### Swift Package Manager Führen Sie zur Installation des SDK die folgenden Schritte aus: 1. Wählen Sie in Xcode **Datei** > **Add Package Dependencies** (Paketabhängigkeiten hinzufügen) aus und geben Sie als Repository-URL `https://github.com/stripe/stripe-ios-spm` ein. 1. Wählen auf unserer [Veröffentlichungsseite](https://github.com/stripe/stripe-ios/releases) die neueste Version aus. 1. Fügen Sie das Produkt **StripePaymentsUI** zum [Ziel Ihrer App](https://developer.apple.com/documentation/swift_packages/adding_package_dependencies_to_your_app) hinzu. #### CocoaPods 1. Falls noch nicht geschehen, installieren Sie bitte die aktuellste Version von [CocoaPods](https://guides.cocoapods.org/using/getting-started.html). 1. Wenn Sie keine bestehende [Podfile](https://guides.cocoapods.org/syntax/podfile.html) haben, führen Sie folgenden Befehl aus, um eine zu erstellen: ```bash pod init ``` 1. Fügen Sie folgende Zeile in Ihre `Podfile` ein: ```podfile pod 'StripePaymentsUI' ``` 1. Führen Sie folgenden Befehl aus: ```bash pod install ``` 1. Vergessen Sie nicht, ab jetzt in Zukunft anstelle der Datei `.xcodeproj` die Datei `.xcworkspace` zum Öffnen Ihres Projekts in Xcode zu verwenden. 1. Führen Sie für zukünftige Updates auf die jeweils aktuelle Version des SDK Folgendes aus: ```bash pod update StripePaymentsUI ``` #### Carthage 1. Falls noch nicht geschehen, installieren Sie bitte die aktuelle Version von [Carthage](https://github.com/Carthage/Carthage#installing-carthage). 1. Fügen Sie folgende Zeile in Ihre `Cartfile` ein: ```cartfile github "stripe/stripe-ios" ``` 1. Befolgen Sie die [Carthage-Installationsanweisungen](https://github.com/Carthage/Carthage#if-youre-building-for-ios-tvos-or-watchos). Vergewissern Sie sich, dass Sie alle [hier](https://github.com/stripe/stripe-ios/tree/master/StripePaymentsUI/README.md#manual-linking) aufgeführten erforderlichen Frameworks einbetten. 1. Führen Sie für zukünftige Updates auf die aktuelle Version unseres SDK einfach folgenden Befehl aus: ```bash carthage update stripe-ios --platform ios ``` #### Manuelles Framework 1. Gehen Sie auf unsere [GitHub-Release-Seite](https://github.com/stripe/stripe-ios/releases/latest), laden Sie **Stripe.xcframework.zip** herunter und entpacken Sie die Datei. 1. Ziehen Sie **StripePaymentsUI.xcframework** in den Abschnitt **Embedded Binaries** (Eingebettete Binärdateien) der Einstellungen unter **General** (Allgemeines) Ihres Xcode-Projekts. Aktivieren Sie dabei die Option **Copy items if needed** (Elemente kopieren, falls nötig). 1. Wiederholen Sie Schritt 2 für alle [hier](https://github.com/stripe/stripe-ios/tree/master/StripePaymentsUI/README.md#manual-linking) aufgeführten erforderlichen Frameworks. 1. Wiederholen Sie für zukünftige Updates auf die jeweils aktuelle Version des SDK die Schritte 1–3. > Details zur aktuellen SDK-Version und zu vorherigen Versionen finden Sie auf der Seite [Releases](https://github.com/stripe/stripe-ios/releases) auf GitHub. Um bei Veröffentlichung einer neuen Version eine Benachrichtigung zu erhalten, [achten Sie auf die Releases zum jeweiligen Repository](https://help.github.com/en/articles/watching-and-unwatching-releases-for-a-repository#watching-releases-for-a-repository). Konfigurieren Sie das SDK mit Ihrem [veröffentlichbaren Schlüssel](https://dashboard.stripe.com/test/apikeys) von Stripe, um es beim Start der App auszuführen. Dadurch kann Ihre App Anfragen an die Stripe-API senden. #### Swift ```swift import UIKitimportStripePaymentsUI @main class AppDelegate: UIResponder, UIApplicationDelegate { func application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey: Any]?) -> Bool {StripeAPI.defaultPublishableKey = "<>" // do any other necessary launch configuration return true } } ``` > Verwenden Sie Ihre [Testschlüssel](https://docs.stripe.com/keys.md#obtain-api-keys) beim Testen und Entwickeln Ihrer App und Ihre [Live-Modus](https://docs.stripe.com/keys.md#test-live-modes)-Schlüssel beim Veröffentlichen Ihrer App. ## Verbundenes Konto erstellen In diesem Leitfaden erfahren Sie, wie Sie Coding zum Erstellen eines verbundenen Kontos verwenden. Wenn Sie noch nicht bereit für die Integration sind, können Sie zunächst ein verbundenes Konto [über das Dashboard](https://docs.stripe.com/connect/dashboard/managing-individual-accounts.md) erstellen. Wenn sich Nutzer/innen (Verkäufer/innen oder Dienstleister/innen) auf Ihrer Plattform registrieren, erstellen Sie ein [Nutzerkonto](https://docs.stripe.com/api/accounts.md) (auch *verbundenes Konto* genannt), damit Sie Zahlungen einziehen und anschließend an die Nutzer/innen auszahlen können. Verbundene Konten entsprechen in der API von Stripe Ihren Nutzerinnen und Nutzern und helfen, die für deren Identitätsprüfung erforderlichen Informationen zu erfassen. In unserem Beispiel mit der Store-Builder-Plattform ist das verbundene Konto das Unternehmen, das einen Online-Shop einrichtet. ![](https://b.stripecdn.com/docs-statics-srv/assets/standard-ios.10c6b24cef1d683d36f2264c726beb1d.png) ### Schritt 2.1: Verbundenes Konto erstellen und Informationen vorab angeben (Server-side) Verwenden Sie die `/v1/accounts` API, um ein verbundenes Konto zu [erstellen](https://docs.stripe.com/api/accounts/create.md). Sie können das verbundene Konto erstellen, indem Sie die [Standardparameter des verbundenen Kontos](https://docs.stripe.com/connect/migrate-to-controller-properties.md) verwenden oder den Kontotyp angeben. #### Mit Standardeigenschaften ```curl curl -X POST https://api.stripe.com/v1/accounts \ -u "<>:" ``` #### Mit Kontotyp ```curl curl https://api.stripe.com/v1/accounts \ -u "<>:" \ -d type=standard ``` Falls Sie bereits Informationen für Ihre verbundenen Konten erfasst haben, können Sie diese im `Account`-Objekt vorab angeben. Sie können alle Kontoinformationen vorab ausfüllen, einschließlich persönlicher und geschäftlicher Informationen, externer Kontoinformationen usw. Nachdem Sie das `Account` erstellt haben, erstellen Sie eine [Person](https://docs.stripe.com/api/persons/create.md), die die für die Kontoeröffnung verantwortliche Person repräsentiert, wobei Sie `relationship.representative` auf „true“ setzen und alle Kontoinformationen, die Sie vorab ausfüllen möchten (z. B. Vor- und Nachname), eingeben. ```curl curl https://api.stripe.com/v1/accounts/{{ACCOUNT_ID}}/persons \ -u "<>:" \ -d first_name=Jenny \ -d last_name=Rosen \ -d "relationship[representative]=true" ``` Connect Onboarding fragt keine vorab ausgefüllten Informationen ab. Kontoinhaber/innen müssen vorausgefüllte Informationen jedoch bestätigen, bevor sie den [Connect-Rahmenvertrag](https://docs.stripe.com/connect/service-agreement-types.md) akzeptieren können. Füllen Sie beim Testen Ihrer Integration die Kontoinformationen vorab mit [Testdaten](https://docs.stripe.com/connect/testing.md) aus. ### Schritt 2.2: Konto-Link erstellen (Server-side) Sie können einen Konto-Link erstellen, indem Sie die [Account Links](https://docs.stripe.com/api/account_links.md) API mit den folgenden Parametern aufrufen: - `account` - `refresh_url` - `return_url` - `type` = `account_onboarding` ```curl curl https://api.stripe.com/v1/account_links \ -u "<>:" \ -d "account={{CONNECTEDACCOUNT_ID}}" \ --data-urlencode "refresh_url=https://example.com/reauth" \ --data-urlencode "return_url=https://example.com/return" \ -d type=account_onboarding ``` ### Schritt 2.3: Nutzer/innen an die Konto-Link-URL weiterleiten (Client-side) Die Antwort auf Ihre Anfrage zu [Konto-Links](https://docs.stripe.com/api/account_links.md) enthält einen Wert für die Schlüssel-`URL`. Leiten Sie Ihre Nutzer/innen an diesen Link weiter, um sie an das Verfahren zu übergeben. URLs von der [Accounts Links](https://docs.stripe.com/api/account_links.md) API sind temporär und können nur einmal verwendet werden, da sie Zugang zu den persönlichen Daten des Kontoinhabers/der Kontoinhaberin gewähren. Authentifizieren Sie die/den Nutzer/in in Ihrer Anwendung, bevor Sie sie/ihn an diese URL weiterleiten. Wenn Sie Informationen vorab ausfüllen möchten, müssen Sie dies tun, bevor Sie den Link des Kontos erstellen. Nachdem Sie den Link für ein Standard-Konto erstellt haben, können Sie keine Informationen für das Konto lesen oder schreiben. > Versenden Sie keine Konto-Link-URLs per E-Mail, Textnachricht oder anderweitig außerhalb Ihrer Plattformanwendung. Stellen Sie die URLs Ihren authentifizierten Kontoinhaberinnen und Kontoinhabern stattdessen in Ihrer Anwendung zur Verfügung. #### Swift ```swift import UIKit import SafariServices let BackendAPIBaseURL: String = "" // Set to the URL of your backend server class ConnectOnboardViewController: UIViewController { // ... override func viewDidLoad() { super.viewDidLoad() let connectWithStripeButton = UIButton(type: .system) connectWithStripeButton.setTitle("Connect with Stripe", for: .normal) connectWithStripeButton.addTarget(self, action: #selector(didSelectConnectWithStripe), for: .touchUpInside) view.addSubview(connectWithStripeButton) // ... } @objc func didSelectConnectWithStripe() { if let url = URL(string: BackendAPIBaseURL)?.appendingPathComponent("onboard-user") { var request = URLRequest(url: url) request.httpMethod = "POST" let task = URLSession.shared.dataTask(with: request) { (data, response, error) in guard let data = data, let json = try? JSONSerialization.jsonObject(with: data, options: []) as? [String : Any], let accountURLString = json["url"] as? String, let accountURL = URL(string: accountURLString) else { // handle error } let safariViewController = SFSafariViewController(url: accountURL) safariViewController.delegate = self DispatchQueue.main.async { self.present(safariViewController, animated: true, completion: nil) } } } } // ... } extension ConnectOnboardViewController: SFSafariViewControllerDelegate { func safariViewControllerDidFinish(_ controller: SFSafariViewController) { // the user may have closed the SFSafariViewController instance before a redirect // occurred. Sync with your backend to confirm the correct state } } ``` ### Schritt 2.4: Rückkehr der Nutzer/innen zu Ihrer Plattform steuern (Client-side) *Connect* (Connect is Stripe's solution for multi-party businesses, such as marketplace or software platforms, to route payments between sellers, customers, and other recipients) Onboarding verlangt, dass Sie sowohl eine `return_url` als auch eine `refresh_url` übergeben, um alle Fälle steuern zu können, in denen die Nutzer/innen an Ihre Plattform weitergeleitet werden. Es ist wichtig, dass Sie diese URLs korrekt implementieren, um Ihren Nutzerinnen/Nutzern die bestmögliche Erfahrung zu bieten. Sie können einen [universellen Link](https://developer.apple.com/documentation/xcode/allowing-apps-and-websites-to-link-to-your-content) einrichten, damit iOS automatisch zur Ihrer App weiterleiten kann. #### return_url Stripe löst eine Weiterleitung zurück zu dieser URL aus, wenn die Nutzer/innen das Connect Onboarding abschließen. Das bedeutet nicht, dass alle Informationen erfasst wurden oder keine offenen Anforderungen für das Konto bestehen. Es heißt lediglich, dass die Nutzer/innen das Verfahren ordnungsgemäß durchlaufen und beendet haben. Über diese URL wird kein Status übergeben. Nachdem Nutzer/innen zu Ihrer `return_url` weitergeleitet wurden, überprüfen Sie den Status des Parameters `details_submitted` für das jeweilige Konto, indem Sie eine der folgenden Aktionen ausführen: - Überwachen von `account.updated` *webhooks* (A webhook is a real-time push notification sent to your application as a JSON payload through HTTPS requests) - Rufen Sie die [Accounts](https://docs.stripe.com/api/accounts.md)-API auf und prüfen Sie das zurückgegebene Objekt. #### refresh_url Ihre Nutzer/innen werden in den folgenden Fällen an die `refresh_url` weitergeleitet: - Der Link ist abgelaufen (seit Erstellung des Links sind ein paar Minuten vergangen). - Der Link wurde bereits aufgerufen (die Nutzer/innen haben die Seite aktualisiert oder auf die Zurück/Vorwärts-Schaltfläche geklickt). - Der Link wurde in einer Drittanbieteranwendung (z. B. einem Messaging-Client) geteilt, die versucht hat, auf die URL zuzugreifen und sie in der Vorschau anzuzeigen. Viele Clients besuchen Links automatisch. Dies kann jedoch dazu führen, dass die Links ablaufen. - Ihre Plattform hat keinen Zugang mehr zu diesem Konto. - Das Konto wurde abgelehnt. Ihre `refresh_url` sollte eine Methode auf Ihrem Server auslösen, um [Account Links](https://docs.stripe.com/api/account_links.md) erneut mit denselben Parametern aufzurufen und Nutzer/innen an das Connect Onboarding zurückzuleiten, damit ein nahtloses Erlebnis entsteht. ### Schritt 2.5: Umgang mit Nutzer/innen, die das Onboarding nicht abgeschlossen haben Wenn Nutzer/innen an Ihre `return_url` weitergeleitet werden, haben sie das Onboarding möglicherweise nicht abgeschlossen. Rufen Sie mithilfe des Endpoints `/v1/accounts` das Nutzerkonto auf und prüfen Sie den Wert für `charges_enabled`. Wenn das Onboarding für das Konto nicht komplett abgeschlossen wurde, geben Sie den Nutzerinnen/Nutzern mithilfe entsprechender Eingabeaufforderungen der Nutzeroberfläche die Möglichkeit, das Onboarding zu einem späteren Zeitpunkt fortzusetzen. Diese können ihre Konto-Aktivierung dann über einen neuen (von Ihrer Integration generierten) Link abschließen. Anhand des Status des Parameters `details_submitted` im Nutzerkonto können Sie überprüfen, ob das Onboarding abgeschlossen wurde. ## Zahlung annehmen ### Schritt 3.1: Checkout-Seite erstellen (Clientseitig) Erfassen Sie Kartendaten auf dem Client sicher mit [STPPaymentCardTextField](https://stripe.dev/stripe-ios/stripe-payments-ui/Classes/STPPaymentCardTextField.html). Hierbei handelt es sich um eine Drop-In-Komponente der Nutzeroberfläche aus dem SDK, die die Kartennummer, das Ablaufdatum, die Prüfziffer (CVC) und die Postleitzahl erfasst. ![](https://d37ugbyn3rpeym.cloudfront.net/docs/mobile/ios/card-field.mp4) Erstellen Sie eine Instanz der Kartenkomponente und eine Schaltfläche **Zahlung** mit folgendem Code: #### Swift ```swift import UIKit import StripePaymentsUI class CheckoutViewController: UIViewController { lazy var cardTextField: STPPaymentCardTextField = { let cardTextField = STPPaymentCardTextField() return cardTextField }() lazy var payButton: UIButton = { let button = UIButton(type: .custom) button.layer.cornerRadius = 5 button.backgroundColor = .systemBlue button.titleLabel?.font = UIFont.systemFont(ofSize: 22) button.setTitle("Pay", for: .normal) button.addTarget(self, action: #selector(pay), for: .touchUpInside) return button }() override func viewDidLoad() { super.viewDidLoad() view.backgroundColor = .white let stackView = UIStackView(arrangedSubviews: [cardTextField, payButton]) stackView.axis = .vertical stackView.spacing = 20 stackView.translatesAutoresizingMaskIntoConstraints = false view.addSubview(stackView) NSLayoutConstraint.activate([ stackView.leftAnchor.constraint(equalToSystemSpacingAfter: view.leftAnchor, multiplier: 2), view.rightAnchor.constraint(equalToSystemSpacingAfter: stackView.rightAnchor, multiplier: 2), stackView.topAnchor.constraint(equalToSystemSpacingBelow: view.topAnchor, multiplier: 2), ]) } @objc func pay() { // ... } } ``` Führen Sie Ihre Anwendung aus und stellen Sie sicher, dass Ihr Checkout-Formular die Kartenkomponente und die Zahlungsschaltfläche anzeigt. ### Schritt 3.2: PaymentIntent erstellen (Serverseitig) (Clientseitig) Stripe verwendet ein [PaymentIntent](https://docs.stripe.com/api/payment_intents.md)-Objekt, um Ihre Absicht darzustellen, eine Kundenzahlung einzuziehen. Dabei werden Ihre Abbuchungsversuche und Zahlungsstatusänderungen während des gesamten Vorgangs dokumentiert. ### Serverseitig Erstellen Sie auf Ihrem Server einen Endpoint, der einen PaymentIntent mit [Betrag](https://docs.stripe.com/api/payment_intents/object.md#payment_intent_object-amount) und [Währung](https://docs.stripe.com/api/payment_intents/object.md#payment_intent_object-currency) anlegt. Sie müssen immer entscheiden, welchen Betrag Sie serverseitig berechnen, also in einer vertrauenswürdigen Umgebung im Gegensatz zur Client-Seite. So wird verhindert, dass böswillige Kundinnen/Kunden ihre eigenen Preise festlegen können. #### curl ```bash curl https://api.stripe.com/v1/payment_intents \ -u <>: \ -d amount=1000 \ -d currency="usd" \ -d "automatic_payment_methods[enabled]"=true \ -d application_fee_amount="123" \ -H "Stripe-Account: {{CONNECTED_STRIPE_ACCOUNT_ID}}" ``` In unserem Beispiel für den Store Builder möchten wir ein Unternehmen schaffen, bei dem Kundinnen und Kunden die Unternehmen direkt bezahlen. Ein solches Unternehmen erstellen Sie so: - Mit dem Header `Stripe-Account` geben Sie an, dass es sich bei dem Kauf durch das Unternehmen um eine Direktabbuchung handelt. - Mit `application_fee_amount` geben Sie an, welcher Anteil des Betrags aus dem Kauf des Unternehmens an die Plattform bezahlt werden soll. Sobald es zu einem Verkauf kommt, übermittelt Stripe den `application_fee_amount` vom verbundenen Konto an die Plattform und zieht die Stripe-Gebühr vom Anteil des verbundenen Kontos ab. Eine Darstellung dieser Geldbewegung sehen Sie hier: ![](https://b.stripecdn.com/docs-statics-srv/assets/direct_charges.a2a8b68037ac95fe22140d6dde9740d3.svg) Statt das gesamte PaymentIntent-Objekt an Ihre App zu übergeben, übergeben Sie nur das *Client-Geheimnis* (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)). Das Client-Geheimnis des PaymentIntent ist ein eindeutiger Schlüssel, mit dem Sie die Zahlung bestätigen und Kartenangaben zum Client aktualisieren können, ohne dass eine Manipulation vertraulicher Daten, wie beispielsweise des Zahlungsbetrags, möglich ist. ### Clientseitig Legen Sie die ID des verbundenen Kontos als Argument für die Client-Anwendung in den clientseitigen Bibliotheken fest. #### Swift ```swift import UIKit import StripePayments @UIApplicationMain class AppDelegate: UIResponder, UIApplicationDelegate { func application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions: [UIApplicationLaunchOptionsKey: Any]?) -> Bool { StripeAPI.defaultPublishableKey = "<>" STPAPIClient.shared.stripeAccount = ""{{CONNECTED_ACCOUNT_ID}}"" return true } } ``` Fordern Sie auf dem Client einen PaymentIntent von Ihrem Server an und speichern Sie sein *Client-Geheimnis* (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)). #### Swift ```swift class CheckoutViewController: UIViewController { var paymentIntentClientSecret: String? // ...continued from previous step override func viewDidLoad() { // ...continued from previous step startCheckout() } func startCheckout() { // Request a PaymentIntent from your server and store its client secret // Click View full sample to see a complete implementation } } ``` ### Schritt 3.3: Zahlung an Stripe senden (Clientseitig) Wenn der/die Kund/in auf die Schaltfläche **Bezahlen** drückt, wird der `PaymentIntent` *bestätigt* (Confirming a PaymentIntent indicates that the customer intends to pay with the current or provided payment method. Upon confirmation, the PaymentIntent attempts to initiate a payment), um die Zahlung abzuschließen. Zuerst muss ein [STPPaymentIntentParams](https://stripe.dev/stripe-ios/stripe-payments/Classes/STPPaymentIntentParams.html)-Objekt zusammengestellt werden mit: 1. Die Zahlungsmethodendaten der Kartentext field 1. Der geheime `PaymentIntent`-Clientschlüssel von Ihrem Server Statt das gesamte PaymentIntent-Objekt an den Client zu schicken, wird die Verwendung des *geheimen Clientschlüssels* (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)) empfohlen. Dieser unterscheidet sich von Ihren API-Schlüsseln, die Stripe-API-Anfragen authentifizieren. Der geheime Clientschlüssel ist ein String, mit dem Ihre App auf wichtige Felder aus dem PaymentIntent zugreifen (zum Beispiel `status`) und gleichzeitig sensible Felder verbergen kann (zum Beispiel `customer`). Gehen Sie vorsichtig mit dem Client-Geheimnis um, da es die Zahlung abschließen kann. Sie dürfen nicht protokolliert, in URLs eingebettet oder Personen außer dem Kunden selbst zugänglich gemacht werden. Schließen Sie als Nächstes die Zahlung ab, indem Sie die Methode [STPPaymentHandler confirmPayment](https://stripe.dev/stripe-ios/stripe-payments/Classes/STPPaymentHandler.html#/c:@M@StripePayments@objc\(cs\)STPPaymentHandler\(im\)confirmPayment:withAuthenticationContext:completion:) aufrufen. #### Swift ```swift class CheckoutViewController: UIViewController { // ... @objc func pay() { guard let paymentIntentClientSecret = paymentIntentClientSecret else { return } // Collect card details let paymentIntentParams = STPPaymentIntentParams(clientSecret: paymentIntentClientSecret) paymentIntentParams.paymentMethodParams = cardTextField.paymentMethodParams // Submit the payment let paymentHandler = STPPaymentHandler.shared() paymentHandler.confirmPayment(paymentIntentParams, with: self) { (status, paymentIntent, error) in switch (status) { case .failed: self.displayAlert(title: "Payment failed", message: error?.localizedDescription ?? "") break case .canceled: self.displayAlert(title: "Payment canceled", message: error?.localizedDescription ?? "") break case .succeeded: self.displayAlert(title: "Payment succeeded", message: paymentIntent?.description ?? "", restartDemo: true) break @unknown default: fatalError() break } } } } extension CheckoutViewController: STPAuthenticationContext { func authenticationPresentingViewController() -> UIViewController { return self } } ``` Sie können die [Zahlungskartendaten eines Kunden/einer Kundin bei der Zahlungsbestätigung speichern](https://docs.stripe.com/payments/payment-intents.md#future-usage), indem Sie sowohl `setupFutureUsage` als auch eine/n`customer` für den `PaymentIntent` angeben. Sie können diese Parameter auch beim Erstellen des `PaymentIntent` auf Ihrem Server angeben. Die Angabe eines geeigneten `setupFutureUsage`-Werts für Ihre Anwendung kann es erforderlich machen, weitere Authentifizierungsschritte durchzuführen, verringert aber die Wahrscheinlichkeit einer Ablehnung künftiger Zahlungen durch Banken. [Erfahren Sie, wie Sie Karten für zukünftige Zahlungen optimieren können](https://docs.stripe.com/payments/payment-intents.md#future-usage) und bestimmen Sie, welcher Wert für Ihre Anwendung verwendet werden soll. | Ihre beabsichtigte Kartennutzung | `setup_future_usage`-Enum-Wert | | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------ | | Nur *On-Session* (A payment is described as on-session if it occurs while the customer is actively in your checkout flow and able to authenticate the payment method)-Zahlungen | `on_session` | | Nur *Off-Session* (A payment is described as off-session if it occurs without the direct involvement of the customer, using previously-collected payment information)-Zahlungen | `off_session` | | Sowohl On- als auch Off-Session-Zahlungen | `off_session` | Sie können eine für On-Session-Zahlungen eingerichtete Karte für Off-Session-Zahlungen verwenden. Allerdings ist die Wahrscheinlichkeit höher, dass die Bank die Off-Session-Zahlung ablehnt und vom Karteninhaber/von der Karteninhaberin eine Authentifizierung verlangt. Wenn augrund von Vorschriften wie der [Starken Kundenauthentifizierung](https://docs.stripe.com/strong-customer-authentication.md) eine Authentifizierung erforderlich ist, blendet `STPPaymentHandler` mithilfe des übergebenen [STPAuthenticationContext](https://stripe.dev/stripe-ios/stripe-payments/Protocols/STPAuthenticationContext.html) Ansichtssteuerungselemente ein und leitet den Kunden/die Kundin durch dieses Verfahren. [Erfahren Sie, wie die 3D Secure-Authentifizierung auf iOS](https://docs.stripe.com/payments/3d-secure.md?platform=ios) unterstützt wird. Ist die Zahlung erfolgreich, wird der Abschluss-Handler mit dem Status `.succeeded` aufgerufen. Schlägt sie fehl, lautet der Status `.failed` und Sie können dem/der Nutzer/in die Meldung `error.localizedDescription` anzeigen. Sie können den Status eines `PaymentIntent` auch im [Dashboard](https://dashboard.stripe.com/test/payments) prüfen, oder indem Sie die Eigenschaft `status` des Objekts nachschlagen. ### Schritt 3.4: Integration testen (Clientseitig) ​​Ihnen stehen mehrere Testkarten zur Verwendung in einer Sandbox zur Verfügung, um sicherzustellen, dass diese Integration bereit ist. Sie können sie mit einer beliebigen Prüfziffer/CVC und einem Ablaufdatum in der Zukunft verwenden. | Nummer | Beschreibung | | ---------------- | ----------------------------------------------------------------------------------------------------- | | 4242424242424242 | Zahlung ist erfolgreich und wird sofort verarbeitet. | | 4000002500003155 | Erfordert Authentifizierung. Stripe veranlasst ein Modal, das den Kunden um Authentifizierung bittet. | | 4000000000009995 | Zahlung schlägt immer mit dem Ablehnungscode `insufficient_funds` fehl. | Eine vollständige Liste der Testkarten finden Sie in unserem Leitfaden zum [Testbetrieb](https://docs.stripe.com/testing.md). ### Schritt 3.5: Fulfillment (Serverseitig) Nach Abwicklung der Zahlung erfolgt auf Ihrer Seite die *Ausführung* (Fulfillment is the process of providing the goods or services purchased by a customer, typically after payment is collected). Zum Beispiel muss ein Store Builder das verkaufende Unternehmen benachrichtigen, damit dieses die bestellte Ware an die Kundin bzw. den Kunden liefern kann. Konfigurieren Sie [in Ihrem Dashboard](https://dashboard.stripe.com/account/webhooks) einen *Webhook* (A webhook is a real-time push notification sent to your application as a JSON payload through HTTPS requests)-Endpoint (für Ereignisse *mit Ihren Connect-Anwendungen*). ![](https://b.stripecdn.com/docs-statics-srv/assets/connect_webhooks.4de92f78dcd94b36838010c85c8a051f.png) Erstellen Sie dann einen HTTP-Endpoint auf Ihrem Server, um die abgeschlossenen Zahlungen zu überwachen, damit Ihre Nutzer/innen (verbundenen Konten) die Bestellungen abwickeln können. #### Ruby ```ruby # Using Sinatra. require 'sinatra' require 'stripe' set :port, 4242 # Don't put any keys in code. See https://docs.stripe.com/keys-best-practices. # Find your keys at https://dashboard.stripe.com/apikeys. client = Stripe::StripeClient.new('<>') # If you are testing your webhook locally with the Stripe CLI you # can find the endpoint's secret by running `stripe listen` # Otherwise, find your endpoint's secret in your webhook settings in # the Developer Dashboard endpoint_secret = 'whsec_...' post '/webhook' do payload = request.body.read sig_header = request.env['HTTP_STRIPE_SIGNATURE'] event = nil # Verify webhook signature and extract the event. # See https://stripe.com/docs/webhooks#verify-events for more information. begin event = Stripe::Webhook.construct_event( payload, sig_header, endpoint_secret ) rescue JSON::ParserError => e # Invalid payload. status 400 return rescue Stripe::SignatureVerificationError => e # Invalid Signature. status 400 return end if event['type'] == 'payment_intent.succeeded' payment_intent = event['data']['object'] connected_account_id = event['account'] handle_successful_payment_intent(connected_account_id, payment_intent) end status 200 end def handle_successful_payment_intent(connected_account_id, payment_intent) # Fulfill the purchase puts 'Connected account ID: ' + connected_account_id puts payment_intent.to_s end ``` Weitere Informationen finden Sie in unserem [Ausführungsleitfaden für Zahlungen](https://docs.stripe.com/webhooks/handling-payment-events.md). ### Webhooks lokal testen Verwenden Sie die Stripe-Kommandozeile, um Webhooks lokal zu testen 1. Falls noch nicht vorhanden, [installieren Sie zunächst die Stripe-CLI](https://docs.stripe.com/stripe-cli/install.md) auf Ihrem Rechner. 1. Führen Sie dann zum Anmelden `stripe login` in der Befehlszeile aus und folgen Sie den Anweisungen. 1. Lassen Sie schließlich Ihren lokalen Host ein simuliertes Ereignis in einem verbundenen Konto empfangen, indem Sie in einem Terminalfenster `stripe listen --forward-connect-to localhost:{PORT}/webhook` und in einem anderen `stripe trigger --stripe-account= {{CONNECTED_STRIPE_ACCOUNT_ID}} payment_intent.succeeded` ausführen (oder ein anderes [unterstütztes Ereignis](https://github.com/stripe/stripe-cli/wiki/trigger-command#supported-events) auslösen). ## Testen Testen Sie Ihren Ablauf zur Kontoerstellung, indem Sie [Konten erstellen](https://docs.stripe.com/connect/testing.md#creating-accounts) und [OAuth verwenden](https://docs.stripe.com/connect/testing.md#using-oauth). Testen Sie Ihre Einstellungen für **Zahlungsmethoden** für Ihre verbundenen Konten, indem Sie sich bei einem Ihrer Testkonten anmelden und zu den [Einstellungen für Zahlungsmethoden](https://dashboard.stripe.com/settings/payment_methods) navigieren. Testen Sie Ihren Bezahlvorgang mit Ihren Testschlüsseln und einem Testkonto. Mit den [verfügbaren Testkarten](https://docs.stripe.com/testing.md) können Sie außerdem Ihren Zahlungsablauf testen und verschiedene Zahlungsbedingungen simulieren. # Zahlungsformular > This is a Zahlungsformular for when platform is android and mobile-ui is payment-sheet. View the full page at https://docs.stripe.com/connect/end-to-end-saas-platform?platform=android&mobile-ui=payment-sheet. ![](https://b.stripecdn.com/docs-statics-srv/assets/android-overview.471eaf89a760f5b6a757fd96b6bb9b60.png) Integrieren Sie die vorgefertigte Zahlungs-UI von Stripe in den Bezahlvorgang Ihrer Android-App mit der [PaymentSheet](https://stripe.dev/stripe-android/paymentsheet/com.stripe.android.paymentsheet/-payment-sheet/index.html)-Klasse. > #### Accounts v2 API unterstützt > > Das Payment Sheet unterstützt *von Kund/innen konfigurierte Konten* nicht. Es unterstützt nur `Kund/innen`-Objekte. ## Voraussetzungen 1. [Registrieren Sie Ihre Plattform](https://dashboard.stripe.com/connect). 1. [Unternehmensdetails im Dashboard überprüfen und hinzufügen](https://dashboard.stripe.com/account/onboarding). 1. [Vervollständigen Sie Ihr Plattform-Profil](https://dashboard.stripe.com/connect/settings/profile). 1. [Passen Sie Ihre Markeneinstellungen an](https://dashboard.stripe.com/settings/connect/stripe-dashboard/branding). Fügen Sie einen Firmennamen, ein Symbol und eine Markenfarbe hinzu. ## Stripe einrichten [Serverseitig] [Clientseitig] Zunächst benötigen Sie ein Stripe-Konto. [Jetzt registrieren](https://dashboard.stripe.com/register). ### Serverseitig Für diese Integration sind Endpoints auf Ihrem Server erforderlich, die mit der Stripe-API kommunizieren können. Nutzen Sie diese offiziellen Bibliotheken für den Zugriff auf die Stripe-API von Ihrem Server aus: #### Ruby ```bash # Available as a gem sudo gem install stripe ``` ```ruby # If you use bundler, you can add this line to your Gemfile gem 'stripe' ``` ### Clientseitig Das [Stripe Android SDK](https://github.com/stripe/stripe-android) ist Open Source und [vollständig dokumentiert](https://stripe.dev/stripe-android/). Um das SDK zu installieren, fügen Sie `stripe-android` in den Block `dependencies` Ihrer [app/build.gradle](https://developer.android.com/studio/build/dependencies)-Datei ein: #### Kotlin ```kotlin plugins { id("com.android.application") } android { ... } dependencies { // ... // Stripe Android SDK implementation("com.stripe:stripe-android:23.8.0") // Include the financial connections SDK to support US bank account as a payment method implementation("com.stripe:financial-connections:23.8.0") } ``` > Details zur aktuellen SDK-Version und zu vorherigen Versionen finden Sie auf der Seite [Releases](https://github.com/stripe/stripe-android/releases) auf GitHub. Um bei Veröffentlichung eines neuen Release eine Benachrichtigung zu erhalten, [beobachten Sie Veröffentlichungen für das jeweilige Repository](https://docs.github.com/en/github/managing-subscriptions-and-notifications-on-github/configuring-notifications#configuring-your-watch-settings-for-an-individual-repository). Konfigurieren Sie das SDK mit Ihrem [veröffentlichbaren Schlüssel](https://dashboard.stripe.com/apikeys) von Stripe so, dass dieser Anfragen an die API stellen kann, wie beispielsweise in Ihrer Unterklasse `Application`: #### Kotlin ```kotlin import com.stripe.android.PaymentConfiguration class MyApp : Application() { override fun onCreate() { super.onCreate() PaymentConfiguration.init( applicationContext, "<>" ) } } ``` > Verwenden Sie Ihre [Testschlüssel](https://docs.stripe.com/keys.md#obtain-api-keys) beim Testen und Entwickeln Ihrer App und Ihre [Live-Modus](https://docs.stripe.com/keys.md#test-live-modes)-Schlüssel beim Veröffentlichen Ihrer App. ## Verbundenes Konto erstellen Wenn sich Nutzer/innen (Verkäufer/innen oder Dienstleister/innen) auf Ihrer Plattform registrieren, erstellen Sie ein [Nutzerkonto](https://docs.stripe.com/api/accounts.md) (auch *verbundenes Konto* genannt), damit Sie Zahlungen einziehen und anschließend an die Nutzer/innen auszahlen können. Verbundene Konten entsprechen in der API von Stripe Ihren Nutzerinnen und Nutzern und helfen, die für deren Identitätsprüfung erforderlichen Informationen zu erfassen. In unserem Beispiel mit der Store-Builder-Plattform ist das verbundene Konto das Unternehmen, das einen Online-Shop einrichtet. ![Ablauf der Kontoerstellung](https://b.stripecdn.com/docs-statics-srv/assets/standard-android.04900ae101e927a74a6f2b0afb53bf23.png) ### Schritt 2.1: Verbundenes Konto erstellen und Informationen vorab angeben (Server-side) Verwenden Sie die `/v1/accounts` API, um ein verbundenes Konto zu [erstellen](https://docs.stripe.com/api/accounts/create.md). Sie können das verbundene Konto erstellen, indem Sie die [Standardparameter des verbundenen Kontos](https://docs.stripe.com/connect/migrate-to-controller-properties.md) verwenden oder den Kontotyp angeben. #### Mit Standardeigenschaften ```curl curl -X POST https://api.stripe.com/v1/accounts \ -u "<>:" ``` #### Mit Kontotyp ```curl curl https://api.stripe.com/v1/accounts \ -u "<>:" \ -d type=standard ``` Falls Sie bereits Informationen für Ihre verbundenen Konten erfasst haben, können Sie diese im `Account`-Objekt vorab angeben. Sie können alle Kontoinformationen vorab ausfüllen, einschließlich persönlicher und geschäftlicher Informationen, externer Kontoinformationen usw. Nachdem Sie das `Account` erstellt haben, erstellen Sie eine [Person](https://docs.stripe.com/api/persons/create.md), die die für die Kontoeröffnung verantwortliche Person repräsentiert, wobei Sie `relationship.representative` auf „true“ setzen und alle Kontoinformationen, die Sie vorab ausfüllen möchten (z. B. Vor- und Nachname), eingeben. ```curl curl https://api.stripe.com/v1/accounts/{{ACCOUNT_ID}}/persons \ -u "<>:" \ -d first_name=Jenny \ -d last_name=Rosen \ -d "relationship[representative]=true" ``` Connect Onboarding fragt keine vorab ausgefüllten Informationen ab. Kontoinhaber/innen müssen vorausgefüllte Informationen jedoch bestätigen, bevor sie den [Connect-Rahmenvertrag](https://docs.stripe.com/connect/service-agreement-types.md) akzeptieren können. Füllen Sie beim Testen Ihrer Integration die Kontoinformationen vorab mit [Testdaten](https://docs.stripe.com/connect/testing.md) aus. ### Schritt 2.2: Konto-Link erstellen (Server-side) Sie können einen Konto-Link erstellen, indem Sie die [Account Links](https://docs.stripe.com/api/account_links.md) API mit den folgenden Parametern aufrufen: - `account` - `refresh_url` - `return_url` - `type` = `account_onboarding` ```curl curl https://api.stripe.com/v1/account_links \ -u "<>:" \ -d "account={{CONNECTEDACCOUNT_ID}}" \ --data-urlencode "refresh_url=https://example.com/reauth" \ --data-urlencode "return_url=https://example.com/return" \ -d type=account_onboarding ``` ### Schritt 2.3: Nutzer/innen an die Konto-Link-URL weiterleiten (Client-side) Die Antwort auf Ihre [Account Links](https://docs.stripe.com/api/account_links.md)-Anforderung enthält einen Wert für den Schlüssel `url`. Leiten Sie Ihre Nutzer/innen an diesen Link weiter, um sie an das Verfahren zu übergeben. Konto-Links sind temporär und können nur einmal verwendet werden, da sie Zugang zu den persönlichen Daten der Inhaber/innen der verbundenen Konten gewähren. Führen Sie die Authentifizierung der Nutzer/innen in Ihrer Anwendung durch, bevor Sie sie an diese URL weiterleiten. Wenn Sie Informationen vorab angeben möchten, müssen Sie dies vor der Erstellung des Konto-Links tun. Nach der Erstellung des Konto-Links für ein Standard-Konto können Informationen für das Konto weder gelesen noch geschrieben werden. > Versenden Sie keine Konto-Link-URLs per E-Mail, Textnachricht oder anderweitig außerhalb Ihrer Plattformanwendung. Stellen Sie die URLs Ihren authentifizierten Kontoinhaberinnen und Kontoinhabern stattdessen in Ihrer Anwendung zur Verfügung. ```xml