> ## Documentation Index
> Fetch the complete documentation index at: https://dokumentation.websale.de/llms.txt
> Use this file to discover all available pages before exploring further.

# $wsStripe - Stripe

> Modul $wsStripe: Konfigurationsdaten für Stripe.js bereitstellen, Stripe im Frontend initialisieren und den aktuellen Zahlungsstatus auswerten.

Mit dem `$wsStripe` Modul können Sie Zahlungsinformationen zu Stripe abrufen. Es stellt die Konfigurationsdaten für die Stripe.js-Integration sowie Statusinformationen zum aktuellen Zahlungsvorgang bereit. In diesem Abschnitt erfahren Sie, wie Sie Stripe im Frontend initialisieren und den Zahlungsstatus auswerten können.

***

## Modulübersicht

**Beispiel / Ausschnitt über** `$wsStripe`

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
{{= $wsStripe | json }}
```

**JSON-Ausgabe**

```json theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
{
  "configuration": {
    "publishableKey": "...",
    "targetAccount": "..."
  },
  "createCustomerSession": "ƒ()",
  "paymentCanceled": false,
  "paymentFailed": false,
  "paymentPending": false
}
```

Anmerkung: `"ƒ()"` kennzeichnet eine Funktion.

**Variablen und Methoden in der Übersicht**

| **Name**                  | **Typ** | **Beschreibung**                                                           |
| ------------------------- | ------- | -------------------------------------------------------------------------- |
| `configuration`           | map     | Map mit Stripe-Konfigurationsdaten.                                        |
| `publishableKey`          | string  | Öffentlicher Stripe-Schlüssel für die Integration im Frontend.             |
| `targetAccount`           | string  | Stripe Connected Account ID (für Plattform-Zahlungen).                     |
| `paymentCanceled`         | bool    | `true` wenn die Zahlung abgebrochen wurde.                                 |
| `paymentFailed`           | bool    | `true` wenn die Zahlung fehlgeschlagen ist.                                |
| `paymentPending`          | bool    | `true` wenn die Zahlung noch aussteht.                                     |
| `createCustomerSession()` | map     | Erstellt eine Stripe Customer Session für den aktuell eingeloggten Kunden. |

***

## Templates

Das `$wsStripe` Modul wird typischerweise im Checkout-Bereich verwendet,\
insbesondere auf der Zahlungsseite. Die Konfigurationsdaten werden zur\
Initialisierung des Stripe.js-Objekts im Frontend benötigt.

***

## Variablen

### \$wsStripe.configuration

Gibt die Stripe-Konfigurationsdaten aus. Wird zur Initialisierung des Stripe-Objekts im Frontend verwendet.

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
{{ var $myStripeConfig = $wsStripe.configuration }}
```

#### \$wsStripe.configuration.publishalbeKey

Gibt den öffentlichen Stripe-Schlüssel aus. Dieser Schlüssel wird zur Initialisierung von Stripe.js im Browser benötigt und ist sicher für die Verwendung im Frontend.

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
Publishable Key: {{= $wsStripe.configuration.publishableKey }}
```

#### \$wsStripe.configuration.targetAccount

Gibt die Stripe Connected Account ID aus. Wird nur bei Plattform- oder Marktplatz-Zahlungen benötigt, wenn Zahlungen an einen verbundenen Account weitergeleitet werden.

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
Target Account: {{= $wsStripe.configuration.targetAccount }}
```

### \$wsStripe.paymentCanceled

Gibt `true` aus, wenn die Zahlung abgebrochen wurde.

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
{{ if $wsStripe.paymentCanceled }}
  // Die Zahlung wurde abgebrochen
{{ /if }}
```

### \$wsStripe.paymentFailed

Gibt `true` aus, wenn die Zahlung fehlgeschlagen ist.

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
{{ if $wsStripe.paymentFailed }}
  // Die Zahlung ist fehlgeschlagen
{{ /if }}
```

### \$wsStripe.paymentPending

Gibt `true` aus, wenn die Zahlung noch aussteht.

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
{{ if $wsStripe.paymentPending }}
  // Die Zahlung wird verarbeitet
{{ /if }}
```

***

## Methoden

### \$wsStripe.createCustomerSession()

Erstellt eine Stripe Customer Session für den aktuell eingeloggten Kunden. Die Session ermöglicht sicheren Zugriff auf gespeicherte Zahlungsmethoden und Kundendaten direkt im Frontend.

**Signatur**\
`$wsStripe.createCustomerSession()`

**Rückgabe**\
`map` - Customer Session Objekt mit folgenden Attributen:

| **Attribut**   | **Typ**   | **Beschreibung**                                            |
| -------------- | --------- | ----------------------------------------------------------- |
| client\_secret | string    | Geheimer Schlüssel für den sicheren Zugriff auf den Kunden. |
| components     | object    | Konfiguration für aktivierte Stripe-Komponente.             |
| customer       | string    | ID des Kunden, für den die Session erstellt wurde.          |
| expires\_at    | timestamp | Zeitpunkt, zu dem die Session abläuft.                      |

**Beispiel,** das eine Customer Session erstellt.

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
{{ var $myCustomerSession = $wsStripe.createCustomerSession() }}
const customerSessionClientSecret = "{{= $myCustomerSession.client_secret }}
```

***

## Aktionen

Für `$wsStripe` stehen keine Aktionen zur Verfügung.

***

## Beispiele

### Zahlungsstatus prüfen

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
{{ if $wsStripe.paymentCanceled }}
  <div class="alert">Die Zahlung wurde abgebrochen.</div>
{{ /if }}

{{ if $wsStripe.paymentFailed }}
  <div class="alert error">Die Zahlung ist fehlgeschlagen.</div>
{{ /if }}

{{ if $wsStripe.paymentPending }}
  <div class="alert info">Die Zahlung wird verarbeitet.</div>
{{ /if }}
```

***

## Weiterführende Links

* [payment - Zahlungsmethoden](/konfiguration/payment-zahlungsmethoden)
* [\$wsCheckout](/frontend/referenz/module/wscheckout)
* [https://docs.stripe.com/api](https://docs.stripe.com/api)