BacodoBACODO

رد الفعل الوظيفة الإضافية الأصلية

تكامل Stripe لـ React Native

قم بإضافة @stripe/stripe-react-native Payment Sheet إلى تطبيق React Native الموجود لديك دون إنشاء نماذج بطاقة أصلية و3-D Secure وأخطاء المفتاح السري من البداية. لا يستضيف React Native خطافات الويب — بل إن واجهة برمجة التطبيقات (API) الخاصة بك هي التي تفعل ذلك.

  • تم تضمين كود المصدر الكامل لك بشكل دائم
  • لا يلزم وجود مفتاح ترخيص إضافي أو ترخيص متكرر
  • جاهز للإنتاج وتم اختباره
  • مدمج في مشروع React Native الحالي والمكدس
  • يشمل الدعم الفني لمدة 30 يومًا بعد التسليم
  • دعم فني اختياري ممتد لمدة 6 أشهر بخصم 20% من سعر الوظيفة الإضافية

من

$145

USD · React Native

عرض تجريبي

تكامل Stripe لـ React Native · React Native

كود المصدر الكامللا يوجد مفتاح الترخيصجاهز للإنتاجالتكامل الذي تم اختبارهدعم لمدة 30 يومًا

Requirements

What تكامل Stripe لـ React Native needs

  • مشروع React Native قائم
  • الوصول إلى Stripe Test Mode
  • يلزم باكند للدفع الآمن

لا يلزم الوصول إلى المستودع. نحتاج صلاحية المشروع فقط إذا رغبتم أن تُدمج Bacodo الإضافة مباشرة.

ماذا يفعل

ورقة الدفع في تطبيق React Native الخاص بك - لا تزال واجهة برمجة التطبيقات تمتلك أسرارًا

يقوم Bacodo بدمج Stripe في مشروع React Native الذي لديك بالفعل (Expo أو العارية). بعد التسليم، يظل مصدر React Native موجودًا في الريبو الخاص بك. يظل المفتاح السري وخطاف الويب على الواجهة الخلفية التي تقوم بتشغيلها بالفعل. لا تزال تمتلك حساب Stripe ورسوم Stripe.

المشكلة يحلها

لا يمكن لتطبيق React Native إنشاء PaymentIntents أو التحقق من خطافات الويب بأمان. إنها تحتاج إلى ورقة دفع وواجهة خلفية تُرجع سر العميل. بناء هذا الانقسام بشكل خاطئ يشحن المفتاح السري في الملف الثنائي.

كيف يهبط في المشروع

نضيف @stripe/stripe-react-native، ونقدم ورقة الدفع من إجراء الخروج الحالي الخاص بـ React Native، ونرسل طلبات الجلب التي تحتاجها واجهة برمجة التطبيقات (API) الخاصة بك بالفعل لـ PaymentIntents. يتم التحقق من Webhook على واجهة برمجة التطبيقات هذه، وليس داخل React Native.

لماذا يوفر وقت التطوير

يتخطى فريقك أول تنفيذ إنتاجي لـ Stripe React Native: ورقة الدفع، وSCA، والتكوين الأصلي، والتسليم الذي يوثق كيفية اتصال التطبيق بواجهة برمجة التطبيقات (API) الخاصة بك.

لمن هو

المطورون والوكالات الذين لديهم بالفعل تطبيق React Native iOS/Android وواجهة برمجة التطبيقات، ويريدون مسار Stripe يمكن صيانته دون إعادة كتابة التطبيق في Flutter.

الميزات الأساسية

ما يشمله تكامل Stripe لـ React Native

ورقة الدفع في React Native

قم بتقديم ورقة دفع Stripe مع @stripe/stripe-react-native من إجراء الدفع React Native الخاص بك. تظل بيانات البطاقة على Stripe — وليس في حالة React Native التي تستمر فيها.

يقوم React Native بجلب أسرار العميل، وليس المفتاح السري أبدًا

يستخدم تطبيق React Native فقط المفتاح القابل للنشر وسر العميل قصير الأمد من واجهة برمجة التطبيقات (API) الخاصة بك. لا يضع تكامل Stripe لـ React Native STRIPE_SECRET_KEY في حزمة JS أو الثنائي الأصلي.

Apple Pay وGoogle Pay في React Native

قم بتمكين المحافظ في ورقة الدفع عندما يسمح لك حساب Stripe ومعرف تاجر Apple وإعداد Google Pay بذلك. يبقى الإجراء الاحتياطي React Native على ورقة الدفع الخاصة بالبطاقة.

رد فعل وضع الاختبار الأصلي ثم العيش مفتاح قابل للنشر

قم بشحن تطبيق React Native باستخدام مفتاح Stripe القابل للنشر للاختبار أولاً. التغيير المباشر هو تغيير موثق للبيئة/النكهة بالإضافة إلى السر المباشر المطابق في واجهة برمجة التطبيقات (API) الخاصة بك.

لا يُعد الاستيفاء شاشة نجاح React Native

شاشة الشكر React Native ليست مصدر الحقيقة. تتحقق واجهة برمجة التطبيقات الخاصة بك من خطاف الويب Stripe، ثم يقرأ تطبيق React Native الحالة المدفوعة من واجهة برمجة التطبيقات تلك.

الرد على الخطأ الأصلي وإلغاء الحالات

تعامل مع البطاقات المرفوضة وورقة الدفع الملغاة وفشل الشبكة والتأمين ثلاثي الأبعاد غير المكتمل حتى لا تترك واجهة مستخدم React Native العميل في شاشة ميتة.

حالات الاستخدام

متى يناسب تكامل Stripe لـ React Native

متجر React Native الموجود على iOS وAndroid

لديك بالفعل تطبيق React Native وواجهة برمجة التطبيقات. أنت بحاجة إلى الخروج من ورقة الدفع دون إعادة كتابة الكتالوج في Flutter.

تقوم الوكالة بتسليم تطبيق عميل React Native إلى الإنتاج

أنت بحاجة إلى مسار Stripe يمكن صيانته في React Native، ومصدر في مستودع العميل، ومفتاح مباشر موثق بدلاً من العرض التوضيحي للوجبات الخفيفة.

SaaS paywall في React Native

يجمع تطبيق React Native طريقة الدفع الأولى بينما تظل الاشتراكات على API وStripe Billing إذا كنت تستخدمها بالفعل.

تطبيق React Native أو Django أو Node API موجود بالفعل

تكامل Stripe لـ React Native هو جانب العميل المحمول. إذا كنت بحاجة أيضًا إلى إنشاء واجهة برمجة التطبيقات (API)، فسيتم تحديد نطاق ذلك بشكل منفصل - فهذا السعر ليس واجهة خلفية جديدة.

عرض

رد فعل معاينة تدفق ورقة الدفع الأصلية

قم بمعاينة مسار دفع React Native: إجراء الدفع، ورقة الدفع، التأكيد، وحالات الفشل. يتوفر وضع الحماية المباشر لحساب Stripe الخاص بك بعد التحقق من التوافق. هذه الصفحة لا تعالج الرسوم الحقيقية.

كيف يعمل

كيف يتم تقديم تكامل Stripe لـ React Native

سير العمل الإضافي القياسي لـ Bacodo، مع عمليات التحقق الخاصة بـ React Native لأهداف Expo مقابل العارية، وأهداف iOS/Android، وواجهة برمجة التطبيقات التي يستدعيها التطبيق بالفعل.

  1. 01

    حدد رد الفعل Stripe الأصلي

    تأكد من تكامل Stripe لـ React Native وأن لديك (أو ستقوم بنطاق) واجهة برمجة التطبيقات (API) التي يمكنها إنشاء PaymentIntents.

  2. 02

    رد فعل التحقق من التوافق الأصلي

    قم بمراجعة إصدار React Native، أو Expo أو سير العمل المجرد، وواجهة مستخدم الخروج الحالية، ولغة الواجهة الخلفية التي يستخدمها التطبيق بالفعل.

  3. 03

    الاندماج في React Native

    أضف @stripe/stripe-react-native وعرض ورقة الدفع والتكوين الأصلي وعقد الجلب إلى نقطة نهاية PaymentIntent الخاصة بك.

  4. 04

    قم بتكوين تطبيق React Native

    قم بتوصيل المفتاح القابل للنشر عبر env أو نكهة. يبقى المفتاح السري وخطاف الويب على واجهة برمجة التطبيقات.

  5. 05

    اختبر مسار الدفع React Native

    قم بتشغيل بطاقات اختبار Stripe على نظامي التشغيل iOS وAndroid، و3-D Secure، والإلغاء/الرفض، والتأكد من أن تحديثات API webhook تشير إلى قراءة تطبيق React Native.

  6. 06

    تسليم مصدر React الأصلي

    قم بتوصيل مصدر React Native وملاحظات البيئة وقائمة التحقق من المفاتيح المباشرة. إن تنفيذ React Native هو ملكك للمحافظة عليه.

الهندسة

كيف يتصل Stripe بمشروع React Native

لا يحمل ثنائي React Native المفتاح السري أبدًا. تستخدم ورقة الدفع سر العميل من واجهة برمجة التطبيقات (API) الخاصة بك. يقوم Stripe بإعلام واجهة برمجة التطبيقات (API) عن طريق خطاف الويب. React Native ثم يقرأ حالة الطلب.

رد فعل التطبيق الأصليورقة الدفعواجهة برمجة التطبيقات الخاصة بكنوايا الدفع Stripeيةخطاف الويب → واجهة برمجة التطبيقاتReact Native يقرأ الحالة المدفوعة

التقنيات المدعومة

ما يستخدمه تكامل Stripe لـ React Native فعليًا

React Native على iOS وAndroid

React Native الحالي في Expo أو سير العمل المجرد. هذا ليس موقع React وليس Flutter - راجع عمليات هبوط Stripe تلك لتلك الأكوام.

@stripe/stripe-react-native

شريط React Native SDK الرسمي لأوراق الدفع والمحافظ.

واجهة برمجة التطبيقات الحالية لديك

يقوم PaymentIntent بإنشاء والتحقق من webhook على الواجهة الخلفية التي يستدعيها تطبيق React Native بالفعل. لا تحل هذه الوظيفة الإضافية محل واجهة برمجة التطبيقات هذه بخدمة Bacodo فقط.

حساب شريطي لتطبيق React Native

حساب Stripe الخاص بك، ومفاتيح الاختبار والمباشرة، ونقطة نهاية خطاف الويب على واجهة برمجة التطبيقات، وأحداث لوحة المعلومات.

الخلفية المطلوبة

تطبيق React Native هو عميل. لا يمكن أن يعيش خطاف الويب على الهاتف فقط. لا يمكن لمشروع التطبيق فقط الذي لا يحتوي على واجهة برمجة التطبيقات (API) إكمال مسار الدفع هذا.

ما الذي يتضمنه

ما يتضمنه تكامل Stripe لـ React Native

  • التكامل في مشروع React Native الحالي
  • كود المصدر الكامل في المستودع الخاص بك
  • مفتاح قابل للنشر وعرض ورقة الدفع
  • قم بإحضار العقد إلى واجهة برمجة تطبيقات PaymentIntent الخاصة بك
  • تم اختبار تدفقات دفع React Native على نظامي التشغيل iOS وAndroid قبل التسليم
  • ملاحظات التسليم للاختبار مدى الحياة
  • دعم فني لمدة 30 يومًا بعد التسليم

ليس في السعر الإضافي

  • حساب Stripe، ومفاتيح API، ورسوم معالجة Stripe - أنت تمتلكها
  • واجهة خلفية جديدة إذا لم يكن لديك واجهة برمجة تطبيقات (API) يمكنها إنشاء PaymentIntents
  • إعادة الكتابة من React Native إلى Flutter
  • استبدال الشراء داخل التطبيق من Apple أو Google
  • Marketplace Connect أو الفوترة المخصصة ما لم يتم تحديدها كعمل مخصص

Pricing

تكامل Stripe لتسعير React Native

هذا السعر مخصص لمنصة React Native فقط. ولا يستخدم تسعير الوظائف الإضافية Next.js أو React أو Django أو Flutter.

تكامل Stripe لـ React Native

قم بإضافة ورقة دفع Stripe جاهزة للإنتاج إلى تطبيق React Native موجود واحتفظ بكود المصدر.

المتطلبات

  • مشروع React Native قائم
  • الوصول إلى Stripe Test Mode
  • يلزم باكند للدفع الآمن

$145

دفعة واحدة

React Native

تحتاجون باكند؟

  • الشيفرة المصدرية كاملة
  • بدون رسوم ترخيص
  • دعم لمدة 30 يوماً
  • تكامل كامل

دفع آمن عبرstripe

التسليم والأمان

رد فعل التسليم الأصلي والممارسات الأمنية

التسليم المقدر لـ React Native

يتم تحديد نطاق عملية سحب React Native Stripe النموذجية بعد التحقق من توافق React Native. يعتمد المخطط الزمني على Expo vs العارية، وواجهة مستخدم الخروج الحالية، وواجهة برمجة التطبيقات.

تم اختباره على React Native قبل التسليم

يتم ممارسة بطاقات وضع الاختبار والتأمين ثلاثي الأبعاد ومسارات الإلغاء والرفض على نظامي التشغيل iOS وAndroid قبل التسليم.

تظل أسرار Stripe بعيدة عن ثنائي React Native

المفتاح القابل للنشر فقط موجود في العميل. تظل المفاتيح السرية وأسرار خطاف الويب على الخادم الذي يستدعيه تطبيق React Native.

يتم التحقق من Webhook على واجهة برمجة التطبيقات (API)، وليس في React Native

لا يتحقق React Native من التوقيع Stripeي. تقوم واجهة برمجة التطبيقات الخاصة بك بذلك، ثم يقرأ React Native النتيجة.

لا توجد مطالبات أمان React Native لا يمكن التحقق منها

نحن لا نطالب بشهادة PCI أو الاحتيال الصفري. تجمع React Native البطاقات من خلال ورقة الدفع، وليس من خلال نموذج بطاقة مخصص نقوم بتخزينه.

الأسئلة الشائعة

الأسئلة الشائعة

ما الذي يتضمنه تكامل Stripe في React Native؟

يشتمل تكامل Stripe لـ React Native على إعداد @stripe/stripe-react-native، وورقة الدفع في صفحة دفع React Native الموجودة لديك، وعقد الجلب إلى واجهة برمجة تطبيقات PaymentIntent الخاصة بك، وتغطية اختبار iOS وAndroid، وملاحظات التسليم. تتلقى مصدر React Native في مشروعك. تعتبر رسوم Stripe وحساب Stripe الخاص بك وإنشاء واجهة خلفية جديدة منفصلة.

هل ستقوم بدمج Stripe في تطبيق React Native الموجود لدينا؟

نعم. تم تصميم Stripe Integration for React Native لمشروع React Native الموجود لديك بالفعل. نحن نلائم ورقة الدفع ونقطة إدخال الدفع في واجهة المستخدم الحالية للتنقل والخروج في React Native بدلاً من شحن تطبيق تجريبي منفصل باعتباره التسليم.

هل يتطلب تكامل Stripe لـ React Native واجهة خلفية؟

نعم لمسار React Native Stripe للإنتاج. يجب أن تكون PaymentIntents والمفتاح السري والتحقق من webhook موجودة على الخادم. يتلقى تطبيق React Native فقط مفتاحًا قابلاً للنشر وسرًا للعميل. إذا لم تكن لديك واجهة برمجة تطبيقات، فسيتم تحديد نطاق عمل الواجهة الخلفية بشكل منفصل ولا يتم افتراضه في سعر الوظيفة الإضافية React Native.

ما هي حزمة Stripe التي يستخدمها Stripe Integration لـ React Native؟

يستخدم تكامل Stripe لـ React Native @stripe/stripe-react-native، وهو React Native SDK الرسمي لـ Stripe، لأوراق الدفع وأزرار المحفظة على iOS وAndroid. نحن لا نضمّن ميزة Checkout React Native في مكون إضافي غير موثق إلا إذا طلبت ذلك صراحةً.

هل يدعم تكامل Stripe لـ React Native Apple Pay وGoogle Pay؟

نعم عندما يدعمها حساب Stripe ومعرف تاجر Apple وإعداد Google Pay والأجهزة. في React Native، تكون أزرار المحفظة نطاقًا اختياريًا. تظل ورقة دفع البطاقة على React Native هي البديل الافتراضي.

هل تم تضمين Expo في Stripe Integration لـ React Native؟

يعد كل من Expo و React Native مرشحين. نؤكد على توافق Expo SDK ومكونات التكوين الإضافية والوحدة الأصلية أثناء فحص توافق React Native. موقع React ليس هذا الهبوط - راجع تكامل Stripe لـ React.

هل يستطيع Stripe Integration لـ React Native جمع مدفوعات الاشتراك؟

يمكن لعميل React Native تأكيد PaymentIntent أو جمع طريقة الدفع من خلال ورقة الدفع. منتجات الفوترة Stripeية المتكررة وبوابة العملاء ومنطق الفاتورة مباشرة على واجهة برمجة التطبيقات (API) الخاصة بك. قد يحتاج عمل React Native الذي يتطلب اشتراكًا كبيرًا إلى عرض أسعار مخصص.

أين توجد مفاتيح Stripe القابلة للنشر والمفاتيح السرية في تطبيق React Native؟

يستخدم تطبيق React Native فقط مفتاح Stripe القابل للنشر، عادةً عبر env أو نكهة آمنة. يبقى المفتاح السري وسر التوقيع عبر الويب على الخادم. لا يضع تكامل Stripe لـ React Native مفاتيح سرية في APK أو IPA.

كيف يعمل وضع اختبار Stripe والوضع المباشر في React Native؟

نقوم بتنفيذ تكامل Stripe لـ React Native مقابل مفاتيح اختبار Stripe وبطاقات الاختبار أولاً. إن البث المباشر عبارة عن مفتاح موثق وخطاف ويب في لوحة تحكم Stripe وبيئة الخادم التي يستخدمها تطبيق React Native، وليس تنشيطًا لترخيص إضافي.

كيف يتعامل تكامل Stripe مع React Native مع 3-D Secure / SCA؟

تتعامل ورقة الدفع الأصلية من React وPaymentIntents مع الحماية ثلاثية الأبعاد من خلال @stripe/stripe-react-native. يجب أن يحافظ تطبيق React Native على تدفق الورقة حتى يُرجع Stripe الحالة النهائية؛ تكامل Stripe لأسلاك React Native تلك الحالات بشكل صريح.

هل خطافات الويب Stripeية مطلوبة من أجل الخروج من React Native؟

نعم للوفاء بعد ورقة الدفع React Native. واجهة مستخدم React Native ليست مصدر الحقيقة. تتحقق الواجهة الخلفية الخاصة بك من توقيعات Stripe webhook ثم تحدد الطلب المدفوع أو تفتح المحتوى أو تخطر بالتنفيذ.

هل يمكننا الاحتفاظ بواجهة مستخدم React Native الحالية الخاصة بنا مع Stripe؟

نعم. عادةً ما يحتفظ تكامل Stripe لـ React Native بمنتج React Native وعربة التسوق وزر الدفع ويقدم ورقة الدفع من هذا الإجراء. يعد نموذج بطاقة React Native المخصص الذي يمس بيانات PAN الأولية خارج النطاق الافتراضي لأن ورقة الدفع هي مسار PCI الأكثر أمانًا.

هل يتضمن سعر Stripe Integration لـ React Native حساب Stripe أو رسومًا؟

لا، أنت تقوم بإنشاء وامتلاك حساب Stripe ومفاتيح API ورسوم معالجة Stripe. سعر الوظيفة الإضافية React Native هو التنفيذ في مشروع React Native الخاص بك، وليس ترخيص دفع Bacodo.

هل سيحل تكامل Stripe لـ React Native محل الشراء داخل التطبيق من Apple أو Google؟

لا. غالبًا ما تظل السلع الرقمية التي يتم بيعها داخل متجر iOS أو Android تتطلب الشراء داخل التطبيق (IAP). إن تكامل Stripe لـ React Native مخصص للدفع Stripe في تطبيق React Native حيث يكون Stripe هو مسار الدفع المسموح به لنوع منتجك.

هل يمكننا تخصيص إيصالات Stripe والبيانات الوصفية في React Native؟

نعم. تتم محاذاة بيانات تعريف PaymentIntent وسجلات العملاء والحقول التي تستمر فيها بعد تأكيد خطاف الويب مع نموذج طلب تطبيق React Native الحالي أثناء تكامل Stripe لـ React Native.

ما هو دعم React Native الذي يتم تضمينه بعد تسليم Stripe؟

مصدر React Native موجود في الريبو الخاص بك، حتى يتمكن فريقك من الحفاظ عليه. يغطي الدعم المضمن لمدة 30 يومًا الأسئلة الفنية والعيوب في تكامل Stripe المقدم لنطاق React Native، وليس عمل ميزة React Native غير ذات الصلة.

كيف يتم التعامل مع تحديثات stripe-react-native أو Stripe API على React Native؟

خلال فترة الـ 30 يومًا، نساعد في حل العطل في تكامل React Native الذي تم تسليمه بسبب تغيير Stripe أو @stripe/stripe-react-native الموثق. ترقيات حزمة React Native المستمرة بعد ذلك هي الصيانة الخاصة بك، أو الدعم الفني الموسع إذا قمت بشرائها.

ماذا لو فشلت دفعات Stripe في تطبيق React Native للإنتاج؟

نقوم بتوثيق كيفية قراءة حالة PaymentIntent وسجلات Stripe Dashboard وتسليم خطاف الويب من مسار الخروج React Native. يتضمن الدعم لمدة 30 يومًا حالات رفض استكشاف الأخطاء وإصلاحها، وعمليات إسقاط الأمان ثلاثي الأبعاد، والمفاتيح التي تمت تهيئتها بشكل خاطئ لتدفق React Native الذي تم تسليمه.

ما هي إصدارات React Native المتوافقة مع Stripe Integration لـ React Native؟

نؤكد على إصدار React Native الخاص بك، وسير العمل Expo أو سير العمل المجرد، وهدف نشر iOS، وAndroid minSdk مقابل إصدار @stripe/stripe-react-native الذي نثبته في وقت التكامل. قد تحتاج أوقات تشغيل React Native الأقدم أو المتشعبة إلى نطاق إضافي.

ما هو الدعم لمدة 30 يومًا مقابل الدعم الفني الممتد لمدة 6 أشهر لتكامل Stripe لـ React Native؟

يتم تضمين 30 يومًا بعد التسليم لمسار React Native Stripe الذي تم تسليمه. يعد الدعم الفني الممتد اختياريًا بنسبة 20% من سعر الوظيفة الإضافية React Native ويغطي ستة أشهر إضافية من المساعدة الفنية على نفس تكامل React Native، وليس بناء منتج جديد.

تكامل Stripe لـ React Native

أضف دفعات Stripe الجاهزة للإنتاج إلى تطبيق React Native الموجود لديك، واحتفظ بكود المصدر، واحتفظ بالأسرار في واجهة برمجة التطبيقات (API) الخاصة بك.

$145