PaySelection PayApp SDK позволяет интегрировать прием платежей в мобильное приложение для платформы React Native.
Возможности SDK:
- Одностадийная операция оплаты;
- Получение статуса транзакции по TransactionId;
- Получение информации о текущем статусе по идентификатору заказа orderId.
Перед установкой необходимо убедиться, что версия Node 18 и выше.
Note: Убедитесь, что вы завершили настройку окружения React Native - Environment Setup до шага "Creating a new application", перед тем как начать.
# using npm
npm install payselection-pay-app-sdk-reactnative
# using yarn
yarn add payselection-pay-app-sdk-reactnative
В зависимости от типа оплаты создайте экземпляр структуры TokenBasedPayment
, QRCodePayment
или CryptogramPayment
с информацией о транзакции и данными карты, передав туда customerInfo, если требуется.
Внимание! Необходимо валидировать передаваемые данные, иначе сервер вернет ошибку. Подробнее о форматах можно прочесть в документации Payselection API.
import { TokenBasedPayment, QRCodePayment, CryptogramPayment } from 'payselection-pay-app-sdk-reactnative/src/types/payment/paymentPayload.ts';
export const tokenBasedPayment: TokenBasedPayment = {
OrderId: "", // Уникальный номер заказа
Amount: "10",
Currency: "RUB",
Description: "test payment",
RebillFlag: false,
CustomerInfo: {
Email: "[email protected]",
Phone: "+19991231212",
Language: "en",
Address: "string",
Town: "string",
ZIP: "string",
Country: "USA",
IP: "10.0.2.56"
},
PaymentMethod: "Token",
PaymentDetails: {
Type: "Yandex",
PayToken: "eyJzaWduZWRNZXNzYWdlIjoie1wiZW5jcnlwdGVkTWVzc2FnZVwiOlwiMXljbzNsbkl4cTRFRUZ0eEF3TnNOaGxKbTJSdXJ0dG9tOGloYkNuMjR6WkVUOW5oeGkyV0M0WmZzdDhmMklSb3AxbXN1Y2o4TTZYTTFKNWlPdG9VRExCTGtlWHlxQzJIVWFpOGVrR29BYjFQY1RUSWZFcHM4OEZRK1BTUis2RjduTEFpU25IUUJ0d3QvSGE0SE5ORVlBdkdQQXEvSHFNMldyb1FXK2k3ZkVUbGxkU25xazE4WkFyeDc4dW9FQWVOYW9OYThGbXhnU2tNUCt6Q2Q1ZWowdWpaNUd5RjhNVWtNVjFSL3liRzJmZHR1bktMTzZRbkVZc0pkblhEN3pGTEIrZkJQUjR5UktYZTRqV3FkbnpqUUY1WkZnSHZBQTZINnhFTFlzVmZsc1pJVndFbGtNRzFBTWI0MWJDMVY5enpcIixcImVwaGVtZXJhbFB1YmxpY0tleVwiOlwiQkVQQkxlczhLWWp2WCtYem13Z3h3QithL2JYYSs0ZUdvSWF3eFRpeTlQcHRpOXcrTUtPdDRxSHFaNmNGcmFhcFY4Q3dwT29KWEVrTE1ZQVhRUjRsMDFFPVwifSIsIml2IjoiZWJ2SVg5TzBwVnRTZ21QNGFqcnd2UT09IiwidGFnIjoiNVE2cWNGRHg3L0NEaXZscHRVbDh2Umo4RFFWZUxHRGZ5UlV3UTdJa0tsMD0ifQ=="
}
}
Перед тем как использовать getStatusApi
необходимо сгенерировать уникальную подпись запроса. Для этого необходимо создать интерфейс типа SignatureProps
и вызвать метод signatureGeneration
для генерации подписи запроса:
import { SignatureProps, signatureGeneration } from 'payselection-pay-app-sdk-reactnative/src/utils/common.ts';
const signaturePayment: SignatureProps = {
requestMethod: 'POST', // Request method (Метод запроса)
url: 'https://example.com', // URL (Адрес запроса)
xSiteId: '99999', // X-SITE-ID (Находится в личном кабинете мерчанта, в разделе “Сайты”, параметр ID сайта)
xRequestId: 'Tkrdjvb87630Uegp', // X-REQUEST-ID (Генерируется на стороне мерчанта)
siteSecretKey: 'jdPnu3LKGnBqShN3', // Cекретный ключ или публичный ключ
requestBody: tokenBasedPayment, // Request body (Тело запроса)
}
const signature = signatureGeneration(signaturePayment);
Создания заголовка для метода оплаты paymentApi.publicPay
:
import { PublicPayHeader } from 'payselection-pay-app-sdk-reactnative/src/types/payment/paymentPayload.ts';
const payHeader: PublicPayHeader = {
X_SITE_ID: '99999',
X_REQUEST_ID: 'Tkrdjvb87630Uegp', // X_REQUEST_ID должен быть уникальным
}
Для получения Value необходимо вызвать функцию getCryptogramValue
const data: cryptogramValueProps = {
TransactionDetails: {
Amount: "100", //важно, чтобы совпадало с параметром из запроса
Currency: "RUB" //важно, чтобы совпадало с параметром из запроса
},
PaymentDetails: {
CardholderName: "TEST CARD",
CardNumber: "4111111111111111",
CVC: "123",
ExpMonth: "12",
ExpYear: "24"
},
PaymentMethod: "CryptogramRSA", //важно указать PaymentMethod
MessageExpiration: Date.now() + 86400000, //timestamp в миллисекундах
}
const key = '042bd71a17fd5a1627b3dced4f28513e5cf69add379aad0f6d583ed1caab9c744ad98e2f187dc3ef202dfc8356aaaadb505a36306577338657c5bce993fd687049';
const valuу = getCryptogramRSAValue(data, key);
Для упрощения генерации данных для методов оплаты PaymentMethod: 'Cryptogram'
и PaymentMethod: 'CryptogramRSA'
можно воспльзоваться методом createCryptogramPayment()
.
import paymentApi from 'payselection-pay-app-sdk-reactnative/src/api/payment.ts';
const result = await paymentApi.publicPay(tokenBasedPayment, payHeader);
Используется тот же метод, что и для paymentApi
.
В зависимости от используемого запроса необходимо создать заголовок подходящего типа (GetStatusByOrderIdHeader
для getStatusApi.getStatusByOrderId
, GetStatusByTransactionIdHeader
для getStatusApi.getStatusByTransactionId
).
Ниже приведен пример создания заголовка для запроса на getStatusApi.getStatusByOrderId:
import { GetStatusByOrderIdHeader, GetStatusByTransactionIdHeader } from 'payselection-pay-app-sdk-reactnative/src/types/status/statusPayload.ts';
const getStatusByOrderIdHeader: GetStatusByTransactionIdHeader = {
X_SITE_ID: '99999',
X_REQUEST_ID: 'Tkrdjvb87630Uegp', // X_REQUEST_ID должен быть уникальным
X_REQUEST_SIGNATURE: signature, // Сгенерированная подпись запроса с данными для получения статуса транзакции
}
import getStatusApi from 'payselection-pay-app-sdk-reactnative/src/api/status';
// Для получения информации по `orderId`
const result = await getStatusApi.getStatusByOrderId(orderId, getStatusByOrderIdHeader);
// Для получения информации по `TransactionId`
const result = await getStatusApi.getStatusByTransactionId(transactionId, getStatusByTransactionIdHeader);
По возникающим вопросам техничечкого характера обращайтесь на [email protected]