- Projet React Native existant
- Accès Stripe Test Mode
- Un backend est requis pour des paiements sécurisés
Aucun accès au dépôt n’est requis. L’accès au projet n’est nécessaire que si vous voulez que Bacodo l’intègre directement.
Module complémentaire React Native
Ajoutez la feuille de paiement @stripe/stripe-react-native à votre application React Native existante sans créer de formulaires de carte natifs, 3-D Secure et d'erreurs de clé secrète à partir de zéro. React Native n'héberge pas de webhooks, mais votre API le fait.
À partir de
$145
USD · React Native
Intégration Stripe pour React Native · React Native
Requirements
Aucun accès au dépôt n’est requis. L’accès au projet n’est nécessaire que si vous voulez que Bacodo l’intègre directement.
Ce que ça fait
Bacodo intègre Stripe dans le projet React Native que vous possédez déjà (Expo ou nu). Après le transfert, la source React Native réside dans votre dépôt. La clé secrète et le webhook restent sur un backend que vous exécutez déjà. Vous possédez toujours le compte Stripe et les frais Stripe.
Une application React Native ne peut pas créer en toute sécurité des PaymentIntents ou vérifier des webhooks. Il a besoin d'une feuille de paiement et d'un backend qui renvoie un secret client. Le bâtiment qui s'est mal divisé envoie la clé secrète dans le binaire.
Nous ajoutons @stripe/stripe-react-native, présentons la feuille de paiement de votre action de paiement React Native existante et transmettons les appels de récupération dont votre API a déjà besoin pour PaymentIntents. La vérification du Webhook s'effectue sur cette API, pas dans React Native.
Votre équipe ignore la première implémentation de production de Stripe React Native : feuille de paiement, SCA, configuration native et transfert qui documente la façon dont l'application communique avec votre API.
Développeurs et agences qui disposent déjà d'une application React Native iOS/Android et d'une API, et qui souhaitent un chemin Stripe maintenable sans réécrire l'application dans Flutter.
Fonctions clés
Présentez la feuille de paiement Stripe avec @stripe/stripe-react-native à partir de votre action de paiement React Native. Les données de la carte restent sur Stripe – et non dans l'état React Native que vous persistez.
L'application React Native utilise uniquement la clé publiable et un secret client de courte durée de votre API. Stripe Integration for React Native ne met pas STRIPE_SECRET_KEY dans le bundle JS ou le binaire natif.
Activez les portefeuilles dans la feuille de paiement lorsque votre compte Stripe, votre identifiant de marchand Apple et la configuration de Google Pay le permettent. La solution de secours React Native reste sur la feuille de paiement de la carte.
Expédiez d'abord l'application React Native avec la clé publiable de test Stripe. Le basculement en direct est un changement d'environnement/de saveur documenté ainsi que le secret en direct correspondant sur votre API.
Un écran de remerciement React Native n'est pas la source de vérité. Votre API vérifie le webhook Stripe, puis l'application React Native lit l'état payant à partir de cette API.
Gérez les cartes refusées, les feuilles de paiement annulées, les pannes de réseau et les 3-D Secure incomplets afin que l'interface utilisateur React Native ne laisse pas le client sur un écran mort.
Cas d’usage
Vous disposez déjà d’une application React Native et d’une API. Vous avez besoin du paiement par feuille de paiement sans réécrire le catalogue dans Flutter.
Vous avez besoin d'un chemin Stripe maintenable dans React Native, d'une source dans le dépôt client et d'un basculement de clé en direct documenté au lieu d'une démo de collation.
L'application React Native collecte un premier moyen de paiement tandis que les abonnements restent sur votre API et Stripe Billing si vous les utilisez déjà.
Stripe Integration pour React Native est le côté client mobile. Si vous avez également besoin de construire l'API, qui est définie séparément, ce prix ne concerne pas un nouveau backend.
Démo
Prévisualisez le chemin de paiement de React Native : action de paiement, feuille de paiement, confirmation et états d'échec. Un bac à sable en direct pour votre compte Stripe est disponible après vérification de compatibilité. Cette page ne traite pas les frais réels.
Comment ça marche
Flux de travail complémentaire Bacodo standard, avec des vérifications spécifiques à React Native pour Expo vs Bare, les cibles iOS/Android et l'API que l'application appelle déjà.
01
Confirmez l'intégration de Stripe pour React Native et que vous disposez (ou allez développer) une API capable de créer des PaymentIntents.
02
Vérifiez la version React Native, l'Expo ou le flux de travail nu, l'interface utilisateur de paiement existante et le langage backend que l'application utilise déjà.
03
Ajoutez @stripe/stripe-react-native, la présentation de la feuille de paiement, la configuration native et le contrat de récupération à votre point de terminaison PaymentIntent.
04
Câblez la clé publiable via env ou spice. La clé secrète et le webhook restent sur l'API.
05
Exécutez les cartes de test Stripe sur iOS et Android, 3-D Secure, annulez/refusez et confirmez l'état des mises à jour du webhook de l'API lu par l'application React Native.
06
Fournissez la source React Native, des notes d'environnement et une liste de contrôle des clés en direct. L’implémentation de React Native vous appartient.
Architecture
Le binaire React Native ne détient jamais la clé secrète. Payment Sheet utilise un secret client de votre API. Stripe informe cette API par webhook. React Native lit ensuite l'état de la commande.
Technologies prises en charge
React Native actuel sur Expo ou un flux de travail nu. Ce n'est pas un site Web React ni Flutter - voir ces atterrissages Stripe pour ces piles.
SDK natif officiel Stripe React pour feuille de paiement et portefeuilles.
Création de PaymentIntent et vérification du webhook sur le backend que l'application React Native appelle déjà. Ce module complémentaire ne remplace pas cette API par un service réservé à Bacodo.
Votre compte Stripe, vos clés de test et en direct, le point de terminaison du webhook sur l'API et les événements du tableau de bord.
L'application React Native est un client. Le webhook ne peut pas vivre uniquement sur le téléphone. Un projet d'application uniquement sans API ne peut pas effectuer ce chemin de récupération.
Ce qui est inclus
Pricing
Ce prix concerne uniquement la plateforme React Native. Il n'utilise pas la tarification des modules complémentaires Next.js, React, Django ou Flutter.
Intégration Stripe pour React Native
Ajoutez une feuille de paiement Stripe prête pour la production à une application React Native existante et conservez le code source.
Prérequis
$145
paiement uniqueReact Native
Besoin d’un backend ?
Paiement sécurisé viastripe
Livraison et sécurité
La vérification typique de React Native Stripe est étendue après la vérification de compatibilité de React Native. La chronologie dépend de l'Expo par rapport au nu, de l'interface utilisateur de paiement actuelle et de l'API.
Les cartes en mode test, 3-D Secure, les chemins d'annulation et de refus sont exercés sur iOS et Android avant notre passation de service.
Seule la clé publiable se trouve dans le client. Les clés secrètes et les secrets des webhooks restent sur le serveur appelé par l'application React Native.
React Native ne vérifie pas Stripe-Signature. Votre API le fait, puis React Native lit le résultat.
Nous ne revendiquons pas la certification PCI ou le zéro fraude. React Native collecte les cartes via la feuille de paiement, et non via un formulaire de carte personnalisé que nous stockons.
FAQ
L'intégration Stripe pour React Native comprend la configuration @stripe/stripe-react-native, la feuille de paiement dans votre paiement React Native existant, le contrat de récupération vers votre API PaymentIntent, la couverture des tests iOS et Android et les notes de transfert. Vous recevez la source React Native dans votre projet. Les frais Stripe, votre compte Stripe et la création d'un nouveau backend sont distincts.
Oui. Stripe Integration for React Native est conçu pour un projet React Native que vous possédez déjà. Nous intégrons la feuille de paiement et le point d'entrée de paiement dans votre interface utilisateur de navigation et de paiement React Native actuelle au lieu d'expédier une application de démonstration distincte comme livrable.
Oui pour un chemin de production React Native Stripe. PaymentIntents, la clé secrète et la vérification du webhook doivent résider sur un serveur. L'application React Native reçoit uniquement une clé publiable et un secret client. Si vous n'avez pas d'API, ce travail backend est défini séparément et n'est pas pris en compte dans le prix du module complémentaire React Native.
L'intégration Stripe pour React Native utilise @stripe/stripe-react-native, le SDK React Native officiel de Stripe, pour les boutons de feuille de paiement et de portefeuille sur iOS et Android. Nous n'englobons pas la vérification React Native dans un plugin non documenté, sauf si vous en avez explicitement besoin.
Oui lorsque votre compte Stripe, votre identifiant de marchand Apple, la configuration de Google Pay et vos appareils les prennent en charge. Dans React Native, les boutons du portefeuille sont facultatifs. La feuille de paiement par carte sur React Native reste la solution de secours par défaut.
Expo et React Native nus sont tous deux candidats. Nous confirmons la compatibilité du SDK Expo, des plugins de configuration et des modules natifs lors de la vérification de compatibilité React Native. Un site Web React n'est pas cet atterrissage — voir Stripe Integration for React.
Le client React Native peut confirmer un PaymentIntent ou collecter un mode de paiement via Payment Sheet. Les produits de facturation Stripe récurrents, le portail client et la logique de facturation sont en direct sur votre API. Les travaux React Native nécessitant beaucoup d'abonnements peuvent nécessiter un devis personnalisé.
L'application React Native utilise uniquement la clé publiable Stripe, généralement via env ou une version sécurisée. La clé secrète et le secret de signature du webhook restent sur le serveur. Stripe Integration pour React Native ne met pas de clés secrètes dans l'APK ou l'IPA.
Nous implémentons d'abord l'intégration Stripe pour React Native contre les clés de test et les cartes de test Stripe. La mise en ligne est une transition documentée de clé et de webhook dans votre tableau de bord Stripe et votre environnement de serveur utilisé par l'application React Native, et non une activation de licence complémentaire.
React Native Payment Sheet et PaymentIntents gèrent 3-D Secure via @stripe/stripe-react-native. L'application React Native doit maintenir le flux de feuilles en vie jusqu'à ce que Stripe renvoie un statut final ; Stripe Integration for React Native connecte explicitement ces états.
Oui pour l'exécution après React Native Payment Sheet. L'interface utilisateur React Native n'est pas la source de vérité. Votre backend vérifie les signatures des webhooks Stripe, puis marque la commande payée, déverrouille le contenu ou notifie l'exécution.
Oui. L'intégration Stripe pour React Native conserve généralement votre produit React Native, votre panier et votre bouton de paiement et présente la feuille de paiement de cette action. Un formulaire de carte React Native personnalisé qui touche les données brutes PAN n'est pas compris dans la portée par défaut, car la feuille de paiement est le chemin PCI le plus sûr.
Non. Vous créez et possédez le compte Stripe, les clés API et les frais de traitement Stripe. Le prix du module complémentaire React Native est une implémentation dans votre projet React Native, et non une licence de paiement Bacodo.
Non. Les produits numériques vendus dans la boutique iOS ou Android nécessitent souvent encore un IAP. L'intégration Stripe pour React Native est destinée au paiement Stripe dans une application React Native où Stripe est un mode de paiement autorisé pour votre type de produit.
Oui. Les métadonnées PaymentIntent, les enregistrements client et les champs que vous conservez après la confirmation du webhook sont alignés sur le modèle de commande de votre application React Native existante lors de l'intégration de Stripe pour React Native.
La source React Native se trouve dans votre dépôt, afin que votre équipe puisse la maintenir. Le support inclus de 30 jours couvre les questions techniques et les défauts dans la portée de l'intégration Stripe pour React Native fournie, ainsi que le travail sur les fonctionnalités React Native sans rapport.
Pendant la période de 30 jours, nous aidons en cas de rupture de l'intégration React Native livrée causée par un changement Stripe ou @stripe/stripe-react-native documenté. Les mises à niveau continues du package React Native constituent ensuite votre maintenance ou votre support technique étendu si vous l'achetez.
Nous documentons comment lire le statut PaymentIntent, les journaux du tableau de bord Stripe et la livraison des webhooks à partir du chemin de paiement React Native. L'assistance de 30 jours comprend le dépannage des refus, les abandons de 3-D Secure et les clés mal configurées pour le flux React Native fourni.
Nous confirmons votre version React Native, votre flux de travail Expo ou nu, votre cible de déploiement iOS et Android minSdk par rapport à la version @stripe/stripe-react-native que nous épinglons au moment de l'intégration. Les environnements d'exécution React Native plus anciens ou fortement fourchus peuvent nécessiter une portée supplémentaire.
30 jours après le transfert sont inclus pour le chemin React Native Stripe livré. Le support technique étendu est facultatif à 20 % du prix du module complémentaire React Native et couvre six mois supplémentaires d'aide technique sur cette même intégration React Native, et non sur une nouvelle version de produit.
Ajoutez des paiements Stripe prêts pour la production à votre application React Native existante, conservez le code source et gardez les secrets sur votre API.
$145