Project

General

Profile

History

Add-payments-fron-end » History » Revision 7

Revision 6 (Dmitry Vasilev, 11/21/2025 10:50 AM) → Revision 7/9 (Dmitry Vasilev, 11/21/2025 10:50 AM) 

# Инструкция фронтенд-разработчикам 

 Как создавать Payment Methods через Stripe для нашего приложения 
 📌 Цель 

 Пассажир должен добавить свою карту, чтобы мы могли: 

 - безопасно сохранять карту (Stripe vault) 
 - автоматически списывать деньги после поездки (off-session) 
 - проводить SCA-подтверждение (3D-Secure) 

 Для этого используется SetupIntent + Stripe Elements. 

 ### 1️⃣ Шаг 1. Запросить SetupIntent с бэкенда 

 **Дергаем ручку "Create setup intent object" - POST /api/payments/setup_intents** 

 Получаем  

 ``` 
 { 
     "data": { 
         "id": "seti_1SUmTQK65qfXWkSiVIM19pAC", 
         "client_secret": "seti_1SUmTQK65qfXWkSiVIM19pAC_secret_TRfp4egUtC6WlqSvYDjYruElmCEFjez", 
         "payment_method_types": [ 
             "card" 
         ], 
         "account_id": "0cf6a16f-6492-4190-842b-f1563e7e3d7b", 
         "user_id": "5f0d292c-f3f7-4a2a-b129-a1d0761cfb12", 
         "stripe_account_id": null 
     }, 
     "status": true 
 } 
 ``` 

 client_secret нужен фронту, чтобы вызвать Stripe.confirmCardSetup(). 

 ### 2️⃣ Шаг 2. Инициализация Stripe на фронте 

 ``` 
 import { loadStripe } from '@stripe/stripe-js'; 

 const stripe = await loadStripe(PUBLIC_STRIPE_KEY); 
 ```