react-native实现支付宝支付_react native 支付宝支付

1、先去支付宝开放平台   ，创建应用，配置应用，开发配置，上线应用，签约等一系列操作，然后等就行了，待官方审核通过后，就开始使用支付功能了

2、集成SDK

（1）下载SDK包到本地集成

https://gitee.com/wx_7d3302a1e9/alipay-sdk/tree/master/

将libs下的SDK包，放到项目android/app/libs这个目录下，如果没有这个目录，手动创建一个

 还有一个lib拷贝到java的com文件夹下

在主应用中引入该包

 在android/app/build.gradle添加依赖

 至此，第一种集成方式完成了

（2）直接在线引入

目前 SDK 已发布到 Maven Central，开发者可使用 gradle 编译、更新支付宝支付 SDK。

在 app下build.gradle 文件中，需添加如下依赖即可：

dependencies {

  api 'com.alipay.sdk:alipaysdk-android:+@aar'

}

具体参考：App 支付客户端 DEMO&SDK ｜ 网页&移动应用

3、页面使用

SDK集成后，下面讲解页面如何使用

首先获取支付的签名，其次获取订单信息，最后调SDK里面的支付接口

（1）获取支付的签名

export const APPID = '你的APPID';
export const APP_PRIVATE_KEY = '你的应用私钥';
export const PID = '合作伙伴id';
export const notifyAliUrl = '支付回调url,是个后端接口';
export const aliBody = 'test';//随意写

let biz_content = {
  out_trade_no:tradeNo, //随机生成，不重复即可
  subject:"test", //自己定义
  total_amount:payFee, //金额，单位是元
  product_code:"QUICK_MSECURITY_PAY"
}
let time = new Date().Format("yyyy-MM-dd hh:mm:ss");
let stringA = `app_id=${APPID}&biz_content=${JSON.stringify(biz_content)}&charset=utf-8&format=json&method=alipay.trade.app.pay&notify_url=${notifyAliUrl}&sign_type=RSA2&timestamp=${time}&version=1.0`;
console.log('sss---',stringA);
let sign =  getBase64EncryptedParams(stringA,APP_PRIVATE_KEY); //实现RSA2签名

其中getBase64EncryptedParams方法如下：

function getBase64EncryptedParams(params,privateKey){
  let forge = require('node-forge');
  let private_key = '-----BEGIN RSA PRIVATE KEY-----\n' + privateKey+' \n-----END RSA PRIVATE KEY-----';
  let pki = forge.pki;
 let privateKey1 = pki.privateKeyFromPem(private_key);
  let md = forge.md.sha256.create();
  md.update(params, 'utf8');
  let signature = forge.util.encode64(privateKey1.sign(md));
  console.log(signature);
  return signature;
}

需要npm install node-forge --save

(2)至此，支付签名sign生成成功，下面是获取订单信息

//对所有的value进行utf-8编码，包括上面生成的签名sign
 const appId = encodeURIComponent(APPID,'utf-8');
 const bizContent = encodeURIComponent(JSON.stringify(biz_content),'utf-8');
 const notifyUrl = encodeURIComponent(notifyAliUrl,'utf-8');
 const time1 = encodeURIComponent(time,'utf-8');
 const sign1 = encodeURIComponent(sign,'utf-8');
 const notifyUrl1 = encodeURIComponent(notifyAliUrl,'utf-8');
 const orderInfo = `app_id=${appId}&biz_content=${bizContent}&charset=utf-8&format=json&method=alipay.trade.app.pay&notify_url=${notifyUrl1}&sign_type=RSA2&timestamp=${time1}&version=1.0&sign=${sign1}`;
 return orderInfo;

(3)下面调支付接口

import {NativeModules} from 'react-native';

NativeModules.PayModule.alipay(orderInfo,(res)=>{
  console.log(res);
  Toast.message('支付成功');
})

至此，支付宝支付完成