react-native实现支付宝支付_淡淡蓝蓝_react 支付宝支付

网络 02-07 2525

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('支付成功'); })

至此，支付宝支付完成