# Zahlungen mit MobilePay

So akzeptieren Sie MobilePay, eine beliebte Zahlungsmethode in Dänemark und Finnland.

# Bezahlvorgang

> This is a Bezahlvorgang for when payment-ui is checkout. View the full page at https://docs.stripe.com/payments/mobilepay/accept-a-payment?payment-ui=checkout.

MobilePay ist eine [einmalige](https://docs.stripe.com/payments/payment-methods.md#usage) Karten-Wallet-Zahlungsmethode, die in Dänemark und Finnland verwendet wird. Sie ermöglicht Ihren Kundinnen und Kunden, Zahlungen mit der Vipps-App [zu authentifizieren und zu genehmigen](https://docs.stripe.com/payments/payment-methods.md#customer-actions).

Wenn Ihre Kundin oder Ihr Kunde mit MobilePay bezahlt, führt Stripe eine Kartentransaktion mit den von MobilePay empfangenen Kartendaten durch. Die Verarbeitung der Kartentransaktion ist für Ihre Integration unsichtbar und Stripe [benachrichtigt Sie sofort](https://docs.stripe.com/payments/payment-methods.md#payment-notification) darüber, ob die Zahlung erfolgreich war oder fehlgeschlagen ist.

> Stripe kann Ihren Kundinnen und Kunden automatisch die relevanten Zahlungsmethoden anzeigen, indem Währungen, Einschränkungen der Zahlungsmethode und andere Parameter ausgewertet werden.
> 
> - Befolgen Sie den Leitfaden [Eine Zahlung akzeptieren](https://docs.stripe.com/payments/accept-a-payment.md?payment-ui=checkout&ui=stripe-hosted), um eine Checkout-Integration zu erstellen, die [dynamische Zahlungsmethoden](https://docs.stripe.com/payments/payment-methods/dynamic-payment-methods.md) verwendet.
- Wenn Sie keine dynamischen Zahlungsmethoden verwenden möchten, befolgen Sie die folgenden Schritte, um die Zahlungsmethoden in Ihrer Checkout-Integration manuell zu konfigurieren.

Verwenden Sie diese Anleitung, um MobilePay bei [Checkout](https://docs.stripe.com/payments/checkout.md), unserem gehosteten Checkout-Formular, zu aktivieren und erfahren Sie die Unterschiede zwischen der Annahme von Zahlungen über dynamische Zahlungsmethoden und der manuellen Konfiguration von Zahlungsmethoden.

## Kompatibilität bestimmen

**Unterstützte Unternehmensstandorte**: EEA

**Unterstützte Währungen**: `eur, dkk, sek, nok`

**Transaktionswährungen**: `eur, dkk, sek, nok`

**Zahlungsmodus**: Yes

**Einrichtungsmodus**: No

**Abonnementmodus**: No

Für die Unterstützung von Zahlungen per MobilePay muss eine Checkout-Sitzung alle folgenden Bedingungen erfüllen:

- Die *Preise* (Prices define how much and how often to charge for products. This includes how much the product costs, what currency to use, and the interval if the price is for subscriptions) für alle Posten müssen in Euro, in der dänischen Krone, in der schwedischen Krone oder in der norwegischen Krone angegeben werden (Währungscodes `eur`, `dkk`, `sek` oder `nok`).

## Stripe einrichten [Serverseitig]

Zunächst benötigen Sie ein Stripe-Konto. [Registrieren Sie sich jetzt](https://dashboard.stripe.com/register).

Nutzen Sie unsere offiziellen Bibliotheken 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'
```

## Zahlungen annehmen

> Dieser Leitfaden beruht auf der grundlegenden Checkout-Integration für die [Annahme einer Zahlung](https://docs.stripe.com/payments/accept-a-payment.md?integration=checkout).

### MobilePay als Zahlungsmethode aktivieren

Führen Sie bei der Erstellung einer neuen [Checkout-Sitzung](https://docs.stripe.com/api/checkout/sessions.md) folgende Schritte aus:

1. Fügen Sie `mobilepay` der Liste der `payment_method_types` hinzu.
1. Stellen Sie sicher, dass alle `line_items` die Währungen `EUR`, `DKK`, `SEK` oder `NOK` verwenden.

#### Von Stripe gehostete Seite

```curl
curl https://api.stripe.com/v1/checkout/sessions \
  -u "<<YOUR_SECRET_KEY>>:" \
  -d "line_items[0][price_data][currency]=dkk" \
  -d "line_items[0][price_data][product_data][name]=T-shirt" \
  -d "line_items[0][price_data][unit_amount]=2000" \
  -d "line_items[0][quantity]=1" \
  -d mode=payment \
  -d "payment_method_types[0]=card" \
  -d "payment_method_types[1]=mobilepay" \
  --data-urlencode "success_url=https://example.com/success"
```

#### Vollständig eingebettete Seite

```curl
curl https://api.stripe.com/v1/checkout/sessions \
  -u "<<YOUR_SECRET_KEY>>:" \
  -d "line_items[0][price_data][currency]=dkk" \
  -d "line_items[0][price_data][product_data][name]=T-shirt" \
  -d "line_items[0][price_data][unit_amount]=2000" \
  -d "line_items[0][quantity]=1" \
  -d mode=payment \
  -d "payment_method_types[0]=card" \
  -d "payment_method_types[1]=mobilepay" \
  --data-urlencode "return_url=https://example.com/return" \
  -d ui_mode=embedded_page
```

### Abwicklung Ihrer Bestellungen

Informieren Sie sich über die [Ausführung von Bestellungen](https://docs.stripe.com/checkout/fulfillment.md), nachdem Sie eine Zahlung angenommen haben.

## Ereignisse nach der Zahlung verarbeiten

Stripe übermittelt 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 im Dashboard einen *Webhook* (A webhook is a real-time push notification sent to your application as a JSON payload through HTTPS requests) oder eine Partnerlösung, um diese Ereignisse zu empfangen und Aktionen auszuführen (Versenden einer Bestellbestätigung per E-Mail an die Kund/innen, Erfassen des Verkaufs in einer Datenbank oder Einleiten des Versandablaufs).

Überwachen Sie diese Ereignisse, statt auf einen Callback vom Client zu warten. Auf dem Client könnte der Kunde/die Kundin das Browserfenster schließen oder die App beenden, bevor der Callback erfolgt ist und böswillige Clients könnten die Antwort manipulieren. Wenn Sie Ihre Integration so einrichten, dass asynchrone Ereignisse überwacht werden, hilft Ihnen dies auch dabei, in Zukunft mehr Zahlungsmethoden zu akzeptieren. Hier erhalten Sie Informationen zu den [Unterschieden zwischen allen unterstützten Zahlungsmethoden](https://stripe.com/payments/payment-methods-guide).

- **Manuelles Bearbeiten von Ereignissen im Dashboard**

  Verwenden Sie das Dashboard, um [Ihre Testzahlungen im Dashboard anzuzeigen](https://dashboard.stripe.com/test/payments), E-Mail-Belege zu senden, Auszahlungen zu bearbeiten oder fehlgeschlagene Zahlungen erneut zu versuchen.

- **Erstellen eines benutzerdefinierten Webhooks**

  [Build a custom webhook](https://docs.stripe.com/webhooks/handling-payment-events.md#build-your-own-webhook) handler to listen for events and build custom asynchronous payment flows. Test and debug your webhook integration locally with the Stripe CLI.

- **Integrieren einer vorgefertigten App**

  Bearbeiten Sie häufige Unternehmensereignisse, wie z.&nbsp;B.[Automatisierung](https://stripe.partners/?f_category=automation) oder[Marketing und Vertrieb](https://stripe.partners/?f_category=marketing-and-sales), indem Sie eine Partneranwendung integrieren.

## Integration testen

#### Testen von mobilen Web-Apps

Um Ihre Integration zu testen, wählen Sie als Zahlungsmethode MobilePay und tippen Sie auf **Bezahlen**. In einer Testumgebung werden Sie auf eine Testzahlungsseite weitergeleitet, auf der Sie die Zahlung genehmigen oder ablehnen können.

Wenn Sie im Live-Modus auf **Bezahlen** tippen, werden Sie zur mobilen App von MobilePay weitergeleitet. Dort können Sie die Zahlung genehmigen oder ablehnen.

#### Testen von Desktop-Web-Apps

Um Ihre Integration in einer Testumgebung zu testen, werden Sie auf eine Testzahlungsseite weitergeleitet, auf der Sie die Testzahlung genehmigen oder ablehnen können.

Geben Sie im Live-Modus die mit MobilePay verknüpfte Telefonnummer ein, um eine Push-Benachrichtigung an die mobile App von MobilePay zu senden. In der App können Sie die Zahlung genehmigen oder ablehnen.

## Optional: Zahlung autorisieren und später erfassen

MobilePay unterstützt die [separate Autorisierung und Erfassung](https://docs.stripe.com/payments/place-a-hold-on-a-payment-method.md).

### Stripe anweisen, nur die Autorisierung durchzuführen

Um anzugeben, dass Sie Autorisierung und Erfassung trennen möchten, legen Sie [capture_method](https://docs.stripe.com/api/checkout/sessions/create.md#create_checkout_session-payment_intent_data-capture_method) beim Erstellen der Checkout-Sitzung auf `manual` fest. Dieser Parameter weist Stripe an, nur den Betrag auf der Karte des Kunden/der Kundin zu autorisieren, der mit MobilePay verknüpft ist.

```curl
curl https://api.stripe.com/v1/checkout/sessions \
  -u "<<YOUR_SECRET_KEY>>:" \
  -d mode=payment \
  -d "payment_method_types[0]=card" \
  -d "payment_method_types[1]=mobilepay" \
  -d "line_items[0][price_data][currency]=dkk" \
  -d "line_items[0][price_data][product_data][name]=T-shirt" \
  -d "line_items[0][price_data][unit_amount]=2000" \
  -d "line_items[0][quantity]=1" \
  -d "payment_intent_data[capture_method]=manual" \
  --data-urlencode "success_url=https://example.com/success.html"
```

Nach erfolgreicher Autorisierung sendet Stripe das Ereignis [payment_intent.amount_capturable_updated](https://docs.stripe.com/api/events/types.md#event_types-payment_intent.amount_capturable_updated). Weitere Informationen finden Sie unter [Ereignisse](https://docs.stripe.com/api/events.md).

### Die Gelder erfassen

Nach erfolgreicher Autorisierung wechselt der [Status](https://docs.stripe.com/api/payment_intents/object.md#payment_intent_object-status) der PaymentIntent zu `requires_capture`, und Sie können die autorisierten Gelder [erfassen](https://docs.stripe.com/api/payment_intents/capture.md). Stripe unterstützt nur die manuelle Erfassung des Gesamtbetrags.

```curl
curl https://api.stripe.com/v1/payment_intents/{{PAYMENTINTENT_ID}}/capture \
  -u "<<YOUR_SECRET_KEY>>:" \
  -d amount_to_capture=2000
```

## Optional: Stornierung

Sie können MobilePay-Zahlungen stornieren, bevor sie ablaufen, indem Sie [den mit der MobilePay-Zahlung verknüpften PaymentIntent stornieren](https://docs.stripe.com/api/payment_intents/cancel.md).

## Fehlgeschlagene Zahlungen

MobilePay-Transaktionen können fehlschlagen, wenn die zugrunde liegende Kartentransaktion abgelehnt wird. Weitere Infos zu [Kartenablehnungen](https://docs.stripe.com/declines/card.md). In diesem Fall wird die PaymentMethod getrennt und der Status des PaymentIntent wechselt automatisch zu `requires_payment_method`.

Wenn der Status des PaymentIntent `requires_action` ist, muss Ihr Kunde/Ihre Kundin die Zahlung innerhalb von 5&nbsp;Minuten authentifizieren. Wenn nach 5 Minuten keine Aktion erfolgt ist, wird die PaymentMethod getrennt und der Status des PaymentIntent wechselt automatisch zu `requires_payment_method`.

## Rückerstattungen und angefochtene Zahlungen

Stripe führt eine Kartentransaktion mit Standard-Card-Rails im Rahmen einer Vipps-Transaktion durch. [Rückerstattungen](https://docs.stripe.com/refunds.md) und [Zahlungsanfechtungen](https://docs.stripe.com/disputes/how-disputes-work.md) unterliegen den Netzwerkregeln von Visa und Mastercard.

## See also

- [Mehr über MobilePay](https://docs.stripe.com/payments/mobilepay.md)
- [Checkout-Ausführung](https://docs.stripe.com/checkout/fulfillment.md)
- [Checkout anpassen](https://docs.stripe.com/payments/checkout/customization.md)


# Elements

> This is a Elements for when payment-ui is elements. View the full page at https://docs.stripe.com/payments/mobilepay/accept-a-payment?payment-ui=elements.

MobilePay ist eine [einmalige](https://docs.stripe.com/payments/payment-methods.md#usage) Karten-Wallet-Zahlungsmethode, die in Dänemark und Finnland verwendet wird. Sie ermöglicht Ihren Kundinnen und Kunden, Zahlungen mit der Vipps-App [zu authentifizieren und zu genehmigen](https://docs.stripe.com/payments/payment-methods.md#customer-actions).

Wenn Ihre Kundin oder Ihr Kunde mit MobilePay bezahlt, führt Stripe eine Kartentransaktion mit den von MobilePay empfangenen Kartendaten durch. Die Verarbeitung der Kartentransaktion ist für Ihre Integration unsichtbar und Stripe [benachrichtigt Sie sofort](https://docs.stripe.com/payments/payment-methods.md#payment-notification) darüber, ob die Zahlung erfolgreich war oder fehlgeschlagen ist.

In diesem Leitfaden zeigen wir Ihnen, wie Sie mit dem [Payment Element](https://docs.stripe.com/payments/payment-element.md) ein nutzerdefiniertes Zahlungsformular von Stripe in Ihre Website oder Anwendung einbetten. Mit dem Payment Element können Sie Zahlungsmethoden wie MobilePay automatisch annehmen. Erweiterte Konfigurationen und Anpassungen finden Sie im Integrationsleitfaden für die [Zahlungsannahme](https://docs.stripe.com/payments/accept-a-payment.md)

## Stripe einrichten [Serverseitig]

Zunächst benötigen Sie ein Stripe-Konto. [Registrieren Sie sich jetzt](https://dashboard.stripe.com/register).

Nutzen Sie unsere offiziellen Bibliotheken 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'
```

## 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.

#### Zahlungsmethoden über das Dashboard verwalten

Erstellen Sie einen PaymentIntent auf Ihrem Server mit einem Betrag und einer Währung. Sie können Zahlungsmethoden über das [Dashboard](https://dashboard.stripe.com/settings/payment_methods) verwalten. Stripe handhabt die Rückgabe der geeigneten Zahlungsmethoden anhand von Faktoren wie Transaktionsbetrag, Währung und Zahlungsablauf. Stellen Sie vor Erstellung des Payment Intent sicher, dass Sie **MobilePay** in den [Einstellungen für Zahlungsmethoden](https://dashboard.stripe.com/settings/payment_methods) aktiviert haben.

Legen Sie den zu zahlenden Betrag immer serverseitig fest, also in einer vertrauenswürdigen Umgebung, und nicht auf Client-Seite. So wird verhindert, dass böswillige Kundinnen und Kunden ihre eigenen Preise festlegen können.

```curl
curl https://api.stripe.com/v1/payment_intents \
  -u "<<YOUR_SECRET_KEY>>:" \
  -d amount=1099 \
  -d currency=usd \
  -d "automatic_payment_methods[enabled]=true"
```

#### Zahlungsmethoden manuell auflisten

Wenn Sie das Dashboard nicht nutzen oder die Zahlungsmethoden manuell angeben möchten, können Sie diese mit dem Attribut `payment_method_types` auflisten.

Erstellen Sie einen PaymentIntent auf Ihrem Server mit einem Betrag, einer Währung und einer Liste der Zahlungsmethoden. Entscheiden Sie immer auf Server-Seite, die im Gegensatz zur Client-Seite vertrauenswürdig ist, wie viel berechnet werden soll. Dadurch wird verhindert, dass böswillige Kundinnen und Kunden ihre eigenen Preise wählen können.

```curl
curl https://api.stripe.com/v1/payment_intents \
  -u "<<YOUR_SECRET_KEY>>:" \
  -d amount=1000 \
  -d currency=eur \
  -d "payment_method_types[]=mobilepay"
```

### 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
<form id="payment-form" data-secret="<%= @intent.client_secret %>">
  <div id="payment-element">
    <!-- placeholder for Elements -->
  </div>
  <button id="submit">Submit</button>
</form>
```

```ruby
get '/checkout' do
  @intent = # ... Fetch or create the PaymentIntent
  erb :checkout
end
```

## Zahlungsdaten erfassen [Clientseitig]

Erfassen Sie Zahlungsdetails auf dem Client mit dem [Payment Element](https://docs.stripe.com/payments/payment-element.md). Das Payment Element ist eine vorgefertigte Komponente der Nutzeroberfläche, die die Erfassung von Zahlungsdaten für eine Vielzahl von 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.

Wenn Sie sich für die Verwendung eines Iframes entscheiden und Apple Pay oder Google Pay akzeptieren möchten, muss das Attribut [Zulassen](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/iframe#attr-allowpaymentrequest) des Iframes auf `"payment*"` gesetzt sein.

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.

#### HTML + JS

### Stripe.js einrichten

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
<head>
  <title>Checkout</title>
  <script src="https://js.stripe.com/dahlia/stripe.js"></script>
</head>
```

Erstellen Sie auf Ihrer Bezahlseite eine Instanz von Stripe mit dem folgenden JavaScript:

```javascript
// Set your publishable key: remember to change this to your live publishable key in production
// See your keys here: https://dashboard.stripe.com/apikeys
const stripe = Stripe('<<YOUR_PUBLISHABLE_KEY>>');
```

### Payment Element Ihrer Bezahlseite 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
<form id="payment-form">
  <div id="payment-element">
    <!-- Elements will create form elements here -->
  </div>
  <button id="submit">Submit</button>
  <div id="error-message">
    <!-- Display error message to your customers here -->
  </div>
</form>
```

Wenn das vorherige Formular geladen wurde, erstellen Sie eine Instanz des Payment Element und verbinden es mit dem DOM-Knoten (Container). Übergeben Sie das [Client-Geheimnis](https://docs.stripe.com/api/payment_intents/object.md#payment_intent_object-client_secret) aus dem vorherigen Schritt an `options`, wenn Sie die [Elements](https://docs.stripe.com/js/elements_object/create)-Instanz erstellen:

Gehen Sie sorgfältig mit dem Client-Geheimnis um, denn es kann die Zahlung abschließen. Protokollieren Sie es nicht, betten Sie es nicht in URLs ein und geben Sie es nur dem/der Kund/in preis.

```javascript
const options = {
  clientSecret: '{{CLIENT_SECRET}}',
  // Fully customizable with appearance API.
  appearance: {/*...*/},
};

// Set up Stripe.js and Elements to use in checkout form, passing the client secret obtained in a previous stepconst elements = stripe.elements(options);
// Optional: Autofill user's saved payment methods. If the customer's
// email is known when the page is loaded, you can pass the email
// to the linkAuthenticationElement on mount:
//
//   linkAuthenticationElement.mount("#link-authentication-element",  {
//     defaultValues: {
//       email: 'jenny.rosen@example.com',
//     }
//   })

// Create and mount the Payment Element
const paymentElementOptions = { layout: 'accordion'};
const paymentElement = elements.create('payment', paymentElementOptions);
paymentElement.mount('#payment-element');

```

#### React

### Stripe.js einrichten

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 Komponente Ihrer Bezahlseite in einen [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` an den `Elements`-Anbieter. Übergeben Sie auch das [Client-Geheimnis](https://docs.stripe.com/api/payment_intents/object.md#payment_intent_object-client_secret) aus dem vorherigen Schritt als `options` an den `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('<<YOUR_PUBLISHABLE_KEY>>');

function App() {
  const options = {
    // passing the client secret obtained in step 3
    clientSecret: '{{CLIENT_SECRET}}',
    // Fully customizable with appearance API.
    appearance: {/*...*/},
  };

  return (
    <Elements stripe={stripePromise} options={options}>
      <CheckoutForm />
    </Elements>
  );
};

ReactDOM.render(<App />, document.getElementById('root'));
```

### Payment Element 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 (
    <form>
      // Optional: Autofill user's saved payment methods. If the customer's
      // email is known when the page is loaded, you can pass the email
      // to the linkAuthenticationElement
      //
      // <LinkAuthenticationElement id="link-authentication-element"
        // Prefill the email field like so:
        // options={{defaultValues: {email: 'foo@bar.com'}}}
      // /><PaymentElement />
      <button>Submit</button>
    </form>
  );
};

export default CheckoutForm;
```

## 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.&nbsp;B. eine Bankautorisierungsseite, bevor sie zur `return_url` weitergeleitet werden. Kartenzahlungen werden sofort zur `return_url` weitergeleitet, wenn eine Zahlung erfolgreich war.

#### 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 (
    <form onSubmit={handleSubmit}>
      <PaymentElement />
      <button disabled={!stripe}>Submit</button>
      {/* Show error message to your customers */}
      {errorMessage && <div>{errorMessage}</div>}
    </form>
  );
};

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('<<YOUR_PUBLISHABLE_KEY>>');

// 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;
```

## Transaktionen umleiten und authentifizieren

Kundinnen/Kunden können Transaktionen per MobilePay mit der mobilen App oder der Desktop-App authentifizieren. Der kundenseitig verwendete Client bestimmt die Authentifizierungsmethode, nachdem `confirmPayment` aufgerufen wurde.

#### Authentifizierung mittels mobiler Apps

Nachdem Sie `confirmPayment` aufgerufen haben, leitet Stripe Ihre Kundinnen/Kunden zu MobilePay weiter, um die Zahlung zu genehmigen oder abzulehnen. Nachdem Ihre Kundinnen/Kunden die Zahlung autorisiert haben, leitet die Seite diese zur `return_url` des Payment Intent weiter. Stripe fügt `payment_intent`, `payment_intent_client_secret`, `redirect_pm_type` und `redirect_status` als URL-Abfrageparameter hinzu (zusätzlich zu allen vorhandenen Abfrageparametern in `return_url` ).

Eine Authentifizierungssitzung läuft nach 5&nbsp;Minuten ab und dann wechselt der Status des PaymentIntent wieder auf `require_payment_method`. Nach der Statusänderung sehen Ihre Kundinnen/Kunden einen Zahlungsfehler und müssen den Bezahlvorgang von vorne beginnen.

#### Authentifizierung über Desktop-Web-App

Nachdem Sie `confirmPayment` aufgerufen haben, leitet Stripe Ihre Kundinnen/Kunden zu einer von MobilePay gehosteten Seite weiter, auf der sie die mit ihrem MobilePay-Konto verknüpfte Telefonnummer eingeben können. Dadurch wird eine Push-Benachrichtigung an deren MobilePay-App gesendet, über welche sie die Zahlung authentifizieren müssen. Sobald die Zahlung erfolgreich authentifiziert wurde, werden Ihre Kundinnen/Kunden zur `return_url` zurückgeleitet. Wenn Sie nach der Zahlung keine automatische Weiterleitung einrichten möchten, übergeben Sie `redirect: if_required` an das Payment Element.

Eine Authentifizierungssitzung läuft nach 5&nbsp;Minuten ab und dann wechselt der Status des PaymentIntent wieder auf `require_payment_method`. Nach der Statusänderung sehen Ihre Kundinnen/Kunden einen Zahlungsfehler und müssen den Bezahlvorgang von vorne beginnen.

## Ereignisse nach der Zahlung verarbeiten

Stripe übermittelt 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 im Dashboard einen *Webhook* (A webhook is a real-time push notification sent to your application as a JSON payload through HTTPS requests) oder eine Partnerlösung, um diese Ereignisse zu empfangen und Aktionen auszuführen (Versenden einer Bestellbestätigung per E-Mail an die Kund/innen, Erfassen des Verkaufs in einer Datenbank oder Einleiten des Versandablaufs).

Überwachen Sie diese Ereignisse, statt auf einen Callback vom Client zu warten. Auf dem Client könnte der Kunde/die Kundin das Browserfenster schließen oder die App beenden, bevor der Callback erfolgt ist und böswillige Clients könnten die Antwort manipulieren. Wenn Sie Ihre Integration so einrichten, dass asynchrone Ereignisse überwacht werden, hilft Ihnen dies auch dabei, in Zukunft mehr Zahlungsmethoden zu akzeptieren. Hier erhalten Sie Informationen zu den [Unterschieden zwischen allen unterstützten Zahlungsmethoden](https://stripe.com/payments/payment-methods-guide).

- **Manuelles Bearbeiten von Ereignissen im Dashboard**

  Verwenden Sie das Dashboard, um [Ihre Testzahlungen im Dashboard anzuzeigen](https://dashboard.stripe.com/test/payments), E-Mail-Belege zu senden, Auszahlungen zu bearbeiten oder fehlgeschlagene Zahlungen erneut zu versuchen.

- **Erstellen eines benutzerdefinierten Webhooks**

  [Build a custom webhook](https://docs.stripe.com/webhooks/handling-payment-events.md#build-your-own-webhook) handler to listen for events and build custom asynchronous payment flows. Test and debug your webhook integration locally with the Stripe CLI.

- **Integrieren einer vorgefertigten App**

  Bearbeiten Sie häufige Unternehmensereignisse, wie z.&nbsp;B.[Automatisierung](https://stripe.partners/?f_category=automation) oder[Marketing und Vertrieb](https://stripe.partners/?f_category=marketing-and-sales), indem Sie eine Partneranwendung integrieren.

## Integration testen

#### Testen von mobilen Web-Apps

Um Ihre Integration zu testen, wählen Sie als Zahlungsmethode MobilePay und tippen Sie auf **Bezahlen**. In einer Testumgebung werden Sie auf eine Testzahlungsseite weitergeleitet, auf der Sie die Zahlung genehmigen oder ablehnen können.

Wenn Sie im Live-Modus auf **Bezahlen** tippen, werden Sie zur mobilen App von MobilePay weitergeleitet. Dort können Sie die Zahlung genehmigen oder ablehnen.

#### Testen von Desktop-Web-Apps

Um Ihre Integration in einer Testumgebung zu testen, werden Sie auf eine Testzahlungsseite weitergeleitet, auf der Sie die Testzahlung genehmigen oder ablehnen können.

Geben Sie im Live-Modus die mit MobilePay verknüpfte Telefonnummer ein, um eine Push-Benachrichtigung an die mobile App von MobilePay zu senden. In der App können Sie die Zahlung genehmigen oder ablehnen.

## Optional: Zahlung autorisieren und später erfassen

MobilePay unterstützt die [separate Autorisierung und Erfassung](https://docs.stripe.com/payments/place-a-hold-on-a-payment-method.md).

### Stripe anweisen, nur die Autorisierung durchzuführen

Um anzugeben, dass Sie Autorisierung und Erfassung trennen möchten, legen Sie [capture_method](https://docs.stripe.com/api/payment_intents/create.md#create_payment_intent-capture_method) beim Erstellen des PaymentIntent auf `manual` fest. Dieser Parameter weist Stripe an, nur den Betrag auf der Karte des Kunden/der Kundin zu autorisieren, der mit MobilePay verknüpft ist.

```curl
curl https://api.stripe.com/v1/payment_intents \
  -u "<<YOUR_SECRET_KEY>>:" \
  -d amount=1099 \
  -d currency=dkk \
  -d capture_method=manual \
  -d "payment_method_types[]=mobilepay" \
  -d "payment_method_data[type]=mobilepay"
```

Nach erfolgreicher Autorisierung sendet Stripe das Ereignis [payment_intent.amount_capturable_updated](https://docs.stripe.com/api/events/types.md#event_types-payment_intent.amount_capturable_updated). Weitere Informationen finden Sie unter [Ereignisse](https://docs.stripe.com/api/events.md).

### Die Gelder erfassen

Nach erfolgreicher Autorisierung wechselt der [Status](https://docs.stripe.com/api/payment_intents/object.md#payment_intent_object-status) der PaymentIntent zu `requires_capture`, und Sie können die autorisierten Gelder [erfassen](https://docs.stripe.com/api/payment_intents/capture.md). Stripe unterstützt nur die manuelle Erfassung des Gesamtbetrags.

```curl
curl https://api.stripe.com/v1/payment_intents/{{PAYMENTINTENT_ID}}/capture \
  -u "<<YOUR_SECRET_KEY>>:" \
  -d amount_to_capture=1099
```

## Optional: Stornierung

Sie können MobilePay-Zahlungen stornieren, bevor sie ablaufen, indem Sie [den mit der MobilePay-Zahlung verknüpften PaymentIntent stornieren](https://docs.stripe.com/api/payment_intents/cancel.md).

## Fehlgeschlagene Zahlungen

MobilePay-Transaktionen können fehlschlagen, wenn die zugrunde liegende Kartentransaktion abgelehnt wird. Weitere Infos zu [Kartenablehnungen](https://docs.stripe.com/declines/card.md). In diesem Fall wird die PaymentMethod getrennt und der Status des PaymentIntent wechselt automatisch zu `requires_payment_method`.

Wenn der Status des PaymentIntent `requires_action` ist, muss Ihr Kunde/Ihre Kundin die Zahlung innerhalb von 5&nbsp;Minuten authentifizieren. Wenn nach 5 Minuten keine Aktion erfolgt ist, wird die PaymentMethod getrennt und der Status des PaymentIntent wechselt automatisch zu `requires_payment_method`.

## Rückerstattungen und angefochtene Zahlungen

Stripe führt eine Kartentransaktion mit Standard-Card-Rails im Rahmen einer Vipps-Transaktion durch. [Rückerstattungen](https://docs.stripe.com/refunds.md) und [Zahlungsanfechtungen](https://docs.stripe.com/disputes/how-disputes-work.md) unterliegen den Netzwerkregeln von Visa und Mastercard.


# Direct API

> This is a Direct API for when payment-ui is direct-api. View the full page at https://docs.stripe.com/payments/mobilepay/accept-a-payment?payment-ui=direct-api.

MobilePay ist eine [einmalige](https://docs.stripe.com/payments/payment-methods.md#usage) Karten-Wallet-Zahlungsmethode, die in Dänemark und Finnland verwendet wird. Sie ermöglicht Ihren Kundinnen und Kunden, Zahlungen mit der Vipps-App [zu authentifizieren und zu genehmigen](https://docs.stripe.com/payments/payment-methods.md#customer-actions).

Wenn Ihre Kundin oder Ihr Kunde mit MobilePay bezahlt, führt Stripe eine Kartentransaktion mit den von MobilePay empfangenen Kartendaten durch. Die Verarbeitung der Kartentransaktion ist für Ihre Integration unsichtbar und Stripe [benachrichtigt Sie sofort](https://docs.stripe.com/payments/payment-methods.md#payment-notification) darüber, ob die Zahlung erfolgreich war oder fehlgeschlagen ist.

## Stripe einrichten [Serverseitig]

Zunächst benötigen Sie ein Stripe-Konto. [Registrieren Sie sich jetzt](https://dashboard.stripe.com/register).

Nutzen Sie unsere offiziellen Bibliotheken 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'
```

## PaymentIntent erstellen [Serverseitig]

Ein [PaymentIntent](https://docs.stripe.com/api/payment_intents/object.md) ist ein Objekt, das Ihre Absicht darstellt, eine Zahlung von einem Kunden/einer Kundin einzuziehen, und das den Lebenszyklus des Zahlungsvorgangs in jeder Phase verfolgt. Erstellen Sie einen `PaymentIntent` auf Ihrem Server und geben Sie den einzuziehenden Betrag sowie eine unterstützte Währung an (`eur`, `dkk`, `sek` oder `nok`). Wenn Sie bereits eine Integration mit dem [Payment Intents API](https://docs.stripe.com/payments/payment-intents.md) haben, fügen Sie `mobilepay` zur Liste der [Zahlungsmethoden](https://docs.stripe.com/api/payment_intents/create.md#create_payment_intent-payment_method_types) hinzu.

```curl
curl https://api.stripe.com/v1/payment_intents \
  -u "<<YOUR_SECRET_KEY>>:" \
  -d amount=1099 \
  -d currency=dkk \
  -d "payment_method_types[]=mobilepay" \
  -d "payment_method_data[type]=mobilepay"
```

### Beispielantwort

```json
{
  "id": "pi_12345",
  "amount": 1099,
  "client_secret": "pi_12345_secret_abcdef",
  "currency": "dkk",
  "payment_method": "pm_12345",
  "payment_method_types": [
     "mobilepay"
  ],
  "status": "requires_confirmation"
}
```

### 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
<form id="payment-form" data-secret="<%= @intent.client_secret %>">
  <button id="submit">Submit</button>
</form>
```

```ruby
get '/checkout' do
  @intent = # ... Fetch or create the PaymentIntent
  erb :checkout
end
```

## PaymentIntent bestätigen

Verwenden Sie die PaymentIntent-[ID](https://docs.stripe.com/api/payment_intents/object.md#payment_intent_object-id) aus [Schritt&nbsp;2](https://docs.stripe.com/payments/mobilepay/accept-a-payment.md#create-payment-intent), um den PaymentIntent zu *bestätigen* (Confirming an intent indicates that the customer intends to use the current or provided payment method. Upon confirmation, the intent attempts to initiate the portions of the flow that have real-world side effects). Dadurch wird erklärt, dass die Kundin/der Kunde beabsichtigt, mit der angegebenen *PaymentMethod* (PaymentMethods represent your customer's payment instruments, used with the Payment Intents or Setup Intents APIs) zu bezahlen. Stripe leitet eine Zahlung ein, nachdem der PaymentIntent bestätigt wurde. Die [return_url](https://docs.stripe.com/api/payment_intents/create.md#create_payment_intent-return_url) gibt an, wohin Stripe den Kunden/die Kundin weiterleitet, nachdem die Zahlung abgeschlossen ist.

```curl
curl https://api.stripe.com/v1/payment_intents/{{PAYMENTINTENT_ID}}/confirm \
  -u "<<YOUR_SECRET_KEY>>:" \
  --data-urlencode "return_url=https://example.com/checkout/complete"
```

### Beispielantwort

```json
{
  "id": "pi_12345",
  "amount": 1099,
  "currency": "dkk",
  "payment_method": "pm_12345",
  "next_action": {
    "redirect_to_url": {
      "return_url": "https://example.com/checkout/complete",
      "url": "https://pm-redirects.stripe.com/authorize/acct_123/pa_nonce_abc"
    },
    "type": "redirect_to_url"
  },
  "payment_method_types": [
     "mobilepay"
  ],
  "status": "requires_action"
}
```

Um die Zahlung zu autorisieren, leiten Sie Ihre Kundinnen/Kunden an die URL im Feld [next_action[redirect_to_url][url]](https://docs.stripe.com/api/payment_intents/object.md#payment_intent_object-next_action-redirect_to_url-url) weiter.

- Auf dem Desktop öffnet die URL eine MobilePay-Landingpage, auf der die Kundinnen/Kunden ihre Telefonnummer eingeben können, mit der ihr MobilePay-Konto identifiziert wird. Sie können dann die MobilePay-Smartphone-App verwenden, um mit der Zahlungsautorisierung fortzufahren.
- Auf Mobilgeräten öffnet die URL direkt die MobilePay-Anwendung (falls vorhanden) oder leitete Nutzer/innen an die MobilePay-Landingpage weiter, ähnlich wie beim Desktop-Vorgang.

Ihr Kunde/Ihre Kundin hat 5&nbsp;Minuten Zeit, die Weiterleitungs-URL zu öffnen und die Zahlung in der MobilePay-App zu autorisieren. Wenn die zugrunde liegende Kartenzahlung fehlschlägt, kann kundenseitig eine andere Karte ausgewählt und es in der MobilePay-App erneut versucht werden. Wenn die Zahlung nicht innerhalb von 5 Minuten autorisiert wird, schlägt sie fehl und der Status der PaymentIntent wechselt zu `requires_payment_method`.

## Ereignisse nach der Zahlung verarbeiten

Stripe übermittelt 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 im Dashboard einen *Webhook* (A webhook is a real-time push notification sent to your application as a JSON payload through HTTPS requests) oder eine Partnerlösung, um diese Ereignisse zu empfangen und Aktionen auszuführen (Versenden einer Bestellbestätigung per E-Mail an die Kund/innen, Erfassen des Verkaufs in einer Datenbank oder Einleiten des Versandablaufs).

Überwachen Sie diese Ereignisse, statt auf einen Callback vom Client zu warten. Auf dem Client könnte der Kunde/die Kundin das Browserfenster schließen oder die App beenden, bevor der Callback erfolgt ist und böswillige Clients könnten die Antwort manipulieren. Wenn Sie Ihre Integration so einrichten, dass asynchrone Ereignisse überwacht werden, hilft Ihnen dies auch dabei, in Zukunft mehr Zahlungsmethoden zu akzeptieren. Hier erhalten Sie Informationen zu den [Unterschieden zwischen allen unterstützten Zahlungsmethoden](https://stripe.com/payments/payment-methods-guide).

- **Manuelles Bearbeiten von Ereignissen im Dashboard**

  Verwenden Sie das Dashboard, um [Ihre Testzahlungen im Dashboard anzuzeigen](https://dashboard.stripe.com/test/payments), E-Mail-Belege zu senden, Auszahlungen zu bearbeiten oder fehlgeschlagene Zahlungen erneut zu versuchen.

- **Erstellen eines benutzerdefinierten Webhooks**

  [Build a custom webhook](https://docs.stripe.com/webhooks/handling-payment-events.md#build-your-own-webhook) handler to listen for events and build custom asynchronous payment flows. Test and debug your webhook integration locally with the Stripe CLI.

- **Integrieren einer vorgefertigten App**

  Bearbeiten Sie häufige Unternehmensereignisse, wie z.&nbsp;B.[Automatisierung](https://stripe.partners/?f_category=automation) oder[Marketing und Vertrieb](https://stripe.partners/?f_category=marketing-and-sales), indem Sie eine Partneranwendung integrieren.

## Integration testen

Erstellen Sie mit Ihren [Test-API-Schlüsseln](https://docs.stripe.com/keys.md#test-live-modes) einen PaymentIntent. Nachdem Sie den PaymentIntent bestätigt haben, folgen Sie der `next_action`-Weiterleitungs-URL zu einer Testseite mit Optionen zur Autorisierung oder Ablehnung der Zahlung.

- Klicken Sie auf **Testzahlung autorisieren**, um den Fall einer erfolgreichen Zahlung zu testen. Der PaymentIntent wechselt von `requires_action` zu `succeeded`.
- Klicken Sie auf **Testzahlung fehlschlagen lassen**, um den Fall einer fehlgeschlagenen Kundenauthentifizierung zu testen. Der PaymentIntent wechselt von `requires_action` zu `requires_payment_method`.

## Optional: Zahlung autorisieren und später erfassen

MobilePay unterstützt die [separate Autorisierung und Erfassung](https://docs.stripe.com/payments/place-a-hold-on-a-payment-method.md).

### Stripe anweisen, nur die Autorisierung durchzuführen

Um anzugeben, dass Sie Autorisierung und Erfassung trennen möchten, legen Sie [capture_method](https://docs.stripe.com/api/payment_intents/create.md#create_payment_intent-capture_method) beim Erstellen des PaymentIntent auf `manual` fest. Dieser Parameter weist Stripe an, nur den Betrag auf der Karte des Kunden/der Kundin zu autorisieren, der mit MobilePay verknüpft ist.

```curl
curl https://api.stripe.com/v1/payment_intents \
  -u "<<YOUR_SECRET_KEY>>:" \
  -d amount=1099 \
  -d currency=dkk \
  -d capture_method=manual \
  -d "payment_method_types[]=mobilepay" \
  -d "payment_method_data[type]=mobilepay"
```

Nach erfolgreicher Autorisierung sendet Stripe das Ereignis [payment_intent.amount_capturable_updated](https://docs.stripe.com/api/events/types.md#event_types-payment_intent.amount_capturable_updated). Weitere Informationen finden Sie unter [Ereignisse](https://docs.stripe.com/api/events.md).

### Die Gelder erfassen

Nach erfolgreicher Autorisierung wechselt der [Status](https://docs.stripe.com/api/payment_intents/object.md#payment_intent_object-status) der PaymentIntent zu `requires_capture`, und Sie können die autorisierten Gelder [erfassen](https://docs.stripe.com/api/payment_intents/capture.md). Stripe unterstützt nur die manuelle Erfassung des Gesamtbetrags.

```curl
curl https://api.stripe.com/v1/payment_intents/{{PAYMENTINTENT_ID}}/capture \
  -u "<<YOUR_SECRET_KEY>>:" \
  -d amount_to_capture=1099
```

## Optional: Stornierung

Sie können MobilePay-Zahlungen stornieren, bevor sie ablaufen, indem Sie [den mit der MobilePay-Zahlung verknüpften PaymentIntent stornieren](https://docs.stripe.com/api/payment_intents/cancel.md).

## Fehlgeschlagene Zahlungen

MobilePay-Transaktionen können fehlschlagen, wenn die zugrunde liegende Kartentransaktion abgelehnt wird. Weitere Infos zu [Kartenablehnungen](https://docs.stripe.com/declines/card.md). In diesem Fall wird die PaymentMethod getrennt und der Status des PaymentIntent wechselt automatisch zu `requires_payment_method`.

Wenn der Status des PaymentIntent `requires_action` ist, muss Ihr Kunde/Ihre Kundin die Zahlung innerhalb von 5&nbsp;Minuten authentifizieren. Wenn nach 5 Minuten keine Aktion erfolgt ist, wird die PaymentMethod getrennt und der Status des PaymentIntent wechselt automatisch zu `requires_payment_method`.

## Rückerstattungen und angefochtene Zahlungen

Stripe führt eine Kartentransaktion mit Standard-Card-Rails im Rahmen einer Vipps-Transaktion durch. [Rückerstattungen](https://docs.stripe.com/refunds.md) und [Zahlungsanfechtungen](https://docs.stripe.com/disputes/how-disputes-work.md) unterliegen den Netzwerkregeln von Visa und Mastercard.


# iOS

> This is a iOS for when payment-ui is mobile and platform is ios. View the full page at https://docs.stripe.com/payments/mobilepay/accept-a-payment?payment-ui=mobile&platform=ios.

MobilePay ist eine [einmalige](https://docs.stripe.com/payments/payment-methods.md#usage) Karten-Wallet-Zahlungsmethode, die in Dänemark und Finnland verwendet wird. Sie ermöglicht Ihren Kundinnen und Kunden, Zahlungen mit der Vipps-App [zu authentifizieren und zu genehmigen](https://docs.stripe.com/payments/payment-methods.md#customer-actions).

Wenn Ihre Kundin oder Ihr Kunde mit MobilePay bezahlt, führt Stripe eine Kartentransaktion mit den von MobilePay empfangenen Kartendaten durch. Die Verarbeitung der Kartentransaktion ist für Ihre Integration unsichtbar und Stripe [benachrichtigt Sie sofort](https://docs.stripe.com/payments/payment-methods.md#payment-notification) darüber, ob die Zahlung erfolgreich war oder fehlgeschlagen ist.

Stripe empfiehlt, das [Mobile Payment Element](https://docs.stripe.com/payments/accept-a-payment.md?payment-ui=mobile&platform=ios), ein einbettbares Zahlungsformular, zu verwenden, um MobilePay und andere Zahlungsmethoden mit minimalem Aufwand zu Ihrer Integration hinzuzufügen.

In diesem Leitfaden erfahren Sie, wie Sie MobilePay über Ihre native Mobilanwendung akzeptieren, wenn Sie Ihr eigenes benutzerdefiniertes Zahlungsformular verwenden möchten. Ihre native mobile App leitet Ihre Kundinnen und Kunden zur mobilen App von MobilePay weiter, um die Zahlung abzuschließen. Zum Abschließen des Kaufs sind keine zusätzlichen Aktionen in der mobilen App von MobilePay erforderlich.

## 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 = "<<YOUR_PUBLISHABLE_KEY>>"
        // 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.

## PaymentIntent erstellen [Serverseitig] [Clientseitig]

### Serverseitig

Ein [PaymentIntent](https://docs.stripe.com/api/payment_intents/object.md) ist ein Objekt, das Ihre Absicht, eine Kundenzahlung einzuziehen, darstellt und den gesamten Zahlungsvorgang dokumentiert.

So erstellen und bestätigen Sie einen `PaymentIntent` auf Ihrem Server:

- Geben Sie den einzuziehenden Betrag und eine unterstützte Währung an (`eur`, `dkk`, `sek`, or `nok`).
- Fügen Sie `mobilepay` zur Liste der [Zahlungsmethoden](https://docs.stripe.com/api/payment_intents/create.md#create_payment_intent-payment_method_types) für Ihren `PaymentIntent` hinzu. Vergewissern Sie sich, dass Sie MobilePay im [Dashboard](https://dashboard.stripe.com/settings/payment_methods) aktiviert haben.
- Setzen Sie `payment_method_data[type]` auf `mobilepay`, um eine *PaymentMethod* (PaymentMethods represent your customer's payment instruments, used with the Payment Intents or Setup Intents APIs) zu erstellen und diese sofort mit diesem PaymentIntent zu verwenden.

```curl
curl https://api.stripe.com/v1/payment_intents \
  -u "<<YOUR_SECRET_KEY>>:" \
  -d amount=1099 \
  -d currency=dkk \
  -d "payment_method_types[]=mobilepay" \
  -d "payment_method_data[type]=mobilepay" \
  --data-urlencode "return_url=payments-example://stripe-redirect"
```

Der PaymentIntent enthält 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)). Senden Sie das Client-Geheimnis an den Client, um im nächsten Schritt den PaymentIntent zu *bestätigen* (Confirming an intent indicates that the customer intends to use the current or provided payment method. Upon confirmation, the intent attempts to initiate the portions of the flow that have real-world side effects).

### Clientseitig

Fordern Sie auf dem Client einen PaymentIntent von Ihrem Server an und speichern Sie das zugehörige Client-Geheimnis.

#### 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
    }
}
```

## Zahlung an Stripe senden [Clientseitig]

Wenn Kundinnen/Kunden die Schaltfläche zum Bezahlen mit MobilePay antippen, bestätigen Sie den `PaymentIntent`, um die Zahlung abzuschließen. Konfigurieren Sie ein `STPPaymentIntentParams`-Objekt mit dem [Client-Geheimnis](https://docs.stripe.com/api/payment_intents/object.md#payment_intent_object-client_secret) des `PaymentIntent`.

Das Client-Geheimnis unterscheidet sich von Ihren API-Schlüsseln, die die Stripe&nbsp;API-Anfragen authentifizieren. Achten Sie auf einen vorsichtigen Umgang mit dem Client-Geheimnis, da mit ihm die Zahlungen abgeschlossen werden können. Es darf nicht protokolliert, in URLs eingebettet oder anderen Personen zugänglich gemacht werden.

### Rückgabe-URL einrichten

Der Kunde/Die Kundin verlässt ggf. Ihre App, um sich zu authentifizieren (z.&nbsp;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<UIOpenURLContext>) {
    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
          }
        }
    }
  }
}
```

### Zahlung bestätigen

Verwenden Sie das PaymentIntent-Client-Geheimnis aus [Schritt 2](https://docs.stripe.com/payments/mobilepay/accept-a-payment.md#create-payment-intent), um den PaymentIntent mit [STPPaymentHandler.shared.confirmPayment()](https://stripe.dev/stripe-ios/stripepayments/documentation/stripepayments/stppaymenthandler/confirmpayment\(_:with:completion:\)) zu bestätigen. Dadurch wird die MobilePay-Anwendung direkt geöffnet (falls vorhanden) oder eine Webansicht mit der MobilePay-Landingpage. Nachdem die Kundin/der Kunde die Zahlung autorisiert hat, enthält der Abschlussblock den Status der Zahlung.

#### Swift

```swift
let paymentIntentParams = STPPaymentIntentParams(clientSecret: paymentIntentClientSecret)
paymentIntentParams.paymentMethodParams = STPPaymentMethodParams(
  mobilePay: STPPaymentMethodMobilePayParams(),
  billingDetails: nil,
  metadata: nil
)
paymentIntentParams.returnURL = "your-app://stripe-redirect" // Set returnURL to your app's return URL that you set up in the previous step

STPPaymentHandler.shared().confirmPayment(paymentIntentParams, with: self) { (handlerStatus, paymentIntent, error) in
    switch handlerStatus {
    case .succeeded:
        // Payment succeeded
        // ...

    case .canceled:
        // Payment canceled
        // ...

    case .failed:
        // Payment failed
        // ...

    @unknown default:
        fatalError()
    }
}
```

Ihr Kunde/Ihre Kundin hat 5&nbsp;Minuten Zeit, die Zahlung in der App zu autorisieren. Wenn die zugrunde liegende Kartenzahlung fehlschlägt, kann kundenseitig eine andere Karte ausgewählt und es in der MobilePay-App erneut versucht werden.

## Ereignisse nach der Zahlung verarbeiten

Stripe übermittelt 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 im Dashboard einen *Webhook* (A webhook is a real-time push notification sent to your application as a JSON payload through HTTPS requests) oder eine Partnerlösung, um diese Ereignisse zu empfangen und Aktionen auszuführen (Versenden einer Bestellbestätigung per E-Mail an die Kund/innen, Erfassen des Verkaufs in einer Datenbank oder Einleiten des Versandablaufs).

Überwachen Sie diese Ereignisse, statt auf einen Callback vom Client zu warten. Auf dem Client könnte der Kunde/die Kundin das Browserfenster schließen oder die App beenden, bevor der Callback erfolgt ist und böswillige Clients könnten die Antwort manipulieren. Wenn Sie Ihre Integration so einrichten, dass asynchrone Ereignisse überwacht werden, hilft Ihnen dies auch dabei, in Zukunft mehr Zahlungsmethoden zu akzeptieren. Hier erhalten Sie Informationen zu den [Unterschieden zwischen allen unterstützten Zahlungsmethoden](https://stripe.com/payments/payment-methods-guide).

- **Manuelles Bearbeiten von Ereignissen im Dashboard**

  Verwenden Sie das Dashboard, um [Ihre Testzahlungen im Dashboard anzuzeigen](https://dashboard.stripe.com/test/payments), E-Mail-Belege zu senden, Auszahlungen zu bearbeiten oder fehlgeschlagene Zahlungen erneut zu versuchen.

- **Erstellen eines benutzerdefinierten Webhooks**

  [Build a custom webhook](https://docs.stripe.com/webhooks/handling-payment-events.md#build-your-own-webhook) handler to listen for events and build custom asynchronous payment flows. Test and debug your webhook integration locally with the Stripe CLI.

- **Integrieren einer vorgefertigten App**

  Bearbeiten Sie häufige Unternehmensereignisse, wie z.&nbsp;B.[Automatisierung](https://stripe.partners/?f_category=automation) oder[Marketing und Vertrieb](https://stripe.partners/?f_category=marketing-and-sales), indem Sie eine Partneranwendung integrieren.

## Integration testen

Erstellen Sie mit Ihren [Test-API-Schlüsseln](https://docs.stripe.com/keys.md#test-live-modes) einen PaymentIntent. Nachdem Sie den PaymentIntent bestätigt haben, folgen Sie der `next_action`-Weiterleitungs-URL zu einer Testseite mit Optionen zur Autorisierung oder Ablehnung der Zahlung.

- Klicken Sie auf **Authorize test payment**, um das Szenario zu testen, bei dem die Zahlung erfolgreich ist. Der [Status](https://docs.stripe.com/api/payment_intents/object.md#payment_intent_object-status) des PaymentIntent wechselt von `requires_action` zu `succeeded`
- Klicken Sie auf **Fail test payment** (Testzahlung ablehnen), um das Szenario zu testen, bei dem der/die Kund/in nicht authentifiziert werden kann. Der [Status](https://docs.stripe.com/api/payment_intents/object.md#payment_intent_object-status) des PaymentIntent wechselt von `requires_action` zu `requires_payment_method`.

## Optional: Stornierung

Sie können MobilePay-Zahlungen stornieren, bevor sie ablaufen, indem Sie [den mit der MobilePay-Zahlung verknüpften PaymentIntent stornieren](https://docs.stripe.com/api/payment_intents/cancel.md).

## Fehlgeschlagene Zahlungen

MobilePay-Transaktionen können fehlschlagen, wenn die zugrunde liegende Kartentransaktion abgelehnt wird. Weitere Infos zu [Kartenablehnungen](https://docs.stripe.com/declines/card.md). In diesem Fall wird die PaymentMethod getrennt und der Status des PaymentIntent wechselt automatisch zu `requires_payment_method`.

Wenn der Status des PaymentIntent `requires_action` ist, muss Ihr Kunde/Ihre Kundin die Zahlung innerhalb von 5&nbsp;Minuten authentifizieren. Wenn nach 5 Minuten keine Aktion erfolgt ist, wird die PaymentMethod getrennt und der Status des PaymentIntent wechselt automatisch zu `requires_payment_method`.

## Rückerstattungen und angefochtene Zahlungen

Stripe führt eine Kartentransaktion mit Standard-Card-Rails im Rahmen einer Vipps-Transaktion durch. [Rückerstattungen](https://docs.stripe.com/refunds.md) und [Zahlungsanfechtungen](https://docs.stripe.com/disputes/how-disputes-work.md) unterliegen den Netzwerkregeln von Visa und Mastercard.


# Android

> This is a Android for when payment-ui is mobile and platform is android. View the full page at https://docs.stripe.com/payments/mobilepay/accept-a-payment?payment-ui=mobile&platform=android.

MobilePay ist eine [einmalige](https://docs.stripe.com/payments/payment-methods.md#usage) Karten-Wallet-Zahlungsmethode, die in Dänemark und Finnland verwendet wird. Sie ermöglicht Ihren Kundinnen und Kunden, Zahlungen mit der Vipps-App [zu authentifizieren und zu genehmigen](https://docs.stripe.com/payments/payment-methods.md#customer-actions).

Wenn Ihre Kundin oder Ihr Kunde mit MobilePay bezahlt, führt Stripe eine Kartentransaktion mit den von MobilePay empfangenen Kartendaten durch. Die Verarbeitung der Kartentransaktion ist für Ihre Integration unsichtbar und Stripe [benachrichtigt Sie sofort](https://docs.stripe.com/payments/payment-methods.md#payment-notification) darüber, ob die Zahlung erfolgreich war oder fehlgeschlagen ist.

Stripe empfiehlt, das [Mobile Payment Element](https://docs.stripe.com/payments/accept-a-payment.md?payment-ui=mobile&platform=android), ein einbettbares Zahlungsformular, zu verwenden, um MobilePay und andere Zahlungsmethoden mit minimalem Aufwand zu Ihrer Integration hinzuzufügen.

In diesem Leitfaden erfahren Sie, wie Sie MobilePay über Ihre native Mobilanwendung akzeptieren, wenn Sie Ihr eigenes benutzerdefiniertes Zahlungsformular verwenden möchten. Ihre native mobile App leitet Ihre Kundinnen und Kunden zur mobilen App von MobilePay weiter, um die Zahlung abzuschließen. Zum Abschließen des Kaufs sind keine zusätzlichen Aktionen in der mobilen App von MobilePay erforderlich.

## 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 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.7.0")
  // Include the financial connections SDK to support US bank account as a payment method
  implementation("com.stripe:financial-connections:23.7.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,
            "<<YOUR_PUBLISHABLE_KEY>>"
        )
    }
}
```

> 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.

Stripe-Beispiele nutzen auch [OkHttp](https://github.com/square/okhttp) und [GSON](https://github.com/google/gson), um HTTP-Anfragen an einen Server zu stellen.

## PaymentIntent erstellen [Serverseitig] [Clientseitig]

### Serverseitig

Ein [PaymentIntent](https://docs.stripe.com/api/payment_intents/object.md) ist ein Objekt, das Ihre Absicht, eine Kundenzahlung einzuziehen, darstellt und den gesamten Zahlungsvorgang dokumentiert.

So erstellen und bestätigen Sie einen `PaymentIntent` auf Ihrem Server:

- Geben Sie den einzuziehenden Betrag und eine unterstützte Währung an (`eur`, `dkk`, `sek`, or `nok`).
- Fügen Sie `mobilepay` zur Liste der [Zahlungsmethodentypen](https://docs.stripe.com/api/payment_intents/create.md#create_payment_intent-payment_method_types) hinzu. Vergewissern Sie sich, dass Sie MobilePay im [Dashboard](https://dashboard.stripe.com/settings/payment_methods) aktiviert haben.
- Setzen Sie `payment_method_data[type]` auf `mobilepay`, um eine *PaymentMethod* (PaymentMethods represent your customer's payment instruments, used with the Payment Intents or Setup Intents APIs) zu erstellen und diese sofort mit diesem PaymentIntent zu verwenden.

```curl
curl https://api.stripe.com/v1/payment_intents \
  -u "<<YOUR_SECRET_KEY>>:" \
  -d amount=1099 \
  -d currency=dkk \
  -d "payment_method_types[]=mobilepay" \
  -d "payment_method_data[type]=mobilepay"
```

Der PaymentIntent enthält 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)). Senden Sie das Client-Geheimnis an den Client, um im nächsten Schritt den PaymentIntent zu *bestätigen* (Confirming an intent indicates that the customer intends to use the current or provided payment method. Upon confirmation, the intent attempts to initiate the portions of the flow that have real-world side effects).

### Clientseitig

Fordern Sie auf dem Client einen PaymentIntent von Ihrem Server an und speichern Sie das zugehörige Client-Geheimnis.

#### Kotlin

```kotlin
class CheckoutActivity : AppCompatActivity() {

  private lateinit var paymentIntentClientSecret: String

  override fun onCreate(savedInstanceState: Bundle?) {
      super.onCreate(savedInstanceState)
      // ...
      startCheckout()
  }

  private fun startCheckout() {
      // Request a PaymentIntent from your server and store its client secret in paymentIntentClientSecret
      // Click View full sample to see a complete implementation
  }
}
```

## Zahlung an Stripe senden [Clientseitig]

Wenn Kundinnen/Kunden die Schaltfläche zum Bezahlen mit MobilePay antippen, bestätigen Sie den `PaymentIntent`, um die Zahlung abzuschließen. Konfigurieren Sie ein `ConfirmPaymentIntentParams`-Objekt mit dem [Client/Geheimnis](https://docs.stripe.com/api/payment_intents/object.md#payment_intent_object-client_secret) des `PaymentIntent`.

Das Client-Geheimnis unterscheidet sich von Ihren API-Schlüsseln, die die Stripe&nbsp;API-Anfragen authentifizieren. Achten Sie auf einen vorsichtigen Umgang mit dem Client-Geheimnis, da mit ihm die Zahlungen abgeschlossen werden können. Es darf nicht protokolliert, in URLs eingebettet oder anderen Personen zugänglich gemacht werden.

### Zahlung bestätigen

Verwenden Sie das Client-Geheimnis des PaymentIntent aus [Schritt 2](https://docs.stripe.com/payments/mobilepay/accept-a-payment.md#create-payment-intent), um den PaymentIntent mit [PaymentLauncher confirm](https://stripe.dev/stripe-android/payments-core/com.stripe.android.payments.paymentlauncher/-payment-launcher/index.html#74063765%2FFunctions%2F-1622557690) zu bestätigen. Dadurch wird die MobilePay-Anwendung direkt geöffnet (falls vorhanden) oder eine Webansicht mit der MobilePay-Landingpage. Nachdem die Kundin/der Kunde die Zahlung autorisiert hat, enthält `onPaymentResult` den Status der Zahlung.

#### Kotlin

```kotlin
class CheckoutActivity : AppCompatActivity() {
    // ...
    private lateinit var paymentIntentClientSecret: String
    private val paymentLauncher: PaymentLauncher by lazy {
        PaymentLauncher.create(
            this,
            PaymentConfiguration.getInstance(applicationContext).publishableKey,
            PaymentConfiguration.getInstance(applicationContext).stripeAccountId,
            ::onPaymentResult
        )
    }

    private fun startCheckout() {
        // ...

        val confirmParams = ConfirmPaymentIntentParams
            .createWithPaymentMethodCreateParams(
                paymentMethodCreateParams = PaymentMethodCreateParams.createMobilePay(),
                clientSecret = paymentIntentClientSecret
            )
        paymentLauncher.confirm(confirmParams)
    }

    private fun onPaymentResult(paymentResult: PaymentResult) {
        val message = when (paymentResult) {
            is PaymentResult.Completed -> {
                "Completed!"
            }
            is PaymentResult.Canceled -> {
                "Canceled!"
            }
            is PaymentResult.Failed -> {
                // This string comes from the PaymentIntent's error message.
                // See: https://docs.stripe.com/api/payment_intents/object#payment_intent_object-last_payment_error-message
                "Failed: " + paymentResult.throwable.message
            }
        }
    }
}
```

Ihr Kunde/Ihre Kundin hat 5&nbsp;Minuten Zeit, die Zahlung in der App zu autorisieren. Wenn die zugrunde liegende Kartenzahlung fehlschlägt, kann kundenseitig eine andere Karte ausgewählt und es in der MobilePay-App erneut versucht werden.

## Ereignisse nach der Zahlung verarbeiten

Stripe übermittelt 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 im Dashboard einen *Webhook* (A webhook is a real-time push notification sent to your application as a JSON payload through HTTPS requests) oder eine Partnerlösung, um diese Ereignisse zu empfangen und Aktionen auszuführen (Versenden einer Bestellbestätigung per E-Mail an die Kund/innen, Erfassen des Verkaufs in einer Datenbank oder Einleiten des Versandablaufs).

Überwachen Sie diese Ereignisse, statt auf einen Callback vom Client zu warten. Auf dem Client könnte der Kunde/die Kundin das Browserfenster schließen oder die App beenden, bevor der Callback erfolgt ist und böswillige Clients könnten die Antwort manipulieren. Wenn Sie Ihre Integration so einrichten, dass asynchrone Ereignisse überwacht werden, hilft Ihnen dies auch dabei, in Zukunft mehr Zahlungsmethoden zu akzeptieren. Hier erhalten Sie Informationen zu den [Unterschieden zwischen allen unterstützten Zahlungsmethoden](https://stripe.com/payments/payment-methods-guide).

- **Manuelles Bearbeiten von Ereignissen im Dashboard**

  Verwenden Sie das Dashboard, um [Ihre Testzahlungen im Dashboard anzuzeigen](https://dashboard.stripe.com/test/payments), E-Mail-Belege zu senden, Auszahlungen zu bearbeiten oder fehlgeschlagene Zahlungen erneut zu versuchen.

- **Erstellen eines benutzerdefinierten Webhooks**

  [Build a custom webhook](https://docs.stripe.com/webhooks/handling-payment-events.md#build-your-own-webhook) handler to listen for events and build custom asynchronous payment flows. Test and debug your webhook integration locally with the Stripe CLI.

- **Integrieren einer vorgefertigten App**

  Bearbeiten Sie häufige Unternehmensereignisse, wie z.&nbsp;B.[Automatisierung](https://stripe.partners/?f_category=automation) oder[Marketing und Vertrieb](https://stripe.partners/?f_category=marketing-and-sales), indem Sie eine Partneranwendung integrieren.

## Integration testen

Erstellen Sie mit Ihren [Test-API-Schlüsseln](https://docs.stripe.com/keys.md#test-live-modes) einen PaymentIntent. Nachdem Sie den PaymentIntent bestätigt haben, folgen Sie der `next_action`-Weiterleitungs-URL zu einer Testseite mit Optionen zur Autorisierung oder Ablehnung der Zahlung.

- Klicken Sie auf **Authorize test payment**, um das Szenario zu testen, bei dem die Zahlung erfolgreich ist. Der [Status](https://docs.stripe.com/api/payment_intents/object.md#payment_intent_object-status) des PaymentIntent wechselt von `requires_action` zu `succeeded`
- Klicken Sie auf **Fail test payment** (Testzahlung ablehnen), um das Szenario zu testen, bei dem der/die Kund/in nicht authentifiziert werden kann. Der [Status](https://docs.stripe.com/api/payment_intents/object.md#payment_intent_object-status) des PaymentIntent wechselt von `requires_action` zu `requires_payment_method`.

## Optional: Stornierung

Sie können MobilePay-Zahlungen stornieren, bevor sie ablaufen, indem Sie [den mit der MobilePay-Zahlung verknüpften PaymentIntent stornieren](https://docs.stripe.com/api/payment_intents/cancel.md).

## Fehlgeschlagene Zahlungen

MobilePay-Transaktionen können fehlschlagen, wenn die zugrunde liegende Kartentransaktion abgelehnt wird. Weitere Infos zu [Kartenablehnungen](https://docs.stripe.com/declines/card.md). In diesem Fall wird die PaymentMethod getrennt und der Status des PaymentIntent wechselt automatisch zu `requires_payment_method`.

Wenn der Status des PaymentIntent `requires_action` ist, muss Ihr Kunde/Ihre Kundin die Zahlung innerhalb von 5&nbsp;Minuten authentifizieren. Wenn nach 5 Minuten keine Aktion erfolgt ist, wird die PaymentMethod getrennt und der Status des PaymentIntent wechselt automatisch zu `requires_payment_method`.

## Rückerstattungen und angefochtene Zahlungen

Stripe führt eine Kartentransaktion mit Standard-Card-Rails im Rahmen einer Vipps-Transaktion durch. [Rückerstattungen](https://docs.stripe.com/refunds.md) und [Zahlungsanfechtungen](https://docs.stripe.com/disputes/how-disputes-work.md) unterliegen den Netzwerkregeln von Visa und Mastercard.


# React Native

> This is a React Native for when payment-ui is mobile and platform is react-native. View the full page at https://docs.stripe.com/payments/mobilepay/accept-a-payment?payment-ui=mobile&platform=react-native.

MobilePay ist eine [einmalige](https://docs.stripe.com/payments/payment-methods.md#usage) Karten-Wallet-Zahlungsmethode, die in Dänemark und Finnland verwendet wird. Sie ermöglicht Ihren Kundinnen und Kunden, Zahlungen mit der Vipps-App [zu authentifizieren und zu genehmigen](https://docs.stripe.com/payments/payment-methods.md#customer-actions).

Wenn Ihre Kundin oder Ihr Kunde mit MobilePay bezahlt, führt Stripe eine Kartentransaktion mit den von MobilePay empfangenen Kartendaten durch. Die Verarbeitung der Kartentransaktion ist für Ihre Integration unsichtbar und Stripe [benachrichtigt Sie sofort](https://docs.stripe.com/payments/payment-methods.md#payment-notification) darüber, ob die Zahlung erfolgreich war oder fehlgeschlagen ist.

Stripe empfiehlt, das [Mobile Payment Element](https://docs.stripe.com/payments/accept-a-payment.md?payment-ui=mobile&platform=react-native), ein einbettbares Zahlungsformular, zu verwenden, um MobilePay und andere Zahlungsmethoden mit minimalem Aufwand zu Ihrer Integration hinzuzufügen.

Dieser Leitfaden erklärt, wie Sie MobilePay in Ihrer nativen mobilen Anwendung über ein eigenes benutzerdefiniertes Zahlungsformular akzeptieren. Ihre native mobile Anwendung leitet die Kundin/den Kunden zu einer Webansicht weiter, um die Zahlung über MobilePay abzuschließen.

## Stripe einrichten [Serverseitig] [Clientseitig]

Zunächst benötigen Sie ein Stripe-Konto. [Registrieren Sie sich jetzt](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 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 [React Native SDK](https://github.com/stripe/stripe-react-native) ist Open Source und vollständig dokumentiert. Intern werden [native iOS](https://github.com/stripe/stripe-ios) und [Android](https://github.com/stripe/stripe-android) SDKs verwendet. Um das React Native SDK von Stripe zu installieren, führen Sie einen der folgenden Befehle im Verzeichnis Ihres Projekts aus (je nachdem, welchen Paket-Manager Sie verwenden):

#### yarn

```bash
yarn add @stripe/stripe-react-native
```

#### npm

```bash
npm install @stripe/stripe-react-native
```

Installieren Sie als Nächstes einige weitere erforderliche Abhängigkeiten:

- Für iOS wechseln Sie in das Verzeichnis **ios** und führen Sie `pod install` aus, um sicherzustellen, dass Sie auch die erforderlichen nativen Dependencies installiert haben.
- Für Android müssen keine Abhängigkeiten mehr installiert werden.

> Wir empfehlen Ihnen, die [offizielle Anleitung zu TypeScript](https://reactnative.dev/docs/typescript#adding-typescript-to-an-existing-project) zu befolgen, um TypeScript zu unterstützen.

### Stripe Initialisierung

Um Stripe in Ihrer React Native-App zu initialisieren, umschließen Sie entweder Ihren Zahlungsbildschirm mit der Komponente `StripeProvider` oder verwenden Sie die Initialisierungsmethode `initStripe`. Nur der [veröffentlichbare API-Schlüssel](https://docs.stripe.com/keys.md#obtain-api-keys) in `publishableKey` ist erforderlich. Das folgende Beispiel zeigt, wie Stripe mithilfe der Komponente `StripeProvider` initialisiert wird.

```jsx
import { useState, useEffect } from 'react';
import { StripeProvider } from '@stripe/stripe-react-native';

function App() {
  const [publishableKey, setPublishableKey] = useState('');

  const fetchPublishableKey = async () => {
    const key = await fetchKey(); // fetch key from your server here
    setPublishableKey(key);
  };

  useEffect(() => {
    fetchPublishableKey();
  }, []);

  return (
    <StripeProvider
      publishableKey={publishableKey}
      merchantIdentifier="merchant.identifier" // required for Apple Pay
      urlScheme="your-url-scheme" // required for 3D Secure and bank redirects
    >
      {/* Your app code here */}
    </StripeProvider>
  );
}
```

> Verwenden Sie Ihre API-[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.

## PaymentIntent erstellen [Serverseitig] [Clientseitig]

### Serverseitig

Ein [PaymentIntent](https://docs.stripe.com/api/payment_intents/object.md) ist ein Objekt, das Ihre Absicht, eine Kundenzahlung einzuziehen, darstellt und den gesamten Zahlungsvorgang dokumentiert.

So erstellen und bestätigen Sie einen `PaymentIntent` auf Ihrem Server:

- Geben Sie den einzuziehenden Betrag und eine unterstützte Währung an (`eur`, `dkk`, `sek`, or `nok`).
- Fügen Sie `mobilepay` zur Liste der [Zahlungsmethodentypen](https://docs.stripe.com/api/payment_intents/create.md#create_payment_intent-payment_method_types) hinzu. Vergewissern Sie sich, dass Sie MobilePay im [Dashboard](https://dashboard.stripe.com/settings/payment_methods) aktiviert haben.

```curl
curl https://api.stripe.com/v1/payment_intents \
  -u "<<YOUR_SECRET_KEY>>:" \
  -d amount=1099 \
  -d currency=dkk \
  -d "payment_method_types[]=mobilepay" \
  --data-urlencode "return_url=payments-example://stripe-redirect"
```

Der PaymentIntent enthält 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)). Senden Sie das Client-Geheimnis an den Client, um im nächsten Schritt den PaymentIntent zu *bestätigen* (Confirming an intent indicates that the customer intends to use the current or provided payment method. Upon confirmation, the intent attempts to initiate the portions of the flow that have real-world side effects).

### Clientseitig

Fordern Sie auf dem Client einen PaymentIntent von Ihrem Server an und speichern Sie sein Client-Geheimnis:

```javascript
function PaymentScreen() {
  const fetchPaymentIntentClientSecret = async () => {
    const response = await fetch(`${API_URL}/create-payment-intent`, {
      method: 'POST',
      headers: {
        'Content-Type': 'application/json',
      },
      body: JSON.stringify({
        currency: 'dkk',
      }),
    });
    const {clientSecret} = await response.json();

    return clientSecret;
  };

  const handlePayPress = async () => {
    // See below
  };

  return (
    <View>
      <Button onPress={handlePayPress} title="Pay" />
    </View>
  );
}
```

Das Client-Geheimnis unterscheidet sich von Ihren API-Schlüsseln, die die Stripe&nbsp;API-Anfragen authentifizieren. Achten Sie auf einen vorsichtigen Umgang mit dem Client-Geheimnis, da mit ihm die Zahlungen abgeschlossen werden können. Es darf nicht protokolliert, in URLs eingebettet oder anderen Personen zugänglich gemacht werden.

## Rückgabe-URL einrichten (nur für iOS) [Clientseitig]

Wenn Kundinnen/Kunden Ihre App verlassen (zum Beispiel um sich in Safari oder ihrer Banking-App zu authentifizieren), bieten Sie ihnen eine Möglichkeit, automatisch zu Ihrer App zurückzukehren. Für viele Arten von Zahlungsmethoden *ist* eine Rückgabe-URL erforderlich. Wenn Sie keine angeben, können wir Ihren Nutzer/innen keine Zahlungsmethoden anbieten, für die eine Rückgabe-URL erforderlich ist, selbst wenn Sie diese aktiviert haben.

So geben Sie eine Rückgabe-URL an:

1. [Registrieren](https://developer.apple.com/documentation/xcode/defining-a-custom-url-scheme-for-your-app#Register-your-URL-scheme) Sie eine benutzerdefinierte URL. Universelle Links werden nicht unterstützt.
1. [Konfigurieren](https://reactnative.dev/docs/linking) Sie Ihre benutzerdefinierte URL.
1. Richten Sie Ihre Root-Komponente so ein, dass sie die URL an das Stripe SDK weitergibt, wie unten gezeigt.

> Wenn Sie Expo verwenden, [stellen Sie Ihr Schema](https://docs.expo.io/guides/linking/#in-a-standalone-app) in der Datei `app.json` ein.

```jsx
import { useEffect, useCallback } from 'react';
import { Linking } from 'react-native';
import { useStripe } from '@stripe/stripe-react-native';

export default function MyApp() {
  const { handleURLCallback } = useStripe();

  const handleDeepLink = useCallback(
    async (url: string | null) => {
      if (url) {
        const stripeHandled = await handleURLCallback(url);
        if (stripeHandled) {
          // This was a Stripe URL - you can return or add extra handling here as you see fit
        } else {
          // This was NOT a Stripe URL – handle as you normally would
        }
      }
    },
    [handleURLCallback]
  );

  useEffect(() => {
    const getUrlAsync = async () => {
      const initialUrl = await Linking.getInitialURL();
      handleDeepLink(initialUrl);
    };

    getUrlAsync();

    const deepLinkListener = Linking.addEventListener(
      'url',
      (event: { url: string }) => {
        handleDeepLink(event.url);
      }
    );

    return () => deepLinkListener.remove();
  }, [handleDeepLink]);

  return (
    <View>
      <AwesomeAppComponent />
    </View>
  );
}
```

Weitere Informationen zu nativen URL-Schemen finden Sie in der Dokumentation für [Android](https://developer.android.com/training/app-links/deep-linking) und [iOS](https://developer.apple.com/documentation/xcode/allowing_apps_and_websites_to_link_to_your_content/defining_a_custom_url_scheme_for_your_app).

## MobilePay-Zahlung bestätigen [Clientseitig]

Wenn der Kunde/die Kundin die Zahlung mit MobilePay auswählt, führen Sie die Zahlung durch Aufrufen von [confirmPayment](https://stripe.dev/stripe-react-native/api-reference/index.html#confirmPayment) durch. Dies entspricht einer Webansicht, in der die Kundinnen/Kunden die Zahlung in der MobilePay-Anwendung autorisieren können. Nachdem der Kunde/die Kundin die Zahlung autorisiert hat, wird das Promise entweder mit einem Objekt mit `paymentIntent`-Feld aufgelöst oder mit einem `error`-Feld, wenn bei der Zahlung ein Fehler aufgetreten ist.

```javascript
import {useConfirmPayment} from '@stripe/stripe-react-native';

function PaymentScreen() {
  const {confirmPayment, loading} = useConfirmPayment();

  const fetchPaymentIntentClientSecret = async () => {
    // See above
  };

  const handlePayPress = async () => {
    // Fetch the client secret from the backend.
    const clientSecret = await fetchPaymentIntentClientSecret();

    const {error, paymentIntent} = await confirmPayment(clientSecret, {
      paymentMethodType: 'MobilePay',
    });

    if (error) {
      console.log('Payment confirmation error: ', error);
    } else if (paymentIntent) {
      console.log('Successfully confirmed payment: ', paymentIntent);
    }
  };

  return (
    <View>
      <Button onPress={handlePayPress} title="Pay" disabled={loading} />
    </View>
  );
}
```

Ihr Kunde/Ihre Kundin hat 5&nbsp;Minuten Zeit, die Zahlung in der App zu autorisieren. Wenn die zugrunde liegende Kartenzahlung fehlschlägt, kann kundenseitig eine andere Karte ausgewählt und es in der MobilePay-App erneut versucht werden.

## Ereignisse nach der Zahlung verarbeiten

Stripe übermittelt 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 im Dashboard einen *Webhook* (A webhook is a real-time push notification sent to your application as a JSON payload through HTTPS requests) oder eine Partnerlösung, um diese Ereignisse zu empfangen und Aktionen auszuführen (Versenden einer Bestellbestätigung per E-Mail an die Kund/innen, Erfassen des Verkaufs in einer Datenbank oder Einleiten des Versandablaufs).

Überwachen Sie diese Ereignisse, statt auf einen Callback vom Client zu warten. Auf dem Client könnte der Kunde/die Kundin das Browserfenster schließen oder die App beenden, bevor der Callback erfolgt ist und böswillige Clients könnten die Antwort manipulieren. Wenn Sie Ihre Integration so einrichten, dass asynchrone Ereignisse überwacht werden, hilft Ihnen dies auch dabei, in Zukunft mehr Zahlungsmethoden zu akzeptieren. Hier erhalten Sie Informationen zu den [Unterschieden zwischen allen unterstützten Zahlungsmethoden](https://stripe.com/payments/payment-methods-guide).

- **Manuelles Bearbeiten von Ereignissen im Dashboard**

  Verwenden Sie das Dashboard, um [Ihre Testzahlungen im Dashboard anzuzeigen](https://dashboard.stripe.com/test/payments), E-Mail-Belege zu senden, Auszahlungen zu bearbeiten oder fehlgeschlagene Zahlungen erneut zu versuchen.

- **Erstellen eines benutzerdefinierten Webhooks**

  [Build a custom webhook](https://docs.stripe.com/webhooks/handling-payment-events.md#build-your-own-webhook) handler to listen for events and build custom asynchronous payment flows. Test and debug your webhook integration locally with the Stripe CLI.

- **Integrieren einer vorgefertigten App**

  Bearbeiten Sie häufige Unternehmensereignisse, wie z.&nbsp;B.[Automatisierung](https://stripe.partners/?f_category=automation) oder[Marketing und Vertrieb](https://stripe.partners/?f_category=marketing-and-sales), indem Sie eine Partneranwendung integrieren.

## Integration testen

Erstellen Sie mit Ihren [Test-API-Schlüsseln](https://docs.stripe.com/keys.md#test-live-modes) einen PaymentIntent. Nachdem Sie den PaymentIntent bestätigt haben, folgen Sie der `next_action`-Weiterleitungs-URL zu einer Testseite mit Optionen zur Autorisierung oder Ablehnung der Zahlung.

- Klicken Sie auf **Authorize test payment**, um das Szenario zu testen, bei dem die Zahlung erfolgreich ist. Der [Status](https://docs.stripe.com/api/payment_intents/object.md#payment_intent_object-status) des PaymentIntent wechselt von `requires_action` zu `succeeded`
- Klicken Sie auf **Fail test payment** (Testzahlung ablehnen), um das Szenario zu testen, bei dem der/die Kund/in nicht authentifiziert werden kann. Der [Status](https://docs.stripe.com/api/payment_intents/object.md#payment_intent_object-status) des PaymentIntent wechselt von `requires_action` zu `requires_payment_method`.

## Optional: Stornierung

Sie können MobilePay-Zahlungen stornieren, bevor sie ablaufen, indem Sie [den mit der MobilePay-Zahlung verknüpften PaymentIntent stornieren](https://docs.stripe.com/api/payment_intents/cancel.md).

## Fehlgeschlagene Zahlungen

MobilePay-Transaktionen können fehlschlagen, wenn die zugrunde liegende Kartentransaktion abgelehnt wird. Weitere Infos zu [Kartenablehnungen](https://docs.stripe.com/declines/card.md). In diesem Fall wird die PaymentMethod getrennt und der Status des PaymentIntent wechselt automatisch zu `requires_payment_method`.

Wenn der Status des PaymentIntent `requires_action` ist, muss Ihr Kunde/Ihre Kundin die Zahlung innerhalb von 5&nbsp;Minuten authentifizieren. Wenn nach 5 Minuten keine Aktion erfolgt ist, wird die PaymentMethod getrennt und der Status des PaymentIntent wechselt automatisch zu `requires_payment_method`.

## Rückerstattungen und angefochtene Zahlungen

Stripe führt eine Kartentransaktion mit Standard-Card-Rails im Rahmen einer Vipps-Transaktion durch. [Rückerstattungen](https://docs.stripe.com/refunds.md) und [Zahlungsanfechtungen](https://docs.stripe.com/disputes/how-disputes-work.md) unterliegen den Netzwerkregeln von Visa und Mastercard.