CloudPayments React Native SDK

Мощный и простой в использовании SDK для интеграции платежей CloudPayments в React Native приложения

📖 Документация • 🚀 Быстрый старт • 💳 Способы оплаты • 🔧 API

✨ Возможности

• 💳 Платежная форма — готовая к использованию форма оплаты
• 🔒 Безопасность — шифрование данных карт и соответствие PCI DSS
• 📱 Нативная интеграция — полная поддержка iOS и Android
• 🎨 Кастомизация — гибкие настройки внешнего вида
• ⚡ TypeScript — полная типизация для лучшего DX
• 🌐 Альтернативные способы оплаты — Apple Pay, Google Pay, Tinkoff Pay, СБП, SberPay

💳 Способы оплаты

| Способ оплаты | iOS | Android | Описание | | ------------------- | --- | ------- | ---------------------------------- | | 💳 Банковские карты | ✅ | ✅ | Visa, MasterCard, МИР | | 🍎 Apple Pay | ✅ | ❌ | Быстрая оплата через Touch/Face ID | | 🤖 Google Pay | ❌ | ✅ | Быстрая оплата через Google | | 🏦 Tinkoff Pay | ✅ | ✅ | Оплата через приложение Тинькофф | | ⚡ СБП | ✅ | ✅ | Система быстрых платежей | | 🟢 SberPay | ✅ | ✅ | Оплата через Сбербанк Онлайн |

🚀 Быстрый старт

1. Установка

npm install @lmapp/react-native-cloudpayments
# или
yarn add @lmapp/react-native-cloudpayments

2. Установка зависимостей

# iOS
cd ios && pod install && cd ..

# Android - автолинковка работает автоматически

3. Использование

import React from 'react';
import { Button, Alert } from 'react-native';
import { usePaymentForm, PaymentService } from '@lmapp/react-native-cloudpayments';

// Инициализация SDK
await PaymentService.init('pk_test_your_public_id');

const PaymentScreen = () => {
  const presentPaymentForm = usePaymentForm('pk_test_your_public_id');

  const handlePayment = async () => {
    try {
      const result = await presentPaymentForm({
        amount: '1000.00',
        currency: 'RUB',
        description: 'Покупка товара',
        email: '[email protected]'
      });

      if (result.success) {
        Alert.alert('Успех!', `Платеж прошел! ID: ${result.transactionId}`);
      } else {
        Alert.alert('Ошибка', result.message);
      }
    } catch (error) {
      Alert.alert('Ошибка', 'Произошла ошибка при обработке платежа');
    }
  };

  return <Button title="Оплатить 1000 ₽" onPress={handlePayment} />;
};

📋 Требования

• React Native: 0.70.0+
• iOS: 12.0+
• Android: API level 21 (Android 5.0)+
• Node.js: 16.0+

🔧 API

PaymentService

// Инициализация SDK
await PaymentService.init('pk_test_your_public_id');

// Запуск платежной формы
const result = await PaymentService.presentPaymentForm({
  amount: '1000.00',
  currency: 'RUB',
  description: 'Покупка товара',
});

usePaymentForm Hook

const presentPaymentForm = usePaymentForm('pk_test_your_public_id');

const result = await presentPaymentForm({
  amount: '1000.00',
  currency: 'RUB',
  description: 'Покупка товара',
});

События

import {
  eventEmitter,
  EPaymentFormEventName,
} from '@lmapp/react-native-cloudpayments';

eventEmitter.addListener(EPaymentFormEventName.PAYMENT_FORM, (event) => {
  switch (event.action) {
    case 'willDisplay':
      console.log('Форма готовится к показу');
      break;
    case 'transaction':
      if (event.statusCode) {
        console.log('Платеж успешен:', event.transactionId);
      }
      break;
  }
});

🧪 Тестирование

Тестовые карты

| Номер карты | Результат | CVV | Срок | | --------------------- | --------------- | ----- | ------- | | 4111 1111 1111 1111 | Успешный платеж | 123 | 12/25 | | 4000 0000 0000 0002 | Отклонен банком | 123 | 12/25 | | 4000 0000 0000 0077 | Требует 3DS | 123 | 12/25 |

⚠️ Важно: Используйте тестовый Public ID (начинается с pk_test_) для разработки!

📱 Настройка платформ

Android

1. Минимальная версия: API level 21
2. Network Security Config: Настройте для CloudPayments домена
3. ProGuard: Добавьте правила для CloudPayments SDK

Подробнее: 📖 Настройка Android

iOS

1. Минимальная версия: iOS 12.0
2. Apple Pay: Настройте Merchant ID в Xcode
3. URL Schemes: Добавьте схемы для банковских приложений

Подробнее: 📖 Настройка iOS

🔑 Получение ключей

1. Зарегистрируйтесь на cloudpayments.ru
2. Войдите в личный кабинет
3. Перейдите в Настройки → API
4. Скопируйте ваш Public ID

📚 Документация

• 📖 Полная документация
• 🚀 Быстрый старт
• 📱 Настройка платформ
• 💳 Использование
• 💳 Использование платежной формы

🤝 Поддержка

• 📖 Документация CloudPayments
• 💬 Telegram чат
• 🐛 GitHub Issues
• 📧 Техподдержка

📄 Лицензия

MIT License. См. LICENSE для деталей.

👨‍💻 Автор

Создано Leonid Molchanov (@leonidmolchanov) как независимый open-source проект для интеграции с платежной системой CloudPayments.

🙏 Благодарности

• CloudPayments за отличный платежный API
• React Native сообщество
• Всем контрибьюторам проекта

📄 Лицензия

MIT License - свободная лицензия с открытым исходным кодом.

Вы можете свободно использовать, изменять и распространять этот код в коммерческих и некоммерческих проектах. См. LICENSE для деталей.

Сделано с ❤️ Leonid Molchanov для React Native разработчиков

⭐ Поставьте звезду на GitHub • 📖 Документация

🚀 Автоматическая система релизов: Этот пакет использует автоматизированную систему релизов с conventional commits.