ReactNative-IOS-支付篇-支付宝

  作者也是个菜鸟，自学自用，如果有什么问题，请在下方留言。废话不多说，马上开启我们得旅途征程。下面是IOS版配置步骤，看这个之前得有一些IOS原生开发基础。

1.下载安装第三方库

  这里借助于强大的第三方库react-native-yunpeng-alipay。在项目根目录中，采用npm方式安装。

  react-native install react-native-yunpeng-alipay

  这里react-native install 是会自动link的，所以不需要再react-native link

2.添加库依赖

  CoreMotion.framework
  CoreTelephony.framework
  libc++
  libz

3.添加URL Scheme

  在info.plist中添加支付宝对应的url scheme (唯一识别),例如:alipay+"appKey"，scheme中不能包含特殊字符如“-”,否则导致支付完成后不能返回至商户App.

4.修改AppDelegate.m文件

  a.引入头文件，#import "AlipayModule.h",完成支付宝回调处理

  b.新增openUrl方法

//MARK:9.0以前使用的方法
- (BOOL)application:(UIApplication *)application openURL:(NSURL *)url sourceApplication:(nullable NSString *)sourceApplication annotation:(id)annotation
{
  if ([url.host isEqualToString:@"safepay"]) {
      [AlipayModule handleCallback:url];
      return YES;
  }
  return NO;
}

//MARK:9.0以后使用的方法
- (BOOL)application:(UIApplication *)app openURL:(NSURL *)url options:(NSDictionary<UIApplicationOpenURLOptionsKey, id> *)options
{
  if ([url.host isEqualToString:@"safepay"]) {
    [AlipayModule handleCallback:url];
    return YES;
  }
  return NO;
}

5.前端调用样例

  a.导入支付组件，import Alipay from 'react-native-yunpeng-alipay'

  b.新增function

AliPayHandler(){
  Alipay.pay("签名字符串").then((resp)=>{
		console.log("支付宝支付成功:"+JSON.stringify(resp));
	},(err)=>{
		console.log("err:"+JSON.stringify(err));
	            var payResultStr = "";
	            switch (err.code){
	                case "10000":
	                    payResultStr = "没有配置URL Scheme";
	                    break;
	                case "9000":
	                    payResultStr = "支付成功";
	                    break;
	                case "8000":
	                    payResultStr = "支付结果未知,请查询订单状态";
	                    break;
	                case "4000":
	                    payResultStr = "订单支付失败";
	                    break;
	                case "5000":
	                    payResultStr = "重复请求";
	                    break;
	                case "6001":
	                    payResultStr = "用户中途取消";
	                    break;
	                case "6002":
	                    payResultStr = "网络连接出错";
	                    break;
	                case "6004":
	                    payResultStr = "支付结果未知,请查询订单状态";
	                    break;
	                default:
	                    payResultStr = "其他失败原因";
	                    break;
	            }
	            console.log("支付宝支付支付失败:"+payResultStr);
	});
}