# Capital-Finanzierungskomponente Ermöglichen Sie einem verbundenen Konto, seine aktive Capital-Finanzierung einzusehen und zu verwalten. Mit der eingebetteten Capital-Finanzierungskomponente können verbundene Konten nach Annahme eines Angebots ihren Finanzierungsstatus einsehen und verwalten. Verbundene Konten bieten folgende Möglichkeiten: - Zahlungsfortschritt ansehen - Transaktionsverlauf überwachen - Zahlungen durchführen, falls zutreffend auf die betreffende [Finanzierungsart](https://docs.stripe.com/capital/how-capital-for-platforms-works.md#types-of-financing-offers) Note: The following is a preview/demo component that behaves differently than live mode usage with real connected accounts. The actual component has more functionality than what might appear in this demo component. For example, for connected accounts without Stripe dashboard access (custom accounts), no user authentication is required in production. ## Bevor Sie beginnen - Eingebettete Komponenten können nur für verbundene Konten in den USA und im Vereinigten Königreich angezeigt werden. - Bevor Sie Capital aktivieren, müssen Sie die [automatischen Angebote aktivieren](https://docs.stripe.com/capital/embedded-component-integration.md#enable-automatic-offers) und [Ihre Integration zur Prüfung bei Stripe einreichen](https://docs.stripe.com/connect/supported-embedded-components/capital-financing.md#submit-for-review). - Wenn Sie [die Komponente anzeigen](https://docs.stripe.com/connect/supported-embedded-components/capital-financing.md#render-the-component), wird standardmäßig auf Inhalte von Stripe verwiesen. Sie können den Link zur [Datenschutzerklärung](https://stripe.com/privacy) und [Funktionsweise von Capital für Plattformen](https://docs.stripe.com/capital/how-capital-for-platforms-works.md) durch Ihre entsprechende Dokumentation ersetzen. ## Installieren eingebetteter Komponenten von Capital Installieren Sie eine Beta-Version der Stripe SDKs, um Kontositzungen für Komponenten der privaten Vorschau zu erstellen: - [Ruby](https://github.com/stripe/stripe-ruby/#public-preview-sdks) `>=15.5.0-beta.1` - [Python](https://github.com/stripe/stripe-python/#public-preview-sdks) `>=12.5.0b1` - [PHP](https://github.com/stripe/stripe-php/#public-preview-sdks) `>=17.6.0-beta.1` - [Node](https://github.com/stripe/stripe-node/#public-preview-sdks) `>=18.5.0-beta.1` - [.NET](https://github.com/stripe/stripe-dotnet#public-preview-sdks) `>=48.5.0-beta.1` - [Java](https://github.com/stripe/stripe-java#public-preview-sdks) `>=29.5.0-beta.1` - [Go](https://github.com/stripe/stripe-go#public-preview-sdks) `>=82.5.0-beta.1` Verwenden Sie die Beta-Version der clientseitigen Stripe-Bibliotheken, um Komponenten der privaten Vorschau zu rendern: #### npm Installieren Sie die Bibliothek: ```bash npm install --save @stripe/connect-js@preview ``` Wenn Sie React in Ihrer Anwendung verwenden: ```bash npm install --save @stripe/react-connect-js@preview ``` #### GitHub Laden Sie den Quellcode der Bibliotheken für [@stripe/connect-js](https://github.com/stripe/connect-js) and [@stripe/react-connect-js](https://github.com/stripe/react-connect-js) direkt von GitHub herunter. ## Connect.js einrichten Wenn Sie nicht bereits eingebettete Stripe-Komponenten in Ihrer Anwendung verwenden, [initialisieren Sie Connect.js](https://docs.stripe.com/connect/get-started-connect-embedded-components.md?platform=web#account-sessions), bevor Sie die Finanzierungskomponente integrieren. ## Kontositzung erstellen Geben Sie in Ihrer Anfrage [Kontositzung erstellen](https://docs.stripe.com/api/account_sessions/create.md) `capital_financing` im Parameter `components` an, um die Finanzierungskomponente zu aktivieren. ```curl curl https://api.stripe.com/v1/account_sessions \ -u "<>:" \ -H "Stripe-Version: 2026-04-22.preview; embedded_connect_beta=v2;" \ -d "account={{CONNECTEDACCOUNT_ID}}" \ -d "components[capital_financing][enabled]=true" ``` ## Komponente rendern Stellen Sie die Capital-Finanzierungskomponente im Frontend dar. #### JavaScript ```js // Include this element in your HTML const capitalFinancing = stripeConnectInstance.create('capital-financing'); container.appendChild(capitalFinancing); ``` #### HTML + JS | Methode | Typ | Beschreibung | Standard | | -------------------------- | --------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | ---------------------------------------------------------- | | `setDefaultFinancingOffer` | `string` | [Finanzierungsangebot](https://docs.stripe.com/api/capital/financing_offers.md)s-ID, die beim ersten Laden der Komponente angezeigt wird. Wenn Sie diese weglassen, zeigt die Komponente die aktive oder die letzte Finanzierung an. | | | `setShowFinancingSelector` | `boolean` | Wenn wahr, stellen Sie die Dropdown-Auswahl für die Finanzierung dar, damit das verbundene Konto die angezeigte Finanzierung ändern kann. | `true` | | `setOnFinancingsLoaded` | `({total: number}) => void` | Die Komponente hat den Finanzierungsverlauf des verbundenen Kontos geladen. | | | `setSupportUrl` | `string` | Absolute URL Ihrer Support-Site. | `https://support.stripe.com/` | | `setHowCapitalWorksUrl` | `string` | Absolute URL einer Seite mit Informationen über das Capital-Programm. | `https://docs.stripe.com/capital/how-stripe-capital-works` | #### React | React-Eigenschaft | Typ | Beschreibung | Standard | Erforderlich oder optional | | ----------------------- | --------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | ---------------------------------------------------------- | -------------------------- | | `defaultFinancingOffer` | `string` | [Finanzierungsangebot](https://docs.stripe.com/api/capital/financing_offers.md)s-ID, die beim ersten Laden der Komponente angezeigt wird. Wenn Sie diese weglassen, zeigt die Komponente die aktive oder die letzte Finanzierung an. | `null` | optional | | `showFinancingSelector` | `boolean` | Wenn wahr, stellen Sie die Dropdown-Auswahl für die Finanzierung dar, damit das verbundene Konto die angezeigte Finanzierung ändern kann. | `true` | optional | | `onFinancingsLoaded` | `({total: number}) => void` | Die Komponente hat den Finanzierungsverlauf des verbundenen Kontos geladen. | | optional | | `supportUrl` | `string` | Absolute URL Ihrer Support-Site. | `https://support.stripe.com/` | optional | | `howCapitalWorksUrl` | `string` | Absolute URL einer Seite mit Informationen über das Capital-Programm. | `https://docs.stripe.com/capital/how-stripe-capital-works` | optional | ## Komponente gestalten und anpassen [Passen Sie eingebettete Komponenten](https://docs.stripe.com/connect/customize-connect-embedded-components.md) an, um die Schriftarten, Farben und die Nutzeroberfläche der Komponente an das Branding Ihrer Plattform anzupassen. ## Anzeigestatus festlegen Platzieren Sie die Finanzierungskomponente auf einer Seite, die von Ihren verbundenen Konten derzeit für die Anzeige von Informationen zu Zahlungen und Auszahlungen genutzt wird, oder auf einer speziellen **Finanzierungsseite**. Die Finanzierungskomponente zeigt Inhalte dynamisch nach dem Finanzierungsstatus des verbundenen Kontos an: - **Keine Finanzierungshistorie**: Wenn ein verbundenes Konto über ein Angebot verfügt, dieses aber noch nicht angenommen oder beantragt hat, zeigt die Finanzierungskomponente nichts an. Achten Sie auf das Ereignis `onFinancingsLoaded`, um in der Finanzierungskomponente eine benutzerdefinierte Nachricht für diesen Zustand anzuzeigen oder die Finanzierungskomponente auszublenden, bis Finanzierungsdaten verfügbar sind. - **Angebot in Prüfung**: Nachdem ein berechtigtes verbundenes Konto ein Finanzierungsangebot angenommen und sich dafür beworben hat, können Sie diesen Status verwenden, um eine Komponente anzuzeigen, die den Anmeldeformularstatus verfolgt, während auf die Genehmigung des Angebots gewartet wird. ## Umgang mit Fehlern beim Laden Prüfen Sie nach dem Rendern der Komponente, wie Sie mit [Fehlern beim Laden umgehen](https://docs.stripe.com/connect/get-started-connect-embedded-components.md?platform=web#reacting-to-load-errors), um sicherzustellen, dass Ihre Integration Fälle, in denen Komponenten nicht geladen werden können, reibungslos bewältigen kann. ## Komponente zur Prüfung einreichen Um eine der Capital-Komponenten im Live-Modus verwenden zu können, müssen Stripe und unsere Finanzpartner alle für Kund/innen sichtbaren Inhalte prüfen und genehmigen, die sich auf Stripe Capital beziehen: 1. [Erstellen Sie ein Testangebot in einer Sandbox](https://docs.stripe.com/capital/testing.md#create-offer) und legen Sie den Status des Angebots auf `delivered` fest. Verwenden Sie dieses Testangebot zur Vorschau des Anmeldeformulars auf der Website oder im Dashboard Ihrer Plattform. 1. Erfassung einer Vorschau des Sandbox-Angebots und der Anzeige der eingebetteten Komponente auf der Nutzeroberfläche Ihrer Plattform (z. B. Screenshots oder ein aufgezeichnetes Video). 1. [Übermitteln Sie die Vorschau an Stripe](https://form.asana.com/?k=8K51UWmWhttehNFD5qBLdg&d=974470123217835). Nach der Genehmigung können Sie die Komponente mit Stripe im Live-Modus verwenden. ## Optional: Zusätzliche eingebettete Komponenten Die Finanzierungskomponente ist eine von mehreren eingebetteten Komponenten, die für Capital verfügbar sind. Erfahren Sie mehr über eingebettete Komponenten in der Anleitung [Eingebettete Capital-Komponenten einrichten](https://docs.stripe.com/capital/embedded-component-integration.md). ## See also - [Eingebettete Capital-Komponenten einrichten](https://docs.stripe.com/capital/embedded-component-integration.md)