BacodoBACODO

Dodatek React Native

Integracja Stripe dla React Native

Dodaj arkusz płatności @stripe/stripe-react-native do swojej istniejącej aplikacji React Native bez tworzenia od podstaw natywnych formularzy kart, 3-D Secure i błędów związanych z tajnym kluczem. React Native nie obsługuje webhooków – robi to Twoje API.

  • Zawiera pełny kod źródłowy i jest Twój na stałe
  • Nie jest wymagany dodatkowy klucz licencyjny ani licencja cykliczna
  • Gotowe do produkcji i przetestowane
  • Zintegrowany z istniejącym projektem i stosem React Native
  • W cenie 30-dniowa pomoc techniczna po przekazaniu
  • Opcjonalne 6-miesięczne rozszerzone wsparcie techniczne za 20% ceny dodatku

Od

$145

USD · React Native

Integracja Stripe dla React Native · React Native

Pełny kod źródłowyBrak klucza licencyjnegoGotowy do produkcjiPrzetestowana integracja30-dniowe wsparcie

Requirements

What Integracja Stripe dla React Native needs

  • Istniejący projekt React Native
  • Dostęp do Stripe Test Mode
  • Do bezpiecznych płatności potrzebny jest backend

Dostęp do repozytorium nie jest wymagany. Dostęp do projektu jest potrzebny tylko, gdy Bacodo ma zintegrować dodatek bezpośrednio.

Co robi

Arkusz płatności w Twojej aplikacji React Native — API wciąż skrywa tajemnice

Bacodo integruje Stripe z projektem React Native, który już posiadasz (Expo lub bare). Po przekazaniu źródło React Native znajduje się w Twoim repozytorium. Tajny klucz i webhook pozostają w backendzie, który już uruchomiłeś. Nadal masz konto Stripe i opłaty Stripe.

Problem, który rozwiązuje

Aplikacja React Native nie może bezpiecznie tworzyć PaymentIntent ani weryfikować webhooków. Potrzebuje arkusza płatności i backendu, który zwraca sekret klienta. Budowanie tego błędnego podziału powoduje wysłanie tajnego klucza w pliku binarnym.

Jak ląduje w projekcie

Dodajemy @stripe/stripe-react-native, prezentujemy arkusz płatności z istniejącej akcji realizacji transakcji w React Native i łączymy wywołania pobierania, których interfejs API już potrzebuje dla PaymentIntents. Weryfikacja webhooka odbywa się w tym API, a nie w React Native.

Dlaczego oszczędza czas programowania

Twój zespół pomija pierwszą produkcyjną implementację Stripe React Native: arkusz płatności, SCA, natywną konfigurację i przekazanie dokumentujące sposób, w jaki aplikacja komunikuje się z Twoim API.

Dla kogo to jest

Programiści i agencje, które mają już aplikację React Native na iOS/Android oraz interfejs API i chcą łatwej w utrzymaniu ścieżki Stripe bez przepisywania aplikacji w Flutter.

Kluczowe funkcje

Co zawiera Integracja Stripe dla React Native

Arkusz płatności w React Native

Przedstaw arkusz płatności Stripe z @stripe/stripe-react-native z akcji płatniczej React Native. Dane karty pozostają w Stripe — nie w stanie React Native, który utrzymujesz.

React Native pobiera sekrety klienta — nigdy tajny klucz

Aplikacja React Native używa tylko klucza do publikacji i krótkotrwałego sekretu klienta z Twojego API. Integracja Stripe dla React Native nie umieszcza STRIPE_SECRET_KEY w pakiecie JS ani natywnym pliku binarnym.

Apple Pay i Google Pay w React Native

Włącz portfele w Arkuszu płatności, jeśli pozwala na to Twoje konto Stripe, identyfikator sprzedawcy Apple i konfiguracja Google Pay. Reakcja Natywna rezerwa pozostaje na arkuszu płatności karty.

Reaguj na natywny tryb testowy, a następnie aktywuj klucz do publikacji

Najpierw wyślij aplikację React Native z kluczem do publikacji testu Stripe. Przełączenie na żywo to udokumentowana zmiana środowiska/smaku oraz pasujący sekret na żywo w Twoim interfejsie API.

Realizacja nie jest ekranem sukcesu React Native

Ekran podziękowań w React Native nie jest źródłem prawdy. Twój interfejs API weryfikuje webhook Stripe, a następnie aplikacja React Native odczytuje stan płatny z tego interfejsu API.

Reaguj na błąd natywny i anuluj stany

Obsługuj odrzucone karty, anulowany arkusz płatności, awarie sieci i niekompletne zabezpieczenie 3-D Secure, aby interfejs użytkownika React Native nie pozostawiał klienta na martwym ekranie.

Zastosowania

Kiedy Integracja Stripe dla React Native pasuje

Istniejący sklep React Native na iOS i Android

Masz już aplikację React Native i API. Potrzebujesz realizacji transakcji arkuszem płatności bez przepisywania katalogu w Flutter.

Agencja przekazuje do produkcji aplikację kliencką React Native

Potrzebujesz łatwej do utrzymania ścieżki Stripe w React Native, źródła w repozytorium klienta i udokumentowanego przejścia na klucz na żywo zamiast wersji demonstracyjnej z przekąską.

Paywall SaaS w React Native

Aplikacja React Native pobiera pierwszą metodę płatności, podczas gdy subskrypcje pozostają w Twoim interfejsie API i Stripe Billing, jeśli już z nich korzystasz.

Aplikacja React Native, Django lub Node API już działają

Integracja Stripe dla React Native odbywa się po stronie klienta mobilnego. Jeśli potrzebujesz także wbudowanego interfejsu API, którego zakres jest ustalany osobno — ta cena nie dotyczy nowego backendu.

Demo

Podgląd przepływu arkusza płatności React Native

Podgląd ścieżki realizacji transakcji w React Native: akcja płatnicza, arkusz płatności, potwierdzenie i stany niepowodzeń. Aktywna piaskownica powiązana z Twoim kontem Stripe będzie dostępna po sprawdzeniu zgodności. Ta strona nie obsługuje rzeczywistych opłat.

Jak to działa

Jak realizowana jest integracja Stripe dla React Native

Standardowy przepływ pracy przy dodatku Bacodo, z specyficzną dla React Native kontrolą Expo w porównaniu z obiektami docelowymi iOS/Android oraz interfejsem API, który aplikacja już wywołuje.

  1. 01

    Wybierz opcję Reaguj natywnym paskiem

    Potwierdź integrację Stripe z React Native i że masz (lub będziesz mieć zakres) API, które może tworzyć PaymentIntents.

  2. 02

    Reaguj na natywną kontrolę zgodności

    Przejrzyj wersję React Native, przepływ pracy Expo lub goły, istniejący interfejs użytkownika kasy i język zaplecza, którego już używa aplikacja.

  3. 03

    Zintegruj z React Native

    Dodaj @stripe/stripe-react-native, prezentację arkusza płatności, natywną konfigurację i umowę pobierania do punktu końcowego PaymentIntent.

  4. 04

    Skonfiguruj aplikację React Native

    Połącz klucz do publikacji poprzez env lub smak. Tajny klucz i webhook pozostają w interfejsie API.

  5. 05

    Przetestuj ścieżkę płatności React Native

    Uruchom karty testowe Stripe na iOS i Androidzie, 3-D Secure, anuluj/odrzuć i potwierdź stan aktualizacji webhooka API odczytany przez aplikację React Native.

  6. 06

    Przekaż źródło React Native

    Dostarcz źródło React Native, notatki env i listę kontrolną aktywnego klucza. Utrzymanie implementacji React Native należy do Ciebie.

Architektura

Jak Stripe łączy się z projektem React Native

Plik binarny React Native nigdy nie przechowuje tajnego klucza. Arkusz płatności wykorzystuje sekret klienta z Twojego interfejsu API. Stripe powiadamia ten interfejs API za pomocą elementu webhook. React Native następnie odczytuje stan zamówienia.

Reaguj na aplikację natywnąArkusz płatnościTwoje APIIntencje płatności w paskiWebhook → APIReact Native odczytuje stan płatny

Obsługiwane technologie

Czego naprawdę używa Integracja Stripe dla React Native

Reaguj natywnie na iOS i Androida

Bieżący React Native na Expo lub sam przepływ pracy. To nie jest witryna React ani Flutter — zobacz lądowania Stripe, aby zobaczyć te stosy.

@stripe/stripe-react-native

Oficjalny pakiet SDK Stripe React Native dla arkuszy płatności i portfeli.

Twoje istniejące API

Tworzenie PaymentIntent i weryfikacja webhooka na backendie, który wywołuje już aplikacja React Native. Ten dodatek nie zastępuje tego interfejsu API usługą wyłącznie Bacodo.

Konto Stripe dla aplikacji React Native

Twoje konto Stripe, klucze testowe i aktywne, punkt końcowy webhooka w interfejsie API oraz zdarzenia w panelu kontrolnym.

Wymagany backend

Aplikacja React Native jest klientem. Webhook nie może żyć tylko na telefonie. Projekt obejmujący tylko aplikację bez interfejsu API nie może ukończyć tej ścieżki realizacji transakcji.

Co jest w cenie

Co obejmuje integracja Stripe dla React Native

  • Integracja z istniejącym projektem React Native
  • Pełny kod źródłowy w Twoim repozytorium
  • Prezentacja koperty z kluczem do publikacji i arkusza płatności
  • Pobierz umowę do interfejsu API PaymentIntent
  • Przetestowano przepływy płatności React Native na iOS i Androidzie przed przekazaniem
  • Notatki z przekazania dotyczące przejścia od testu do uruchomienia
  • 30-dniowe wsparcie techniczne po przekazaniu

Nie w cenie dodatku

  • Konto Stripe, klucze API i opłaty za przetwarzanie Stripe — jesteś ich właścicielem
  • Nowy backend, jeśli nie masz API, które może tworzyć PaymentIntents
  • Przepisanie z React Native na Flutter
  • Wymiana zakupów w aplikacji Apple lub Google
  • Marketplace Connect lub niestandardowe rozliczenia, chyba że są objęte zakresem prac niestandardowych

Pricing

Integracja Stripe dla cen React Native

Ta cena dotyczy wyłącznie platformy React Native. Nie korzysta z cen dodatków Next.js, React, Django ani Flutter.

Integracja Stripe dla React Native

Dodaj gotowy do produkcji arkusz płatności Stripe do istniejącej aplikacji React Native i zachowaj kod źródłowy.

Wymagania

  • Istniejący projekt React Native
  • Dostęp do Stripe Test Mode
  • Do bezpiecznych płatności potrzebny jest backend

$145

jednorazowo

React Native

Potrzebujesz backendu?

  • Pełny kod źródłowy
  • Bez opłaty licencyjnej
  • 30 dni wsparcia
  • Pełna integracja

Bezpieczna płatność przezstripe

Dostawa i bezpieczeństwo

Reaguj na natywne praktyki dostarczania i bezpieczeństwa

Szacowana dostawa React Native

Typowa kontrola React Native Stripe następuje po sprawdzeniu zgodności z React Native. Oś czasu zależy od Expo i Bare, bieżącego interfejsu użytkownika kasy i API.

Testowane na React Native przed przekazaniem

Karty w trybie testowym, ścieżki 3-D Secure, anulowania i odrzucania są sprawdzane w systemach iOS i Android przed przekazaniem.

Sekrety Stripe pozostają poza plikiem binarnym React Native

W kliencie znajduje się tylko klucz, który można opublikować. Tajne klucze i sekrety webhooka pozostają na serwerze wywołań aplikacji React Native.

Weryfikacja webhooka odbywa się w interfejsie API, a nie w React Native

React Native nie weryfikuje podpisu paskiem. Twój interfejs API to robi, a następnie React Native odczytuje wynik.

Brak nieweryfikowalnych roszczeń dotyczących bezpieczeństwa React Native

Nie domagamy się certyfikatu PCI ani zerowego oszustwa. React Native zbiera karty za pośrednictwem arkusza płatności, a nie niestandardowego formularza karty, który przechowujemy.

FAQ

Najczęstsze pytania

Co obejmuje integracja Stripe dla React Native?

Integracja Stripe z React Native obejmuje konfigurację @stripe/stripe-react-native, arkusz płatności w istniejącej kasie React Native, umowę pobrania do API PaymentIntent, zakres testów iOS i Android oraz notatki przekazania. W swoim projekcie otrzymujesz źródło React Native. Opłaty za Stripe, konto Stripe i tworzenie nowego backendu to odrębne kwestie.

Czy zintegrujesz Stripe z naszą istniejącą aplikacją React Native?

Tak. Integracja Stripe dla React Native jest zbudowana dla projektu React Native, który już masz. Dopasowujemy arkusz płatności i punkt wejścia płatności do bieżącego interfejsu nawigacji i płatności React Native, zamiast dostarczać oddzielną aplikację demonstracyjną jako element dostawy.

Czy integracja Stripe dla React Native wymaga backendu?

Tak dla produkcyjnej ścieżki React Native Stripe. PaymentIntents, tajny klucz i weryfikacja webhooka muszą znajdować się na serwerze. Aplikacja React Native otrzymuje tylko klucz do publikacji i sekret klienta. Jeśli nie masz interfejsu API, zakres prac backendowych jest ustalany osobno i nie jest uwzględniany w cenie dodatku React Native.

Którego pakietu Stripe używa Stripe Integration for React Native?

Integracja Stripe z React Native wykorzystuje @stripe/stripe-react-native, oficjalny pakiet SDK React Native firmy Stripe, do obsługi arkuszy płatności i przycisków portfela w systemach iOS i Android. Nie umieszczamy kasy React Native w nieudokumentowanej wtyczce, chyba że wyraźnie jej potrzebujesz.

Czy integracja Stripe dla React Native obsługuje Apple Pay i Google Pay?

Tak, jeśli obsługuje je Twoje konto Stripe, identyfikator sprzedawcy Apple, konfiguracja Google Pay i urządzenia. W React Native przyciski portfela są zakresem opcjonalnym. Arkusz płatności kartą w React Native pozostaje domyślnym rozwiązaniem zastępczym.

Czy Expo jest uwzględnione w integracji Stripe dla React Native?

Expo i bare React Native są kandydatami. Potwierdzamy Expo SDK, wtyczki konfiguracyjne i kompatybilność modułów natywnych podczas sprawdzania kompatybilności React Native. Strona internetowa React to nie miejsce docelowe — zobacz Integracja Stripe dla React.

Czy integracja Stripe dla React Native może pobierać opłaty za subskrypcję?

Klient React Native może potwierdzić PaymentIntent lub wybrać metodę płatności za pośrednictwem arkusza płatności. Produkty rozliczeniowe Stripe, portal klienta i logika faktur działają w Twoim interfejsie API. Prace wymagające dużej liczby subskrypcji React Native mogą wymagać niestandardowej wyceny.

Gdzie znajdują się klucze publikowalne i tajne Stripe w aplikacji React Native?

Aplikacja React Native używa tylko klucza do publikacji Stripe, zazwyczaj za pośrednictwem env lub bezpiecznej wersji. Tajny klucz i sekret podpisywania webhooka pozostają na serwerze. Integracja Stripe dla React Native nie umieszcza tajnych kluczy w pliku APK ani IPA.

Jak działa tryb testowy Stripe i tryb na żywo w React Native?

Najpierw wdrażamy integrację Stripe dla React Native z kluczami testowymi i kartami testowymi Stripe. Uruchomienie to udokumentowane przeniesienie klucza i webhooka w panelu Stripe Dashboard i środowisku serwerowym używanym przez aplikację React Native, a nie aktywacja licencji dodatku.

W jaki sposób integracja Stripe dla React Native obsługuje 3-D Secure / SCA?

Arkusz płatności React Native i PaymentIntents obsługują 3-D Secure poprzez @stripe/stripe-react-native. Aplikacja React Native musi utrzymywać przepływ arkuszy do czasu, aż Stripe przywróci ostateczny status; Integracja Stripe dla React Native łączy te stany jawnie.

Czy do realizacji transakcji React Native wymagane są webhooki Stripe?

Tak dla realizacji po React Native Payment Sheet. React Native UI nie jest źródłem prawdy. Twój backend weryfikuje podpisy webhooka Stripe, a następnie oznacza zamówienie opłacone, odblokowuje zawartość lub powiadamia o realizacji.

Czy możemy zachować nasz obecny interfejs użytkownika React Native przy kasie za pomocą Stripe?

Tak. Integracja Stripe dla React Native zazwyczaj zachowuje Twój produkt React Native, koszyk i przycisk płatności oraz wyświetla arkusz płatności z tej akcji. Niestandardowy formularz karty React Native, który uwzględnia surowe dane PAN, jest poza zakresem domyślnym, ponieważ arkusz płatności jest bezpieczniejszą ścieżką PCI.

Czy cena integracji Stripe dla React Native obejmuje konto Stripe lub opłaty?

Nie. Tworzysz i jesteś właścicielem konta Stripe, kluczy API i opłat za przetwarzanie Stripe. Ceną dodatku React Native jest wdrożenie do Twojego projektu React Native, a nie licencja płatnicza Bacodo.

Czy integracja Stripe dla React Native zastąpi zakupy w aplikacji Apple lub Google?

Nie. Towary cyfrowe sprzedawane w sklepie z systemem iOS lub Android często nadal wymagają IAP. Integracja Stripe z React Native umożliwia realizację transakcji Stripe w aplikacji React Native, gdzie Stripe jest dozwoloną ścieżką płatności dla Twojego typu produktu.

Czy możemy dostosować rachunki i metadane Stripe w React Native?

Tak. Metadane PaymentIntent, dane klientów i pola, które utrzymujesz po potwierdzeniu webhooka, są dopasowane do modelu zamówień Twojej istniejącej aplikacji React Native podczas integracji Stripe z React Native.

Jakie wsparcie dla React Native będzie dostępne po przekazaniu Stripe?

Źródło React Native znajduje się w Twoim repozytorium, więc Twój zespół może nim zarządzać. Dołączone 30-dniowe wsparcie obejmuje pytania techniczne i defekty w dostarczonej integracji Stripe dla zakresu React Native, a nie niepowiązane prace związane z funkcjami React Native.

W jaki sposób aktualizacje Stripe-React-native lub Stripe API są obsługiwane w React Native?

W ciągu 30 dni pomagamy z przerwami w dostarczonej integracji React Native, spowodowanymi udokumentowaną zmianą Stripe lub @stripe/stripe-react-native. Późniejsze aktualizacje pakietu React Native obejmują konserwację lub rozszerzoną pomoc techniczną, jeśli go kupisz.

Co się stanie, jeśli płatności Stripe w produkcyjnej aplikacji React Native nie powiodą się?

Dokumentujemy sposób odczytywania statusu PaymentIntent, dzienników Stripe Dashboard i dostarczania webhooka ze ścieżki realizacji transakcji React Native. 30-dniowe wsparcie obejmuje rozwiązywanie problemów z odrzuceniem, utratą 3-D Secure i źle skonfigurowanymi kluczami dla dostarczonego przepływu React Native.

Które wersje React Native są kompatybilne z integracją Stripe dla React Native?

Potwierdzamy Twoją wersję React Native, Expo lub Bare Workflow, cel wdrożenia iOS i Android minSdk względem wersji @stripe/stripe-react-native, którą przypinamy w czasie integracji. Starsze lub mocno rozwidlone środowiska wykonawcze React Native mogą wymagać dodatkowego zakresu.

Czym jest 30-dniowe wsparcie w porównaniu z 6-miesięcznym rozszerzonym wsparciem technicznym dla integracji Stripe dla React Native?

Dostarczona ścieżka React Native Stripe obejmuje 30 dni od przekazania. Rozszerzone wsparcie techniczne jest opcjonalne w cenie 20% ceny dodatku React Native i obejmuje dodatkowe sześć miesięcy pomocy technicznej dotyczącej tej samej integracji z React Native, a nie nowej kompilacji produktu.

Integracja Stripe dla React Native

Dodaj gotowe do produkcji płatności Stripe do istniejącej aplikacji React Native, zachowaj kod źródłowy i zachowaj tajemnice w swoim API.

$145