BacodoBACODO

Module complémentaire React Native

Intégration Stripe pour 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.

  • Code source complet inclus et vôtre en permanence
  • Aucune clé de licence complémentaire ou licence récurrente requise
  • Prêt pour la production et testé
  • Intégré à votre projet et pile React Native existants
  • Assistance technique de 30 jours après la remise incluse
  • Support technique étendu en option de 6 mois à 20 % du prix du module complémentaire

À partir de

$145

USD · React Native

Voir la démo

Intégration Stripe pour React Native · React Native

Code source completAucune clé de licencePrêt pour la productionIntégration testéeAssistance de 30 jours

Requirements

What Intégration Stripe pour React Native needs

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

Ce que ça fait

Feuille de paiement dans votre application React Native – l'API possède toujours des secrets

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.

Problème qu'il résout

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.

Comment il atterrit dans le projet

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.

Pourquoi cela permet de gagner du temps de développement

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.

Pour qui c'est

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

Ce que Intégration Stripe pour React Native inclut

Feuille de paiement dans React Native

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.

React Native récupère les secrets du client – jamais la clé secrète

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.

Apple Pay et Google Pay dans React Native

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.

Mode test React Native puis clé publiable en direct

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.

L'exécution n'est pas un écran de réussite React Native

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.

Réagir à l'erreur native et annuler les états

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

Quand Intégration Stripe pour React Native convient

Boutique React Native existante sur iOS et Android

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.

Agence remettant une application client React Native à la production

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.

Paywall SaaS dans React Native

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

Application React Native, Django ou API Node déjà en place

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

Aperçu du flux de feuille de paiement React Native

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

Comment l'intégration Stripe pour React Native est fournie

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

  1. 01

    Sélectionnez React Native Stripe

    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.

  2. 02

    Vérification de la compatibilité React Native

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

  3. 03

    Intégrer dans React Native

    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.

  4. 04

    Configurer l'application React Native

    Câblez la clé publiable via env ou spice. La clé secrète et le webhook restent sur l'API.

  5. 05

    Testez le parcours de paiement React Native

    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.

  6. 06

    Remettez la source React Native

    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

Comment Stripe se connecte à un projet React Native

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.

Application React NativeFeuille de paiementVotre APIIntentions de paiement StripeWebhook → APIReact Native lit l'état payant

Technologies prises en charge

Ce que Intégration Stripe pour React Native utilise vraiment

React Native sur iOS et Android

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.

@stripe/stripe-react-native

SDK natif officiel Stripe React pour feuille de paiement et portefeuilles.

Votre API existante

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.

Compte Stripe pour l'application React Native

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.

Back-end requis

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

Ce que comprend l'intégration Stripe pour React Native

  • Intégration dans le projet React Native existant
  • Code source complet dans votre référentiel
  • Présentation de l'environnement à clé publiable et de la feuille de paiement
  • Récupérer le contrat sur votre API PaymentIntent
  • Test des flux de paiement React Native sur iOS et Android avant transfert
  • Notes de transfert pour le passage du test à la mise en service
  • Assistance technique de 30 jours après la remise

Pas dans le prix supplémentaire

  • Compte Stripe, clés API et frais de traitement Stripe : vous les possédez
  • Un nouveau backend si vous n'avez pas d'API capable de créer des PaymentIntents
  • Une réécriture de React Native vers Flutter
  • Remplacement des achats Apple ou Google In-App
  • Marketplace Connect ou facturation personnalisée, sauf s'il s'agit d'un travail personnalisé

Pricing

Intégration Stripe pour la tarification React Native

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

  • Projet React Native existant
  • Accès Stripe Test Mode
  • Un backend est requis pour des paiements sécurisés

$145

paiement unique

React Native

Besoin d’un backend ?

  • Code source complet
  • Sans frais de licence
  • 30 jours de support
  • Intégration complète

Paiement sécurisé viastripe

Livraison et sécurité

Pratiques de livraison et de sécurité de React Native

Livraison estimée de React Native

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.

Testé sur React Native avant le transfert

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.

Les secrets de Stripe restent en dehors du binaire React Native

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.

La vérification du Webhook se fait sur l'API, pas dans React Native

React Native ne vérifie pas Stripe-Signature. Votre API le fait, puis React Native lit le résultat.

Aucune allégation de sécurité React Native invérifiable

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

Questions fréquentes

Que comprend l'intégration Stripe pour React Native ?

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.

Allez-vous intégrer Stripe dans notre application React Native existante ?

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.

L'intégration Stripe pour React Native nécessite-t-elle un backend ?

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.

Quel package Stripe Stripe Integration pour React Native utilise-t-il ?

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.

L'intégration Stripe pour React Native prend-elle en charge Apple Pay et Google Pay ?

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 est-il inclus dans l'intégration Stripe pour React Native ?

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.

L'intégration Stripe pour React Native peut-elle collecter les paiements d'abonnement ?

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

Où se trouvent les clés publiables et secrètes Stripe dans une application React Native ?

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.

Comment fonctionnent le mode test Stripe et le mode live dans React Native ?

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.

Comment Stripe Integration pour React Native gère-t-il 3-D Secure/SCA ?

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.

Les webhooks Stripe sont-ils requis pour le paiement React Native ?

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.

Pouvons-nous conserver notre interface utilisateur de paiement React Native actuelle avec Stripe ?

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.

Le prix de l'intégration Stripe pour React Native inclut-il un compte Stripe ou des frais ?

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.

L'intégration Stripe pour React Native remplacera-t-elle les achats intégrés d'Apple ou de Google ?

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.

Pouvons-nous personnaliser les reçus et les métadonnées Stripe dans React Native ?

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.

Quel support React Native est inclus après le transfert de Stripe ?

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.

Comment les mises à jour de Stripe-react-native ou de l'API Stripe sont-elles gérées sur React Native ?

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.

Que se passe-t-il si les paiements Stripe échouent dans une application React Native de production ?

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.

Quelles versions de React Native sont compatibles avec Stripe Integration pour React Native ?

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.

Qu'est-ce qu'un support technique de 30 jours par rapport à un support technique étendu de 6 mois pour l'intégration de Stripe pour React Native ?

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.

Intégration Stripe pour React Native

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