1 В избранное 0 Ответвления 0

OSCHINA-MIRROR/uiw-react-native-alipay

Присоединиться к Gitlife
Откройте для себя и примите участие в публичных проектах с открытым исходным кодом с участием более 10 миллионов разработчиков. Приватные репозитории также полностью бесплатны :)
Присоединиться бесплатно
Это зеркальный репозиторий, синхронизируется ежедневно с исходного репозитория.
Клонировать/Скачать
Внести вклад в разработку кода
Синхронизировать код
Отмена
Подсказка: Поскольку Git не поддерживает пустые директории, создание директории приведёт к созданию пустого файла .keep.
Loading...
README.md

React Native Alipay — это основанный на React Native плагин для оплаты через Alipay, который поддерживает iOS и Android. Он подходит для интеграции платёжных функций Alipay в приложения для бизнеса.

Плагин позволяет приложениям для бизнеса интегрировать платёжный функционал Alipay. Если пользователь уже установил приложение Alipay, то приложение для бизнеса перенаправит его в Alipay для совершения платежа. После завершения платежа пользователь будет возвращён в приложение для бизнеса, где будет показан результат платежа. Если у пользователя не установлено приложение Alipay, приложение для бизнеса запустит веб-страницу для совершения платежа, где пользователь сможет войти в свой аккаунт Alipay и совершить платёж.

Особенности:

  • Поддержка версий операционной системы Android 2.3 и выше.
  • Поддержка iOS 6.0 и выше.
  • Поддерживаемые операционные системы: iOS (Apple) и Android (Google).
  • Для отладки необходимо убедиться, что приложение прошло проверку в Alipay.
  • Необходим доступ к платформе управления Alipay — Open Platform — для подписания функций «APP Payment» и «APP Alipay Login».
  • Не рекомендуется использовать версию ниже 0.60 для React Native.
  • Последняя версия Alipay SDK — 15.7.7.
  • Схемы URL должны начинаться с буквы, а не с цифры.

Для установки плагина выполните следующие шаги:

yarn add @uiw/react-native-alipay
# react-native version >= 0.60+
$ cd ios && pod install

API:

Alipay.alipay(payInfo: string): Promise — метод для совершения платежа через Alipay. Обратите внимание, что возвращаемый результат представляет собой строку. Платёжная система Alipay требует настройки схем URL (URL Schemes), чтобы обеспечить поддержку платежей и функцию возврата в приложение (см. раздел «Платежи через Alipay»).

Пример использования:

import Alipay from '@uiw/react-native-alipay';

// Настройка схем URL для Alipay, которые должны быть уникальными. Можно использовать bundle Identifier.
// Схема = «alipay» + APPID, где APPID — идентификатор приложения, предоставленный Alipay разработчику.
Alipay.setAlipayScheme(scheme);

async function aliPay() {
  // Платёж через Alipay
  const payInfo = 'alipay_sdk=alipay-sdk-java-dynamicVersionNo&app_id=2021001172656340&biz_content=%7B%22out_trade_no%22%3A%221111112222222%22%2C%22total_amount%22%3A%220.01%22%2C%22subject%22%3A%221234%22%2C%22product_code%22%3A%22QUICK_MSECURITY_PAY%22%7D&charset=UTF-8&format=json&method=alipay.trade.app.pay&notify_url=http%3A%2F%2Fane.boshu.ltd%2Fowner%2Fpay%2Fapi%2FownerPay%2Fcallback&sign=oUQmGtkv8mrhJ0YwHl9%2FfxMcoLACWuSFKiMTC4Id8nc%2FZVvDQ6MLQq5hhtEN03Qn1%2BAtzTAaofE8nNixdroxOek2l5YtOAcYcXVYlJIyogN%2B22erN2NpDTWJ7tQTKgYFDJLRiG0DZJaxfADhUUF6UR9kdA8omoXKLDlP17ZPUs5Jr4aKv5HJtH5C53ui7PbmyWYg934L4UDC2F%2F9pPQlRwwDeE1SAaV3HW9Dt83kK52o8%2FlChXdotbFdAvH0d4qYGhpEYU5sepj9xiOMyL9aC4pMXW9INYLLGbvtqtlRchZTAfH5yji6nqqQm9KKMmcVrWdBDLyjFVNpejq1UjbJBw%3D%3D&sign_type=RSA2&timestamp=2020-07-09+12%3A16%3A16&version=1.0';
  const resule = await Alipay.alipay(payInfo);
  console.log('alipay:resule-->>>', resule);
}
``` **Текст запроса:**

```json
{ 
  "result": "{\"alipay_trade_app_pay_response\":{\"code\":\"10000\",\"msg\":\"Success\",\"app_id\":\"2021001172656340\",\"auth_app_id\":\"2021001172656340\",\"charset\":\"UTF-8\",\"timestamp\":\"2020-07-08 21:30:14\",\"out_trade_no\":\"123123213123214\",\"total_amount\":\"0.01\",\"trade_no\":\"2020070822001414841426413774\",\"seller_id\":\"2088421915791034\"},\"sign\":\"LY7wCsNLp+QnDqCq6VelY/RvyK7ZGY8wsXoKvS+Or7JjONLDUx5P6lDgqRKkpkng7br3y6GZzfGKaZ88Tf4eMnBMKyqU+huR2Um47xUxP383njvHlxuQZsSTLQZRswy4wmb/fPkFfvyH6Or6+oj0eboePOTu63bNr+h03w0QnP4znuHpfRuoVgWpsYh/6B1DL+4xfWRKJ21zm1SV9Feo9RWqnyTaGZyFVi6IKge0dUCYs9hXju95fOUVUOx5YflOFtSEnZafY9Ls4FCRQE1ANkjaKiKIE0+c4c4sEVEf/9Dwh88N+aSQOoLT+AV4RpjMoA8hF2k+vv2OKNeqr6SYGQ==\",\"sign_type\":\"RSA2\"}",
  "resultStatus": "9000",
  "memo": ""
}

Перевод текста на русский язык:

{
  «результат»: {
    «alipay_trade_app_pay_response»: {
      «код»: «10000»,
      «сообщение»: «Успех»,
      «app_id»: «2021001172656340»,
      «auth_app_id»: «2021001172656340»,
      «кодировка»: «UTF-8»,
      «метка времени»: «20200708 21:30:14»,
      «out_trade_no»: «123123213123214»,
      «общая сумма»: «0,01»,
      «trade_no»: «2020070822001414841426413774»,
      «seller_id»: «2088421915791034»
    },
    «подпись»: «LY7wCsNLp+QnDqCq6VelY/RvyK7ZGY8wsXoKvS+Or7JjONLDUx5P6lDgqRKkpkng7br3y6GZzfGKaZ88Tf4eMnBMKyqU+huR2Um47xUxP383njvHlxuQZsSTLQZRswy4wmb/fPkFfvyH6Or6+oj0eboePOTu63bNr+h03w0QnP4znuHpfRuoVgWpsYh/6B1DL+4xfWRKJ21zm1SV9Feo9RWqnyTaGZyFVi6IKge0dUCYs9hXju95fOUVUOx5YflOFtSEnZafY9Ls4FCRQE1ANkjaKiKIE0+c4c4sEVEf/9Dwh88N+aSQOoLT+AV4RpjMoA8hF2k+vv2OKNeqr6SYGQ==»,
    «тип подписи»: «RSA2»
  },
  «resultStatus»: «9000»,
  «памятка»: ""
}
``` **Алипэй.гетВэрсион();**

**консоль.лог('версия:', версия);**}

支付宝 возвращает приложение iOS настройки

  • ⚠️ На Android не нужно ничего настраивать.
  • ⚠️ Если пользователь переходит из приложения 支付宝App в приложение продавца, то это происходит через системную функцию переключения, а не через функциональную клавишу приложения 支付宝APP, которая возвращает пользователя в приложение продавца, функция обратного вызова не работает. Можно использовать AppState.addEventListener, чтобы отслеживать события и запрашивать фоновый API для оптимизации этого взаимодействия с пользователем.
  1. В коде установите схемы Алипэй (URL Schemes) (https://github.com/uiwjs/react-native-alipay/blob/74140a294e850884ed1851b9d2c2d2c00ee75003/example/App.js#L7). Пример uiwjspay — это определённая схема, вы также можете определить её как алипэй + appid, где appid — это идентификатор приложения, предоставленный Алипэй разработчику, который используется для уникальности схемы.
Alipay.setAlipayScheme('uiwjspay');
  1. При запросе оплаты payInfo (https://github.com/uiwjs/react-native-alipay/blob/74140a294e850884ed1851b9d2c2d2c00ee75003/example/App.js#L11) должен содержать return_url=uiwjspay:// (https://github.com/uiwjs/react-native-alipay/blob/74140a294e850884ee7c6f282f7f39f992e0932b/example/App.js#L11), значение которого равно определённой схеме => uiwjspay://, тогда будет возвращён результат состояния оплаты заказа Алипэй (https://opendocs.alipay.com/open/204/105301#%E8%BF%94%E5%9B%9E%E7%BB%93%E6%9E%9C%E7%A4%BA%E4%BE%8B%EF%BC%88iOS%7CAndroid%EF%BC%89).
// payInfo — это параметры оплаты, которые были объединены на бэкэнде, этот параметр должен включать `return_url=uiwjspay://`.
Alipay.alipay(payInfo, (res)=>console.log(res))
  1. Используемые схемы URL должны быть включены в белый список в ios/<имя приложения>/Info.plist (https://github.com/uiwjs/react-native-alipay/blob/74140a294e850884ed1851b9d2c2d2c00ee75003/example/ios/example/Info.plist#L23-L41).
<key>LSApplicationQueriesSchemes</key>
<array>
  <string>алипэй</string>
</array>
<key>CFBundleURLTypes</key>
<array>
  <dict>
    <key>CFBundleTypeRole</key>
    <string>Редактор</string>
    <key>CFBundleURLName</key>
    <string></string>
    <key>CFBundleURLSchemes</key>
    <array>
      <string>uiwjspay</string>
    </array>
  </dict>
</array>
  1. Измените ios/<имя приложения>/AppDelegate.m (https://github.com/uiwjs/react-native-alipay/blob/74140a294e850884ed1851b9d2c2d2c00ee75003/example/ios/example/AppDelegate.m#L60-L70), добавив следующий код:
#import <React/RCTLinkingManager.h>

- (BOOL)application:(UIApplication *)application openURL:(NSURL *)url sourceApplication:(NSString *)sourceApplication annotation:(id)annotation
{
  return [RCTLinkingManager application:application openURL:url
                      sourceApplication:sourceApplication annotation:annotation];
}

- (BOOL)application:(UIApplication *)application openURL:(NSURL *)url options:(NSDictionary<UIApplicationOpenURLOptionsKey, id> *)options
{
  return [RCTLinkingManager application:application openURL:url options:options];
}

Команда тестирования

— iOS: xcrun simctl openurl booted uiwjspay:// — Android: adb shell am start -W -a android.intent.action.VIEW -d "uiwjspay://test/router" com.uiwjspay

Обработка ошибок

[NetworkInfo] Signal strength query returned error: Error Domain=NSPOSIXErrorDomain Code=13 "Permission denied", descriptor: <CTServiceDescriptor 0x283317100, domain=1, instance=1>

В Product -> Scheme -> Edit Scheme -> Run -> Arguments -> Environment Variables добавьте OS_ACTIVITY_MODE disable.

Прочее

Текущий проект основан на @brodybits/create-react-native-module для инициализации.

npx create-react-native-module --package-identifier com.uiwjs --object-class-name RNAlipay --generate-example Alipay --example-react-native-version 0.63.0 --module-name @uiw/react-native-alipay --github-account uiwjs --author-name "Kenny Wong" --author-email "wowohoo@qq.com"

Разработка

cd example   # Перейдите в каталог примера проекта, корневой каталог не требует установки, иначе возникнет ошибка.
yarn install # Установите зависимости.

cd ios     # Перейдите в каталог ios проекта для установки зависимостей.
pod instll # Установите зависимости.

Связанные ссылки

Комментарии ( 0 )

Вы можете оставить комментарий после Вход в систему

Введение

Описание недоступно Расширить Свернуть
MIT
Отмена

Обновления (1)

все
3 месяцев назад

Участники

все

Недавние действия

Больше нет результатов для загрузки
1
https://gitlife.ru/oschina-mirror/uiw-react-native-alipay.git
git@gitlife.ru:oschina-mirror/uiw-react-native-alipay.git
oschina-mirror
uiw-react-native-alipay
uiw-react-native-alipay
master