FlowAlp

React-Native-SDK

September 8, 2026

Installieren Sie das offizielle FlowAlp Pay React-Native-SDK: gehosteter Checkout in einer WebView, Deep Links, Gateway-Proxy im Backend und sichere Mobile-Zahlungen für iOS und Android.

Das Paket @flowalp/pay-react-native ist das offizielle React-Native-SDK von FlowAlp. Es öffnet den gehosteten FlowAlp-Pay-Checkout in einer WebView, verarbeitet Deep-Link-Rückkehr in Ihre App und hält das Merchant-API-Secret im Backend — dasselbe sichere Muster wie in der Mobile-App-Integration.

Architektur

  1. Ihr Backend erstellt ein Gateway per POST /Gateway/ und liefert die link-URL.
  2. Ihre React-Native-App öffnet diese URL mit FlowAlpPayCheckout oder FlowAlpPayModal.
  3. Deep Links (myapp://payment/success?referenceId=…) führen den Kunden zurück in die App.
  4. Ihr Backend bestätigt die Zahlung per Webhook oder Transaktions-Abruf — verlassen Sie sich nicht allein auf den Redirect.

Betten Sie das FlowAlp-Pay-API-Secret niemals in eine Mobile-App oder ein öffentliches Repository ein. Das SDK ruft Ihr Backend auf; Ihr Backend ruft FlowAlp Pay auf. Siehe API-Zugangsdaten.

SDK beziehen

Repository klonenbash
git clone https://repo.flowalp.com/flowalpsdk/flowalppayreactnative.git
cd flowalppayreactnative
npm install
In der App installierenbash
npm install @flowalp/pay-react-native react-native-webview
cd ios && pod install

Schnellstart

Umschließen Sie die App mit FlowAlpPayProvider und starten Sie den Checkout über useFlowAlpPayCheckout. Beträge in Minor Units (CHF 25,00 → 2500) — Helper toMinorUnits verwenden. Ihr Backend muss die Gateway-Erstellung proxen; Beispielcode unter server-examples/node-express.js im Repository.

Deep Linking

URL-Schema auf iOS und Android registrieren. Standardpfade: myapp://payment/success, failed und cancel mit referenceId. usePaymentDeepLink für Redirects aus dem Hintergrund.

Test und Go-live

Repository: https://repo.flowalp.com/flowalpsdk/flowalppayreactnative.git — vollständiges README mit Architektur, Sicherheit und Webhook-Beispielen.