مقارنة بين طرق الدفع في Stripe مع Flutter

أثناء شغلي على Stripe Payments في Flutter جرّبت 3 طرق مختلفة للدفع، وحبيت أبسط الفكرة لأن الموضوع بيكون مُربك شوية في البداية خصوصًا لما تقرأ عن: Tokens PaymentMethods PaymentIntents PaymentSheet

قبل البداية: إعداد flutter_stripe

قبل ما نستخدم أي طريقة من الطرق دي، لازم نتأكد إننا ضايفين الباكدج وعاملين تهيئة (Initialization) لمفتاح Stripe العام في ملف main.dart:

main.dart

void main() async {
  WidgetsFlutterBinding.ensureInitialized();
  
  // ضيف الـ Publishable Key بتاعك هنا
  Stripe.publishableKey = 'pk_test_YOUR_KEY';
  await Stripe.instance.applySettings();
  
  runApp(MyApp());
}

مقارنة بين الـ 3 طرق الأساسية

1 Token Flow Legacy (قديم)

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

// 1. Get token in Flutter
final token = await Stripe.instance.createToken(...);
// Returns: tok_xxxxxxxxx

بعدها الـ token بيتبعت للـ backend، والـ backend يستخدمه لتنفيذ عملية الدفع.

العيوب

Stripe مبقاش بيفضلها
الأمان فيها أقل من الطرق الجديدة
لا تدعم الـ 3D Secure بسهولة

2 PaymentMethod Flow Custom UI (تحكم كامل)

في الـ flow ده المستخدم بيدخل بيانات الكارت داخل التطبيق في UI انت اللي مصممه بالكامل.

// 1. Create Payment Method
final paymentMethod = await Stripe.instance.createPaymentMethod(...);
// Returns: pm_xxxxxxxxx

بعدها بتبعت الـ paymentMethodId للـ backend، والـ backend بيبدأ يكمل عملية الدفع باستخدام PaymentIntent أو SetupIntent.

المميزات والاستخدام

تحكم كامل 100% في الـ UI بتاعك
مناسبة لـ Saved Cards
مناسبة لنظام الـ Subscriptions

التحديات

بتحتاج Handling للـ Error بشكل يدوي
مجهود أكبر في كتابة الكود

3 PaymentSheet + PaymentIntent Recommended (الأفضل)

ودي الطريقة اللي Stripe بيوصي بيها حاليًا لمعظم التطبيقات، لأنها بتوفرلك واجهة جاهزة وآمنة تماماً. الخطوات بتتقسم بين الـ Backend والـ Flutter.

1. دور الـ Backend

بيعمل طلب للـ Stripe API ويرجع المفتاح السري:

POST /v1/payment_intents
-> client_secret

2. دور Flutter

بيستخدم المفتاح ده عشان يفتح واجهة الدفع:

await Stripe.instance.initPaymentSheet(
  paymentIntentClientSecret: secret
);
await Stripe.instance.presentPaymentSheet();

ليه دي الطريقة الأفضل؟ (Stripe بيتولى كل حاجة)

Payment UI جاهز وتفاعلي حماية 3D Secure جاهزة دعم Apple/Google Pay مدمج Error Handling ذكي دعم Dark/Light Mode تلقائي

الخلاصة

لو لسه بتبدأ أو محتاج تنجز الدفع بسرعة وبشكل احترافي وآمن، استعمل PaymentSheet. هيوفر عليك وقت كبير جدًا في التطوير، وهيخليك تتجنب مشاكل توافقية الحماية مثل 3D Secure لأن Stripe متكفل بيها كلها.

أما لو تطبيقك بيطلب تصميم فريد 100% لواجهة إدخال البطاقة، وقتها اتجه للـ PaymentMethod، لكن ابعد تماماً عن الـ Token Flow القديم.