Bankdaten aus einer iDEAL-Zahlung speichern

Serverseitig

Diese Integration erfordert Endpoints auf Ihrem Server, die mit der Stripe-API kommunizieren können. Nutzen Sie unsere offiziellen Bibliotheken für den Zugriff auf die Stripe-API von Ihrem Server aus:

# Available as a gem
sudo gem install stripe

# If you use bundler, you can add this line to your Gemfile
gem 'stripe'

Clientseitig

Das React Native SDK ist Open Source und vollständig dokumentiert. Intern werden native iOS und 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 add @stripe/stripe-react-native

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

• Navigieren Sie für iOS zum Verzeichnis ios und führen Sie pod install aus, um sicherzustellen, dass Sie auch die erforderlichen nativen Abhängigkeiten installieren.
• Für Android müssen keine Abhängigkeiten mehr installiert werden.

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 in publishableKey ist erforderlich. Das folgende Beispiel zeigt, wie Stripe mithilfe der Komponente StripeProvider initialisiert wird.

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>
  );
}

Erstellen Sie Kund/innen, wenn diese ein Konto bei Ihrem Unternehmen anlegen, und verknüpfen Sie sie mit Ihrer internen Darstellung ihres Kontos. So können Sie zu einem späteren Zeitpunkt die gespeicherten Details zur Zahlungsmethode abrufen und verwenden.

curl -X POST https://api.stripe.com/v1/customers \
  -u "
sk_test_BQokikJOvBiI2HlWgH4olfQ2
:"

Erstellen Sie einen PaymentIntent auf Ihrem Server und geben Sie den einzuziehenden amount, die Währung eur, die Kunden-ID und off_session als Argument für die Einrichtung der zukünftigen Verwendung an. Es gibt keinen Mindestzahlungsbetrag, und iDEAL unterstützt keine anderen Währungen. Wenn Sie über eine bestehende Payment Intents API-Integration verfügen, fügen Sie ideal der Liste der Arten der Zahlungsmethoden hinzu.

curl https://api.stripe.com/v1/payment_intents \
  -u "
sk_test_BQokikJOvBiI2HlWgH4olfQ2
:" \
  -d amount=1099 \
  -d currency=eur \
  -d "payment_method_types[]"=ideal \
  -d customer={{CUSTOMER_ID}} \
  -d setup_future_usage=off_session

Der PaymentIntent enthält die ID der Zahlungsmethode und ein Client-Geheimnis, das auf der Client-Seite verwendet wird, um den Zahlungsvorgang sicher abzuschließen, statt das gesamte PaymentIntent-Objekt zu übergeben.

Erfassen Sie in Ihrer App den vollständigen Namen und die E-Mail-Adresse Ihrer Kundinnen und Kunden.

export default function IdealPaymentScreen() {
  const [name, setName] = useState();
  const [email, setEmai] = useState();

  const handlePayPress = async () => {
    // ...
  };

  return (
    <Screen>
      <TextInput
        placeholder="Email"
        onChange={(value) => setEmail(value.nativeEvent.text)}
      />
      <TextInput
        placeholder="Name"
        onChange={(value) => setName(value.nativeEvent.text)}
      />
    </Screen>
  );
}

Wenn Sie Zahlungen per SEPA-Lastschrift abwickeln möchten, müssen Ihre Kund/innen dem Lastschriftmandat zustimmen. Zeigen Sie den folgenden Standard-Autorisierungstext an, damit Ihre Kund/innen das Mandat implizit akzeptieren.

Ersetzen Sie Rocket Rides durch den Namen Ihres Unternehmens.

Beim Einrichten einer Zahlungsmethode oder Bestätigen einer PaymentIntent wird das akzeptierte Mandat erstellt. Da die Kund/innen das Mandat implizit akzeptiert haben, müssen Sie diese Bedingungen in Ihrem Formular oder per E-Mail mitteilen.

Rufen Sie das Client-Geheimnis von der erstellten PaymentIntent ab und rufen Sie confirmPayment auf. Dies entspricht einer Webansicht, in der die Kund/innen die Zahlung auf der Website oder in der App ihrer Bank durchführen können. Anschließend wird das Promise mit dem Ergebnis der Zahlung aufgelöst.

export default function IdealPaymentScreen() {
  const [name, setName] = useState();
  const [email, setEmai] = useState();

  const handlePayPress = async () => {
    const billingDetails: PaymentMethodCreateParams.BillingDetails = {
      name: 'Jenny Rosen',
      email: 'jenny.rosen@example.com',
    };
  };

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

  if (error) {
    Alert.alert(`Error code: ${error.code}`, error.message);
  } else if (paymentIntent) {
    Alert.alert(
      'Success',
      `The payment was confirmed successfully! currency: ${paymentIntent.currency}`
    );
  }

    return <Screen>{/* ... */}</Screen>;
}

Wenn Sie das Konto Ihrer Kundin/Ihres Kunden erneut belasten müssen, erstellen Sie einen neuen PaymentIntent. Suchen Sie nach der ID der SEPA-Lastschrift-Zahlungsmethode, indem Sie den vorherigen PaymentIntent abrufen und das Feld latest_charge erweitern, in dem Sie die generated_sepa_debit-ID innerhalb der payment_method_details finden.

curl -G https://api.stripe.com/v1/payment_intents/{{PAYMENT_INTENT_ID}} \
  -u "
sk_test_BQokikJOvBiI2HlWgH4olfQ2
:" \
  -d "expand[]"=latest_charge

Die ID der Zahlungsmethode SEPA-Direktlastschrift finden Sie als generated_sepa_debit-ID unter payment_method_details in der Antwort.

{
  "latest_charge": {
    "payment_method_details": {
      "ideal": {
        "bank": "ing",
        "bic": "INGBNL2A",
        "iban_last4": "****",
        "generated_sepa_debit": "pm_1GrddXGf98efjktuBIi3ag7aJQ",
        "verified_name": "JENNY ROSEN"
      },
      "type": "ideal"
    },
  },
  "payment_method_options": {
    "ideal": {}

Erstellen Sie eine PaymentIntent mit der SEPA-Lastschrift und Kunden-IDs.

curl https://api.stripe.com/v1/payment_intents \
  -u "
sk_test_BQokikJOvBiI2HlWgH4olfQ2
:" \
  -d "payment_method_types[]"=sepa_debit \
  -d amount=1099 \
  -d currency=eur \
  -d customer=
{{CUSTOMER_ID}} \
  -d payment_method={{SEPA_DEBIT_PAYMENT_METHOD_ID}} \
  -d confirm=true

Verwenden Sie Ihre Test-API-Schlüssel, um den PaymentIntent zu bestätigen. Nach der Bestätigung werden Sie an eine Testseite mit Optionen zur Autorisierung oder Ablehnung der Zahlung weitergeleitet.

• Klicken Sie auf Authorize test payment (Testzahlung autorisieren), um den Fall zu testen, wenn die Zahlung erfolgreich durchgeführt wird. Die PaymentIntent wechselt von requires_action zu succeeded.
• Klicken Sie auf Fail test payment (Testzahlung ablehnen), um den Fall zu testen, wenn der/die Kund/in nicht authentifiziert werden kann. Die PaymentIntent wechselt von requires_action zu requires_payment_method.

Ihre Integration von SEPA-Lastschrift testen