之前把微信支付写了一下，今天再把支付宝支付总结一下。
首先在项目更目录输入：
npm install @0x5e/react-native-alipay --save
Android集成
1、在MainApplication.java下添加以下代码：
// ...
import com.reactlibrary.AlipayPackage; //添加此代码
public class MainApplication extends Application implements ReactApplication {
private final ReactNativeHost mReactNativeHost = new ReactNativeHost(this) {
// ...
@Override
protected List<ReactPackage> getPackages() {
return Arrays.<ReactPackage>asList(
new MainReactPackage(),
new AlipayPackage() //添加此代码
);
}
};
// ...
}
2、在 android/settings.gradle下添加
include ':@0x5e_react-native-alipay'
project(':@0x5e_react-native-alipay').projectDir = new File(rootProject.projectDir, '../node_modules/@0x5e/react-native-alipay/android')
3、在android/app/build.gradle下添加
compile project(':@0x5e_react-native-alipay')
4、在android/build.gradle➡️allprojects➡️repositories下添加
flatDir {
dirs "$rootDir/../node_modules/@0x5e/react-native-alipay/android/libs"
}
5、在android/app/proguard-rules.pro下添加
-keep class com.alipay.** { *; }
IOS配置
1、在 Libraries下 点击 Add Files to [your project's name], 将 node_modules/@0x5e/react-native-alipay 下面的 RCTAlipay.xcodeproj添加过来
2、在Build Phases -> Link Binary With Libraries下添加
libc++.tbd
libz.tbd
CFNetwork.framework
CoreGraphics.framework
CoreMotion.framework
CoreTelephony.framework
CoreText.framework
Foundation.framework
QuartzCore.framework
SystemConfiguration.framework
UIKit.framework
libRCTAlipay.a
3、添加如下代码
WechatIMG11.png
4、在
AppDelegate.m下添加：
// ...
#import <React/RCTLinkingManager.h>
@implementation AppDelegate
// ...下面第一条内容当AppDelegate已存在时，可忽略。
- (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];
}
@end
5、添加以下内容
WechatIMG14.jpeg
6、页面引用
import Alipay from '@0x5e/react-native-alipay';
async OPay(){
let infoStr = 'apiname=com.alipay.account.auth&method=alipay.open.auth.sdk.code.get&app_id=xxxx&app_name=mc&biz_type=openservice&pid=xxxx&product_id=APP_FAST_LOGIN&scope=kuaijie&target_id=xxxx&auth_type=AUTHACCOUNT&sign_type=RSA2&sign=xxxx'; // get from server, signed
let response = await Alipay.authWithInfo(infoStr);
console.info(response);
// let { resultStatus, result, memo } = response;
// let { success, result_code, auth_code, user_id } = QueryString.parse(result);
}
