devbox
IT小白
这个屌丝很懒，什么也没留下！
关注作者
热门标签
热门文章
当前位置:   article > 正文

ReactNative 安卓支付宝微信支付接入_react native 微信支付

作者：IT小白 | 2024-02-21 10:10:02

赞

踩

react native 微信支付

微信支付宝支付

微信支付接入

首先，在android/src/main/java/* 新建 pay支付文件夹，如下所示：
pay
新建 wechat ,在文件夹里面新建 Const.java, WeChatPay.java 文件：
wechat file
增加Const.java配置

package com.xxx.pay.wechat;

public class Const {
    public static final String APP_ID = "you APP_ID";
}


  • 1
  • 2
  • 3
  • 4
  • 5
  • 6

增加WeChatPay.java支付逻辑

package com.collection.pay.wechat;

import com.facebook.react.bridge.Arguments;
import com.facebook.react.bridge.Promise;
import com.facebook.react.bridge.ReactApplicationContext;
import com.facebook.react.bridge.ReactContextBaseJavaModule;
import com.facebook.react.bridge.ReactMethod;
import com.facebook.react.bridge.ReadableMap;
import com.facebook.react.bridge.WritableMap;

import com.tencent.mm.opensdk.constants.Build;
import com.tencent.mm.opensdk.modelmsg.SendAuth; // sendAuth
import com.tencent.mm.opensdk.modelpay.PayReq;
import com.tencent.mm.opensdk.openapi.IWXAPI;
import com.tencent.mm.opensdk.openapi.WXAPIFactory;

public class WeChatPay extends ReactContextBaseJavaModule {

    private static ReactApplicationContext reactContext;
    public static Promise promise;
    private final static String NOT_REGISTERED = "registerApp required.";

    private IWXAPI api = null;
    private String appId;

    public WeChatPay(ReactApplicationContext context) {
        super(context);

        reactContext = context;

        // 注册微信开发，绑定APP_ID
        //api = WXAPIFactory.createWXAPI(context, Const.APP_ID, false);
        // api.registerApp(Const.APP_ID);
    }

    @Override
    public String getName() {
        return "WechatModule";
    }

    // 注册appId
    @ReactMethod
    private void registerApp(String appId, Promise promise) {
        try {
            this.appId = appId;
            api = WXAPIFactory.createWXAPI(reactContext.getApplicationContext(), null, false);
            promise.resolve(api.registerApp(appId));
        } catch (Exception e) {
            promise.reject("-1", e.getMessage());
        }
    }

    // 判断是否安装客户端
    @ReactMethod
    private void isWxInstalled(Promise promise) {
        try {
            if (api == null) {
                throw new Exception(NOT_REGISTERED);
            }
            promise.resolve(api.isWXAppInstalled());
        } catch (Exception e) {
            promise.reject("-1", e.getMessage());
        }
    }


    // 打开微信客户端
    @ReactMethod
    private void openWxApp(Promise promise) {
        try {
            if (api == null) {
                throw new Exception(NOT_REGISTERED);
            }
            promise.resolve(api.openWXApp());
        } catch (Exception e) {
            promise.reject("-1", e.getMessage());
        }
    }

    // 获取微信版本号
    @ReactMethod
    private void getAppVersion(Promise promise) {
        try {
             if (api == null) {
                 throw new Exception(NOT_REGISTERED);
             }
            promise.resolve(api.getWXAppSupportAPI());
        } catch (Exception e) {
            promise.reject("-1", e.getMessage());
        }
    }

    // 微信授权登录
    @ReactMethod
    private void sendAuthRequest(String scope, String state, Promise promise) {
        try {
            if (api == null) {
                throw new Exception(NOT_REGISTERED);
            }
            SendAuth.Req req = new SendAuth.Req();
            req.scope = scope;
            req.state = state;
            promise.resolve(api.sendReq(req));
        } catch (Exception e) {
            promise.reject("-1", e.getMessage());
        }
    }

    // 微信支付
    @ReactMethod
    private void wxPay(ReadableMap request, Promise promise) {
        WeChatPay.promise = promise;

        PayReq req = new PayReq();
        req.appId = request.getString("appid");
        req.partnerId = request.getString("partnerid");
        req.prepayId = request.getString("prepayid");
        req.packageValue = "Sign=WXPay";
        req.nonceStr = request.getString("nonceStr");
        req.timeStamp = request.getString("timestamp");
        req.sign = request.getString("sign");

        int wxSdkVersion = api.getWXAppSupportAPI();
        if (wxSdkVersion>= Build.PAY_INSURANCE_SDK_INT) {
            api.sendReq(req);
        } else if (wxSdkVersion == 0) {
            WritableMap map = Arguments.createMap();
            map.putInt("errCode", -3);
            WeChatPay.promise.resolve(map);
        } else {
            WritableMap map = Arguments.createMap();
            map.putInt("errCode", -4);
            WeChatPay.promise.resolve(map);
        }
    }
}


  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 17
  • 18
  • 19
  • 20
  • 21
  • 22
  • 23
  • 24
  • 25
  • 26
  • 27
  • 28
  • 29
  • 30
  • 31
  • 32
  • 33
  • 34
  • 35
  • 36
  • 37
  • 38
  • 39
  • 40
  • 41
  • 42
  • 43
  • 44
  • 45
  • 46
  • 47
  • 48
  • 49
  • 50
  • 51
  • 52
  • 53
  • 54
  • 55
  • 56
  • 57
  • 58
  • 59
  • 60
  • 61
  • 62
  • 63
  • 64
  • 65
  • 66
  • 67
  • 68
  • 69
  • 70
  • 71
  • 72
  • 73
  • 74
  • 75
  • 76
  • 77
  • 78
  • 79
  • 80
  • 81
  • 82
  • 83
  • 84
  • 85
  • 86
  • 87
  • 88
  • 89
  • 90
  • 91
  • 92
  • 93
  • 94
  • 95
  • 96
  • 97
  • 98
  • 99
  • 100
  • 101
  • 102
  • 103
  • 104
  • 105
  • 106
  • 107
  • 108
  • 109
  • 110
  • 111
  • 112
  • 113
  • 114
  • 115
  • 116
  • 117
  • 118
  • 119
  • 120
  • 121
  • 122
  • 123
  • 124
  • 125
  • 126
  • 127
  • 128
  • 129
  • 130
  • 131
  • 132
  • 133
  • 134
  • 135
  • 136
  • 137

在 pay文件夹外部与其同级出新建wxapi文件夹，新增 WXPayEntryActivity.java

package com.xxx.wxapi;

import com.facebook.react.bridge.Arguments;
import com.facebook.react.bridge.WritableMap;
import com.facebook.react.uimanager.IllegalViewOperationException;
import com.reactnativepay.pay.wechat.Const;
import com.reactnativepay.pay.wechat.WeChatPay;
import com.tencent.mm.opensdk.constants.ConstantsAPI;
import com.tencent.mm.opensdk.modelbase.BaseReq;
import com.tencent.mm.opensdk.modelbase.BaseResp;
import com.tencent.mm.opensdk.openapi.IWXAPI;
import com.tencent.mm.opensdk.openapi.IWXAPIEventHandler;
import com.tencent.mm.opensdk.openapi.WXAPIFactory;

import android.app.Activity;
import android.content.Intent;
import android.os.Bundle;

public class WXPayEntryActivity extends Activity implements IWXAPIEventHandler {

	// 这里填写申请的微信开发者ID
    private static final String TAG = "" ; // 微信ID
    private IWXAPI api;

    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);

        api = WXAPIFactory.createWXAPI(this, Const.APP_ID);
        api.handleIntent(getIntent(), this);
    }

    @Override
    public void onNewIntent(Intent intent) {
        super.onNewIntent(intent);
        setIntent(intent);
        api.handleIntent(intent, this);
    }

    @Override
    public void onReq(BaseReq baseReq) {
        return;
    }

    @Override
    public void onResp(BaseResp baseResp) {
        System.out.println("onResp2");
        if (baseResp.getType() == ConstantsAPI.COMMAND_PAY_BY_WX) {
            try {
                // 支付结果返回
                WritableMap map = Arguments.createMap();
                map.putInt("errCode", baseResp.errCode);
                WeChatPay.promise.resolve(map);
                finish();
            } catch (IllegalViewOperationException e) {
            	// 错误返回
                WeChatPay.promise.reject(e);
            }
        }
    }
}

  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 17
  • 18
  • 19
  • 20
  • 21
  • 22
  • 23
  • 24
  • 25
  • 26
  • 27
  • 28
  • 29
  • 30
  • 31
  • 32
  • 33
  • 34
  • 35
  • 36
  • 37
  • 38
  • 39
  • 40
  • 41
  • 42
  • 43
  • 44
  • 45
  • 46
  • 47
  • 48
  • 49
  • 50
  • 51
  • 52
  • 53
  • 54
  • 55
  • 56
  • 57
  • 58
  • 59
  • 60
  • 61

在pay下面 PayPackage.java

package com.xxx.pay;

import com.reactnativepay.pay.alipay.AliPay;
import com.reactnativepay.pay.wechat.WeChatPay;

import com.facebook.react.ReactPackage;
import com.facebook.react.bridge.NativeModule;
import com.facebook.react.bridge.ReactApplicationContext;
import com.facebook.react.uimanager.ViewManager;

import java.util.ArrayList;
import java.util.Collections;
import java.util.List;

public class PayPackage implements ReactPackage {

    @Override
    public List<ViewManager> createViewManagers(ReactApplicationContext reactContext) {
        return Collections.emptyList();
    };


    @Override
    public List<NativeModule> createNativeModules(
            ReactApplicationContext reactContext
    ) {
        List<NativeModule> modules = new ArrayList<>();

        // 新增需要注册的模块
        modules.add(new AliPay(reactContext)); // alipay
        modules.add(new WeChatPay(reactContext)); // wechat pay
        return modules;
    };
}

  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 17
  • 18
  • 19
  • 20
  • 21
  • 22
  • 23
  • 24
  • 25
  • 26
  • 27
  • 28
  • 29
  • 30
  • 31
  • 32
  • 33
  • 34

在 MainApplication.java 新增配置

import com.xxx.pay.PayPackage;

// other code
packages.add(new PayPackage());
return packages;
// other code

  • 1
  • 2
  • 3
  • 4
  • 5
  • 6

支付宝支付接入

在 pay 下面新增 AliPay、PayResult
新增 AliPay.java

package com.xxx.pay.alipay;

import android.annotation.SuppressLint;
import android.os.Handler;
import android.os.Looper;
import android.os.Message;
import android.util.Log;

import java.util.Map;
import com.alipay.sdk.app.PayTask;


import com.facebook.react.bridge.Promise;
import com.facebook.react.bridge.ReactApplicationContext;
import com.facebook.react.bridge.ReactContextBaseJavaModule;
import com.facebook.react.bridge.ReactMethod;

public class AliPay extends ReactContextBaseJavaModule {

    private static ReactApplicationContext reactContext;
    public static Promise promise;

    public AliPay(ReactApplicationContext context) {
        super(context);
        // 挂载
        reactContext = context;
    }

    private static final int SDK_PAY_FLAG = 1;

    /**
     * ReactContextBaseJavaModule要求派生类实现getName方法
     * 这个函数用于返回一个字符串名字，这个名字在 JavaScript 端标记这个模块
     * NativeModules.AliPay访问到这个模块。
     * @return 用于在JavaScript中调用的方法名称
     */

    @Override
    public String getName() {
        return "AliPay";
    }

    @SuppressLint("HandlerLeak")
    private Handler mHandler = new Handler(Looper.getMainLooper()) {
        @SuppressWarnings("unised")
        public void handleMessage(Message msg) {
            switch (msg.what){
                case SDK_PAY_FLAG: {
                    @SuppressWarnings("unchecked")
                            PayResult payResult = new PayResult((Map<String, String>) msg.obj);

                            String resultInfo = payResult.getResult();
                            String resultStatus = payResult.getResultStatus();

                            AliPay.promise.resolve(resultStatus);
                            break;
                }
                default:
                    break;
            }
        }
    };

    @ReactMethod
    public void payV2(String orderInfo, Promise promise) {
        AliPay.promise = promise;

        final Runnable payRunnable = new Runnable() {
            @Override
            public void run() {
                PayTask alipay = new PayTask(getCurrentActivity());
                Map<String, String> result = alipay.payV2(orderInfo, true);
                Log.i("msp", result.toString());

                Message msg = new Message();
                msg.what = SDK_PAY_FLAG;
                msg.obj = result;
                mHandler.sendMessage(msg);
            }
        };

        Thread payThread = new Thread(payRunnable);
        payThread.start();
    }
}

  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 17
  • 18
  • 19
  • 20
  • 21
  • 22
  • 23
  • 24
  • 25
  • 26
  • 27
  • 28
  • 29
  • 30
  • 31
  • 32
  • 33
  • 34
  • 35
  • 36
  • 37
  • 38
  • 39
  • 40
  • 41
  • 42
  • 43
  • 44
  • 45
  • 46
  • 47
  • 48
  • 49
  • 50
  • 51
  • 52
  • 53
  • 54
  • 55
  • 56
  • 57
  • 58
  • 59
  • 60
  • 61
  • 62
  • 63
  • 64
  • 65
  • 66
  • 67
  • 68
  • 69
  • 70
  • 71
  • 72
  • 73
  • 74
  • 75
  • 76
  • 77
  • 78
  • 79
  • 80
  • 81
  • 82
  • 83
  • 84
  • 85

新增 PayResult.java

package com.xxx.pay.alipay;

import java.util.Map;

import android.text.TextUtils;

public class PayResult {
	private String resultStatus;
	private String result;
	private String memo;

	public PayResult(Map<String, String> rawResult) {
		if (rawResult == null) {
			return;
		}

		for (String key : rawResult.keySet()) {
			if (TextUtils.equals(key, "resultStatus")) {
				resultStatus = rawResult.get(key);
			} else if (TextUtils.equals(key, "result")) {
				result = rawResult.get(key);
			} else if (TextUtils.equals(key, "memo")) {
				memo = rawResult.get(key);
			}
		}
	}

	@Override
	public String toString() {
		return "resultStatus={" + resultStatus + "};memo={" + memo
				+ "};result={" + result + "}";
	}

	/**
	 * @return the resultStatus
	 */
	public String getResultStatus() {
		return resultStatus;
	}

	/**
	 * @return the memo
	 */
	public String getMemo() {
		return memo;
	}

	/**
	 * @return the result
	 */
	public String getResult() {
		return result;
	}
}

  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 17
  • 18
  • 19
  • 20
  • 21
  • 22
  • 23
  • 24
  • 25
  • 26
  • 27
  • 28
  • 29
  • 30
  • 31
  • 32
  • 33
  • 34
  • 35
  • 36
  • 37
  • 38
  • 39
  • 40
  • 41
  • 42
  • 43
  • 44
  • 45
  • 46
  • 47
  • 48
  • 49
  • 50
  • 51
  • 52
  • 53
  • 54

在pay下面的PayPackage中添加配置

import com.reactnativepay.pay.alipay.AliPay;

 // ...other code
   modules.add(new AliPay(reactContext)); // alipay
 // ...other code

  • 1
  • 2
  • 3
  • 4
  • 5

客户端调用

import { NativeModules } 'react-native'

const { WechatModule } = NativeModules;

// 是否安装微信
const registerApp = async () => {
	await WechatModule.registerApp('appId')
}

// 微信登录
const sendAuthWxLogin = async () => {
	await WechatModule.sendAuthRequest('1', '0')
}


  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
声明：本文内容由网友自发贡献，不代表【wpsshop博客】立场，版权归原作者所有，本站不承担相应法律责任。如您发现有侵权的内容，请联系我们。转载请注明出处：https://www.wpsshop.cn/w/IT小白/article/detail/122881
推荐阅读
相关标签

Copyright © 2003-2013 www.wpsshop.cn 版权所有，并保留所有权利。

  

闽ICP备14008679号