Zahlungen per Afterpay oder Clearpay annehmen
Erfahren Sie, wie Sie Zahlungen mit Afterpay annehmen (im Vereinigten Königreich auch unter dem Namen Clearpay bekannt), einer Zahlungsmethode in den USA, CA, UK, AU und NZ.
Vorsicht
Der Inhalt dieses Abschnitts bezieht sich auf ein Legacy-Produkt. Verwenden Sie den Leitfaden Zahlungen akzeptieren für den aktuellsten Integrationspfad. Auch wenn Stripe dieses Produkt jetzt noch unterstützt, kann sich dies ändern, wenn das Produkt nicht mehr unterstützt wird.
Stripe-Nutzer/innen können die Payment Intents API – einen zentralen Integrationspfad für die Erstellung von Zahlungen mit einer beliebigen unterstützten Methode – verwenden, um Zahlungen per Afterpay von Kundinnen und Kunden aus folgenden Ländern anzunehmen:
- Australien
- Kanada
- Neuseeland
- Vereinigtes Königreich
- Vereinigte Staaten
Afterpay ist eine Zahlungsmethode für die einmalige Nutzung mit sofortiger Benachrichtigung, bei der Kundinnen/Kunden ihre Zahlung authentifizieren müssen. Kundinnen/Kunden werden auf die Afterpay-Website weitergeleitet, wo sie den Bedingungen eines Ratenzahlungsvertrags zustimmen. Wenn die Kundinnen/Kunden die Bedingungen akzeptieren, werden die Gelder garantiert und auf Ihr Stripe-Konto überwiesen. Die Kundinnen/Kunden zahlen die Zahlung über eine gewissen Zeitraum direkt an Afterpay zurück.
Notiz
Bevor Sie mit der Integration beginnen, vergewissern Sie sich, dass Ihr Konto für Afterpay geeignet ist. Dies können Sie in Ihren Einstellungen für Zahlungsmethoden prüfen.
Stripe einrichtenServerseitigClientseitig
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:
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):
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.
Notiz
Wir empfehlen Ihnen, die offizielle Anleitung zu TypeScript 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 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> ); }
Notiz
Verwenden Sie Ihre API-Testschlüssel beim Testen und Entwickeln Ihrer App und Ihre Live-Modus-Schlüssel beim Veröffentlichen Ihrer App.
PaymentIntent erstellenServerseitigClientseitig
Ein PaymentIntent ist ein Objekt, das Ihre Absicht, eine Kundenzahlung einzuziehen, darstellt und den gesamten Zahlungsvorgang dokumentiert.
Serverseitig
Erstellen Sie einen PaymentIntent
auf Ihrem Server und geben Sie den einzuziehenden Betrag sowie eine unterstützte Währung an. Wenn Sie bereits eine Integration mit dem Payment Intents API haben, fügen Sie afterpay_
zur Liste der Zahlungsmethoden für Ihren PaymentIntent
hinzu.
Clientseitig
Im zurückgegebenen PaymentIntent ist ein Client-Geheimnis enthalten, mit dem der Client den Zahlungsvorgang sicher abschließen kann, anstatt das gesamte PaymentIntent-Objekt zu übergeben. Fordern Sie auf dem Client einen PaymentIntent von Ihrem Server an und speichern Sie das zugehörige Client-Geheimnis.
const fetchPaymentIntentClientSecret = async () => { const response = await fetch(`${API_URL}/create-payment-intent`, { method: 'POST', headers: { 'Content-Type': 'application/json', }, body: JSON.stringify({ currency: 'usd', payment_method_types: ['afterpay_clearpay'], }), }); const {clientSecret, error} = await response.json(); return {clientSecret, error}; };
Angaben zur Zahlungsmethode erfassenClientseitig
Für Afterpay sind die Abrechnungsdaten erforderlich, damit die Zahlung durchgeführt werden kann. Erfassen Sie in Ihrer App die erforderlichen Abrechnungsdaten von den Kundinnen/Kunden:
- Vollständiger Name (Vor- und Nachname)
- E-Mail-Adresse
- Vollständige Rechnungsadresse
Auch wenn keine Versanddaten erforderlich sind, können Sie die Authentifizierungsraten verbessern. Um Versanddaten zu erfassen, erfassen Sie folgende Daten von der Kundin/dem Kunden:
- Vollständiger Name
- Vollständige Versandadresse
export default function AfterpayClearpayPaymentScreen() { const [email, setEmail] = useState(''); const handlePayPress = async () => { const billingDetails: PaymentMethodCreateParams.BillingDetails = { email, phone: '+48888000888', addressCity: 'Houston', addressCountry: 'US', addressLine1: '1459 Circle Drive', addressLine2: 'Texas', addressPostalCode: '77063', name: 'Jenny Rosen', }; // Shipping details are optional but recommended to pass in. const shippingDetails: PaymentMethodCreateParams.ShippingDetails = { addressLine1: '1459 Circle Drive', addressCountry: 'US', addressPostalCode: '77063', name: 'Jenny Rosen', }; // ... }; return ( <Screen> <TextInput placeholder="E-mail" onChange={(value) => setEmail(value.nativeEvent.text)} /> </Screen> ); }
Zahlung an Stripe sendenClientseitig
Rufen Sie das Client-Geheimnis aus dem von Ihnen erstellten PaymentIntent ab und rufen Sie confirmPayment
auf. Achten Sie auf einen vorsichtigen Umgang mit dem Client-Geheimnis, da mit ihm die Zahlung abgeschlossen werden kann. Es darf nicht protokolliert, in URLs eingebettet oder Personen außer der Kundin/dem Kunden selbst zugänglich gemacht werden.
export default function AfterpayClearpayPaymentScreen() { const [email, setEmail] = useState(''); const handlePayPress = async () => { // ... const {error, paymentIntent} = await confirmPayment(clientSecret, { paymentMethodType: 'AfterpayClearpay', paymentMethodData: { billingDetails, // Shipping details are optional but recommended to pass in. shippingDetails, }, }); 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>; }
Fehlgeschlagene Zahlungen
Afterpay berücksichtigt mehrere Faktoren bei der Entscheidung, ob eine Transaktion akzeptiert oder abgelehnt wird (zum Beispiel die Dauer der Nutzung von Afterpay durch den/die Käufer/in, den ausstehenden Betrag, den der/die Kund/in zurückzahlen muss, oder den Wert der aktuellen Bestellung).
Sie sollten in Ihrem Bezahlvorgang immer weitere Zahlungsoptionen wie card
anbieten, da Afterpay-Zahlungen eine höhere Ablehnungsrate haben als viele andere Zahlungsmethoden. In diesen Fällen wird die PaymentMethod getrennt und der Status des PaymentIntent-Objekts wechselt automatisch zu requires_
.
Bei einem Afterpay-PaymentIntent mit dem Status requires_
müssen Kundinnen/Kunden die Zahlung innerhalb von 3 Stunden nach Weiterleitung zur Afterpay-Website abschließen. Wenn nach 3 Stunden keine Aktion erfolgt ist, wird die PaymentMethod getrennt, und der Status des PaymentIntent-Objekts wechselt automatisch zu requires_
.
Teilen Sie Ihren Kund/innen in diesen Fällen mit, dass sie es mit einer anderen Zahlungsoption versuchen sollten, die in Ihrem Bezahlvorgang zur Verfügung gestellt wird.
Fehlercodes
Im Folgenden finden Sie die häufigsten Fehlercodes und die entsprechenden empfohlenen Maßnahmen:
Fehlercode | Empfohlene Maßnahme |
---|---|
payment_ | Ein allgemeiner Fehler, der darauf hinweist, dass der Afterpay-Bezahlvorgang fehlgeschlagen ist. Dabei kann es sich auch um eine Ablehnung handeln, die nicht als Ablehnungsfehlercode angezeigt wird. |
payment_ | Afterpay hat die Kundenzahlung abgelehnt. Als nächsten Schritt muss sich der Kunde/die Kundin an Afterpay wenden, um weitere Informationen einzuholen. |
payment_ | Der Kunde/die Kundin hat die Zahlung nicht auf der Bezahlseite von Afterpay abgeschlossen und die Zahlungssitzung ist abgelaufen. Payment Intents, die nicht erfolgreich autorisiert wurden, lassen Stripe automatisch 3 Stunden nach der Erstellung des Bezahlvorgangs ablaufen. |
payment_ | Bei Afterpay ist ein Servicefehler aufgetreten und die Anfrage kann nicht abgeschlossen werden. Versuchen Sie es zu einem späteren Zeitpunkt erneut. |
amount_ | Geben Sie einen Betrag ein, der innerhalb der Standard-Transaktionslimits von Afterpay für das jeweilige Land liegt. |
amount_ | Geben Sie einen Betrag ein, der innerhalb der Standard-Transaktionslimits von Afterpay für das jeweilige Land liegt. |