近期在RN项目中集成支付宝App支付(v2.0接口)时,选用第三方模块react-native-alipay-payment(项目地址:Dirinkbottle/react-native-alipay-payment: An npm package that integrates Alipay payments, eliminating your native integration),因其封装了原生集成逻辑,支持回调处理与完善错误机制。以下是客户端接入指南(服务端生成签名字符串 orderStr 的流程需参考支付宝官方文档):​app支付接口2.0 - 支付宝文档中心

1. 安装和导入模块

bash

//安装
npm install react-native-alipay-payment --save
javascript
//导入
​import AlipayPayment from 'react-native-alipay-payment';

2. Android权限配置​(部分权限需动态申请)xml
<uses-permission android:name="android.permission.INTERNET" />
<uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE" />
<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />
<!-- 以下权限按需添加 -->
<uses-permission android:name="android.permission.ACCESS_WIFI_STATE"/>
<uses-permission android:name="android.permission.READ_PHONE_STATE" />
<uses-permission android:name="android.permission.ACCESS_FINE_LOCATION" />
<uses-permission android:name="android.permission.ACCESS_COARSE_LOCATION" />

3. 核心API说明
(1)环境配置
 

javascript

//设置debug模式,会输出debug信息,需要结合logcat来看
AlipayPayment.setDebugMode(true)

// 沙箱模式(仅测试用)
AlipayPayment.setSandboxMode(true)
  .then(() => console.log('切换至沙箱环境'))
  .catch(error => console.error('环境切换失败', error));

// 正式环境
AlipayPayment.setSandboxMode(false); 

// 查询环境状态
AlipayPayment.isSandboxEnabled()
  .then(isEnabled => console.log(`当前环境:${isEnabled ? '沙箱' : '正式'}`));
(2)支付宝安装检测
 

javascript

AlipayPayment.isAlipayInstalled()
  .then(installed => installed 
    ? console.log('支付宝已安装') 
    : console.warn('未检测到支付宝,请引导用户安装')
  );
(3)支付调用(orderInfo需服务端生成
 

javascript

// 基础支付
AlipayPayment.pay(orderInfo)
  .then(result => {
    const status = result.resultStatus;
    if (AlipayPayment.isPaymentSuccess(status)) {
      console.log("支付成功");
    } else {
      console.error(`支付失败:${AlipayPayment.getPaymentMessage(status)}`);
    }
  });

// 简化支付(推荐)
AlipayPayment.payWithResult(orderInfo)
  .then(result => {
    if (result.success) console.log("支付成功");
    else if (result.cancelled) console.log("用户取消");
    else if (result.processing) console.log("处理中");
    else console.error(`支付失败:${result.message}`);
  });
(4)支付状态码参考
状态码含义
9000支付成功
8000处理中
4000支付失败
6001用户取消
6002网络错误
6004未知错误

4. 注意事项
  1. 支付状态管理
    模块自动管理支付状态,通常无需手动重置。特殊场景(如状态异常)可使用:

     

    javascript

    AlipayPayment.resetPaymentState().then(...);
  2. 结果通知机制

    • SDK会同步返回支付结果至客户端(通过payWithResult回调)。
    • 支付宝服务器会异步通知服务端​(需后端配置回调接口),建议结合两种结果验证支付状态
Logo

开源鸿蒙跨平台开发社区汇聚开发者与厂商,共建“一次开发,多端部署”的开源生态,致力于降低跨端开发门槛,推动万物智联创新。

更多推荐