如何在React中调用微信的jsSDK_百度知道
如何在React中调用微信的jsSDK
我有更好的答案
}&Route path=&quotReact中调用微信的jsSDK的方法如下：1.先看微信的官方文档是这样说的;/react&quot.2中修复2只要调用 wx.config 一次就可以了，但是在 android 的手机，在页面跳转之后，要重新调用 wx。如果用了 react-router 的话，直接在 Route 组件上绑定一个 onChange 方法就可以了，所以判断下是安卓手机还是苹果手机，function routeChange(pre, next) {
wx.config(getWxConfig()); onChange={routeChange}&&YourRouteConfig/&&&#47，要保存在一个变量里面）;X5 浏览器&quot，此问题会在Android6，&quot:同一个url仅需调用一次，对于变化url的SPA的web app可在每次url变化时进行调用,目前Android微信客户端不支持pushState的H5新特性;， 我他妈就呵呵了，所以使用pushState来实现web app的页面会导致签名失败.config（url 依然是进入网站的第一个页面的地址
1. 微信JSSDK使用步骤简介我们既然是在做基于微信的开发，当然就离不开微信的开发文档了。开始之前希望大家能先去看下《微信JS-SDK说明文档》。那么我们怎么样才能用上微信的JSSDK呢？以下基本步骤就是基于该文档的。需要注意的是，如果本人下面的描述你看的有点云里雾里的话，我建议你：回头看下本系列《小白学react》的历史基础文章，特别是《小白学react之altjs的Action和Store》以及《小白学react之打通React Component任督二脉》，或/和：直接跳过我的描述，在文章后面下载最新的源码，先阅读源码，碰到问题再反过来看文章的描述。步骤一：绑定域名先登录微信公众平台进入“公众号设置”的“功能设置”里填写“JS接口安全域名”。备注：登录后可在“开发者中心”查看对应的接口权限。这里绑定的时候需要注意不要带前面的http协议头。写法跟上一篇《小白学react之网页获取微信用户信息》中的网页回调域名设置的写法是一样的。步骤二：引入JS文件在需要调用JS接口的页面引入如下JS文件，（支持https）：请注意，如果你的页面启用了https，务必引入 ：，否则将无法在iOS9.0以上系统中成功使用JSSDK因为我们的index.html是通过ejs模版生成的，所以我们只需要在我们的index.ejs中的body部分末尾加入相应的微信jssdk库的引用就好了。& &&% for (var chunk in htmlWebpackPlugin.files.chunks) { %& & & &&script src=&&%= htmlWebpackPlugin.files.chunks[chunk].entry %&&&&/script&& & &&script src=&jweixin-1.0.0.js&&&/script&& &&% } %&步骤三：通过config接口注入权限验证配置所有需要使用JS-SDK的页面必须先注入配置信息，否则将无法调用（同一个url仅需调用一次，对于变化url的SPA的web app可在每次url变化时进行调用,目前Android微信客户端不支持pushState的H5新特性，所以使用pushState来实现web app的页面会导致签名失败，此问题会在Android6.2中修复）。wx.config({& &debug: true, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。& &appId: '', // 必填，公众号的唯一标识& &timestamp: , // 必填，生成签名的时间戳& &nonceStr: '', // 必填，生成签名的随机串& &signature: '',// 必填，签名，见附录1& &jsApiList: [] // 必填，需要使用的JS接口列表，所有JS接口列表见附录2});这一步的关键是如何生成正确的签名。这里微信jssdk文档中有给出不同语言版本的签名算法示例大家可以参考。往下我们也会就github上的一个签名算法的封装进行学习。在我们的实战过程中，签名会在服务器端发生。react客户端会像之前的获取微信用户信息一样，通过一个restfulApi调用服务器端的api，然后由服务器来生成对应的签名，然后将签名信息返回给客户端。客户端获取到上面wx.config示例代码中的签名相关信息后，就会调用一个Alt的Action，来触发将获取回来的信息保存到一个跟该Action绑定的jssdk状态管理的Store里面。然后就可以调用wx.config来配置我们需要用到的JS接口列表了。注意这里的wx这个对象是通过上一步的JS文件引入进来的。我们在react的客户端代码中可以直接通过window.wx对其进行引用：window.wx.config({&...});步骤四：通过ready接口处理成功验证wx.ready(function(){ & &// config信息验证后会执行ready方法，所有接口调用都必须在config接口获得结果之后，config是一个客户端的异步操作，所以如果需要在页面加载时就调用相关接口，则须把相关接口放在ready函数中调用来确保正确执行。对于用户触发时才调用的接口，则可以直接调用，不需要放在ready函数中。});随后，react客户端负责jssdk状态管理的store会调用wx.ready来监听config配置是否成功，如果成功的话，就会将该store的一个ready状态设置成true。这样的话，通过AltContainer绑定了该store的相应的Component组件就能知道响应的jssdk的api是否已经准备就绪，可以进行调用了。步骤五：通过error接口处理失败验证wx.error(function(res){ & &// config信息验证失败会执行error函数，如签名过期导致验证失败，具体错误信息可以打开config的debug模式查看，也可以在返回的res参数中查看，对于SPA可以在这里更新签名。});同理，如果如果配置失败的话，那么就在wx.error这个监听接口中将ready状态设置成false。2. 生成签名如前面所述，我们需要用到jssdk的页面必须要要注入调用到的api的配置信息。wx.config({& &debug: true, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。& &appId: '', // 必填，公众号的唯一标识& &timestamp: , // 必填，生成签名的时间戳& &nonceStr: '', // 必填，生成签名的随机串& &signature: '',// 必填，签名，见附录1& &jsApiList: [] // 必填，需要使用的JS接口列表而注入JS接口到页面时，我们可以看到，还需要使用到其他一些信息。其中appId我们可以从公众号管理后台获得。signature是跟所访问页面的url关联的一个签名，它有专门的一套算法来生成。另外两个参数nonceStr和signature都是在签名的过程中生成的。这里通过wx.config传进去这些参数，主要是为了让微信去判断我们生成的签名和微信通过这些信息生成的签名是否一致，如果不一致的话，那么注入到该页面的jsApiListj就失败。那么我们在服务器这边的签名算法是如何的呢？根据微信开发文档我们需要提供以下4个参数，然后通过sha1算发来生成对应的签名：noncestr：一个随机字符串，我们随便填写jsapi_ticket：jsapi_ticket是公众号用于调用微信JS接口的临时票据timestamp: 签名时间戳。注意这个时间戳需要和上面传入wx.config的时间戳一致url: 调用JS接口页面的完整URL。我们可以从react客户端通过location.href获得，并传给服务器端那么这里主要需要解决的就是如何获得jsapi_ticket这个临时票据了。根据文档的描述，我们可以通过以下这个接口获得：cgi-bin/ticket/getticket?access_token=ACCESS_TOKEN&type=jsapi从中可以看到，我们调用这个接口首先要获得一个access_token。这里微信也有相应的api来处理。cgi-bin/token?grant_type=client_credential&appid=APPID&secret=APPSECRET这里需要用到我们的微信公众号的appId和secret，这些我们都是已知的，所以好办。那么，也就是说，我们其实只需要提供我们的微信公众号的appId和secret，就能获取到access_token，从而就会获得我们需要的jsapi_ticket。这里我们参考下github上一个示例(wechat-sdk-demo )的签名的实现。其传入的参数有两个，其中:url: &react客户端传进来的需要注入jsapi的页面urlcallback: 一个回调函数，接受一个json格式的参数。主要是用来将生成的签名信息等回传给上层调用函数。const config = { & &grant_type: 'client_credential', & &appid: 'xxxx', & &secret: &xxxxx&, & &noncestr:'Wm3WZYTPz0wzccnW', & &accessTokenUrlin.qq.com/cgi-bin/token', & &ticketUrl:'com/cgi-bin/ticket/getticket',}exports.sign = function (url,callback) { &var noncestr = config.noncestr,& & & &timestamp = Math.floor(Date.now()/1000), //精确到秒& &...& & & &request(config.accessTokenUrl + '?grant_type=' + config.grant_type + '&appid=' + config.appid + '&secret=' + config.secret ,function(error, response, body){ & & & & & &if (!error && response.statusCode == 200) { & & & & & & & &var tokenMap = JSON.parse(body);& & & & & & & &request(config.ticketUrl + '?access_token=' + tokenMap.access_token + '&type=jsapi', function(error, resp, json){ & & & & & & & & & &if (!error && response.statusCode == 200) { & & & & & & & & & & & &var ticketMap = JSON.parse(json);& & & & & & & & & & & &cache.put('ticket',ticketMap.ticket,config.cache_duration); &//加入缓存& & & & & & & & & & & &callback({ & & & & & & & & & & & & & &noncestr:noncestr, & & & & & & & & & & & & & &timestamp:timestamp, & & & & & & & & & & & & & &url:url, & & & & & & & & & & & & & &jsapi_ticket:ticketMap.ticket, & & & & & & & & & & & & & &signature:sha1('jsapi_ticket=' + ticketMap.ticket + '&noncestr=' + noncestr + '&timestamp=' + timestamp + '&url=' + url)& & & & & & & & & & & &});& & & & & & & & & &}& & & & & & & &})& & & & & &}& & & &})& &}}这里的流程和我们刚才描述的并无二致。首先是通过appId和secret获得调用获取jsapi_ticket的access_token，然后通过该access_token获得我们签名需要用到的jsapi_ticket。noncestr我们是提前随便填写好的。timestamp的算法也比较简单。最后就是通过sha1这个库提供的方法，将jsapi_ticket，noncestr，timestamp和页面url进行sha1签名，然后将以上这些信息通过callback返回给上层调用函数。那么我们往下看下我们的上层调用函数。其实就是我们的express路由:app.get(&/api/signature&, function(req,res) { & &const url = req.query.url.split('#')[0];& &signature.sign(url,function(signatureMap){& & & &signatureMap.appId = wechat_cfg.& & & &res.send(signatureMap);& &});})根据微信开发文档需求，我们首先需要将传进来的url的锚点后面的数据给去掉，保留前面的有效部分。然后就是调用上面的sign方法来生成签名。上面的签名方法最后传进来的json数据就是这里的signatureMap。我们最终会将这些数据发送回react客户端。同时，通过上面的wx.config的示例，我们知道还需要用到微信公众号的appId。所以这里一并将其放到signatureMap中进行返回。那么到此为止，react客户端调用服务端的&/api/signature&返回的数据示例如下:{&noncestr: 'Wm3WZYTPz0wzccnW',&timestamp: ,&url: 'com/?code=001kGsd30xcm7F1PAFf305Uud30kGsdr&state=',&jsapi_ticket: 'sM4AOVdWfPE4DxkXGEs8VBqyVbs-TKGYp4d_ZSQa0Q5WvvMUPNQ6XGpyEcgKOD_xID_GrMCaalSmIF9JbrGaOg',&signature: '9268ffaf4b9eb0d296fcfefe3de3c'}3. &客户端获取签名信息3.1 获取签名信息并注入jssdk和之前的获取微信用户信息一样，我们这里会建立一个新的Source文件WechatSdkSource.js来调用远程服务器的&/api/signature&接口:var WechatSdkSource = {&fetchSignatureMap() { & &return {& & &remote(state,url) { & & & &return co(function *() { & & & & &let signatureMap = & & & & &const getSignatureMapUrl = `/api/signature`; & & & & &try { & & & & & &let result = yield request.get(getSignatureMapUrl).query({url:url});& & & & & &signatureMap = result.& & & & &} catch (e) {& & & & & &signatureMap =& & & & &} & & & & &//console.log(&userInfo:&, userInfo);& & & & &return signatureM& & & &});& & &},& & &local() { & & & &// Never check locally, always fetch remotely.& & & && & &}, & & &success: WechatSdkActions.updateSignatureMap, & & &error: WechatSdkActions.getSignatureMapFailed, & & &loading: WechatSdkActions.getSignatureMap,& &}&}};这里传进来的url由下面将要谈及的上层函数所生成。整个流程就没有什么好说的了，说白了就是通过相应的库发送一个带有url的query参数的请求到服务器端来请求签名信息，相信有跟着这个系列文章的朋友都是很清楚的了。最终请求成功返回的时候就会调用WechatSdkActions的updateSignatureMap这个Action。var alt = require('../alt');module.exports &= alt.generateActions( & &'updateSignatureMap', & &'getSignatureMap', & &'getSignatureMapFailed',);而这个action就会触发所监听的WechatSdkStore的onUpdateSignatureMap这个回调。class WechatSdkStore { &constructor() { & &this.signatureMap = []; & &this.errorMessage = & &this.ready = & &this.bindActions(WechatSdkActions); & &this.exportAsync(WechatSdkSource);
为您推荐：
其他类似问题
换一换
回答问题，赢新手礼包
个人、企业类
违法有害信息,请在下方选择后提交
色情、暴力
我们会通过消息、邮箱等方式尽快将举报结果通知您。在 SegmentFault，学习技能、解决问题
每个月，我们帮助 1000 万的开发者解决各种各样的技术问题。并助力他们在技术能力、职业生涯、影响力上获得提升。
问题对人有帮助，内容完整，我也想知道答案
问题没有实际价值，缺少关键内容，没有改进余地
react如何实现webapp的微信和支付宝支付功能？有demo或者第三方组件吗？需要怎么入手？
答案对人有帮助，有参考价值
答案没帮助，是错误的答案，答非所问
跟你说，超简单。拿微信支付来说，你只需要引入微信的sdk，然后找到人家api里的代码，直接拷贝过来，请求后台接口，让后台去获得公众号的一些参数，你填进去，就会触发。。。
答案对人有帮助，有参考价值
答案没帮助，是错误的答案，答非所问
react 只是框架，和具体功能实现没有什么关系，功能的话还是去看官方给的文档吧
答案对人有帮助，有参考价值
答案没帮助，是错误的答案，答非所问
你想表达的意思是用react写的项目,如何调用微信和支付宝的支付功能吧?可以去看微信和支付宝的开发API
答案对人有帮助，有参考价值
答案没帮助，是错误的答案，答非所问
这个后台给个接口自己传参数过去就行了吧
同步到新浪微博
分享到微博？
关闭理由：
删除理由：
忽略理由：
推广（招聘、广告、SEO 等）方面的内容
与已有问题重复（请编辑该提问指向已有相同问题）
答非所问，不符合答题要求
宜作评论而非答案
带有人身攻击、辱骂、仇恨等违反条款的内容
无法获得确切结果的问题
非开发直接相关的问题
非技术提问的讨论型问题
其他原因（请补充说明）
我要该，理由是：
在 SegmentFault，学习技能、解决问题
每个月，我们帮助 1000 万的开发者解决各种各样的技术问题。并助力他们在技术能力、职业生涯、影响力上获得提升。react-native 集成微信支付原文链接：
上篇文章已经介绍过 ，本篇文章将基于微信支付官方提供的集成文档，介绍如何将微信支付集成到 react-native 应用中。
适用于商户在移动端APP中集成微信支付功能。商户APP调用微信提供的SDK调用微信支付模块，商户APP会跳转到微信中完成支付。支付完后跳回到商户APP内，最后展示支付结果。目前微信支付支持手机系统有：IOS（苹果）、Android（安卓）和WP（Windows Phone）。
获取APPID：商户在申请开发APP应用后，微信开放平台会生成APP的唯一标识APPID。
后台设置商户在微信开放平台申请开发应用后，微信开放平台会生成APP的唯一标识APPID。由于需要保证支付安全，需要在开放平台绑定商户应用包名和应用签名，设置好后才能正常发起支付。设置界面在【开放平台】中的栏目【管理中心 / 修改应用 / 修改开发信息】里面，如下图红框内所示。应用签名获取可以使用：
，将安装包安装到手机里，输入应用包名即可获取到签名。这里有个调试技巧，可以将应用的签名改为
debug 版本的签名，等支付调试完成后再改为生产环境的签名。
导入微信SDK，修改android/app/build.gradle添加如下代码：
dependencies {
compile "com.tencent.mm.opensdk:wechat-sdk-android-with-mta:+"
在com.xx.xx创建包名wxapi，注意此处包名一定要为wxapi，否则后续将无法处理回调
编写 Module，在com.xx.xx.wxapi包下创建WxpayModule.java，代码如下：
package com.xx.xx.
import com.facebook.react.bridge.P
import com.facebook.react.bridge.ReactApplicationC
import com.facebook.react.bridge.ReactContextBaseJavaM
import com.facebook.react.bridge.ReactM
import com.facebook.react.bridge.ReadableM
import com.tencent.mm.opensdk.modelpay.PayR
import com.tencent.mm.opensdk.openapi.IWXAPI;
import com.tencent.mm.opensdk.openapi.WXAPIF
class WxpayModule extends ReactContextBaseJavaModule {
private IWXAPI
static String APP_ID = "";
static Promise promise =
WxpayModule(ReactApplicationContext reactContext) {
super(reactContext);
api = WXAPIFactory.createWXAPI(reactContext, null);
public String getName() {
return "Wxpay";
@ReactMethod
public void registerApp(String APP_ID) { // 向微信注册
WxpayModule.APP_ID = APP_ID;
api.registerApp(APP_ID);
@ReactMethod
public void pay(final ReadableMap order, Promise promise) {
WxpayModule.promise =
PayReq request = new PayReq();
request.appId = order.getString("appid");
request.partnerId = order.getString("partnerid");
request.prepayId= order.getString("prepayid");
request.packageValue = order.getString("package");
request.nonceStr= order.getString("noncestr");
request.timeStamp= order.getInt("timestamp")+"";
request.sign= order.getString("sign");
api.sendReq(request);
@ReactMethod
public void isSupported(Promise promise) { // 判断是否支持调用微信SDK
boolean isSupported = api.isWXAppInstalled();
promise.resolve(isSupported);
编写 Package，在com.xx.xx.wxapi包下创建WxpayPackage.java，代码如下：
package com.xx.xx.
import com.facebook.react.ReactP
import com.facebook.react.bridge.NativeM
import com.facebook.react.bridge.ReactApplicationC
import com.facebook.react.uimanager.ViewM
import java.util.ArrayL
import java.util.C
import java.util.L
public class WxpayPackage implements ReactPackage {
public List&ViewManager& createViewManagers(ReactApplicationContext reactContext) {
return Collections.emptyList();
public List&NativeModule& createNativeModules(
ReactApplicationContext reactContext) {
List&NativeModule& modules = new ArrayList&&();
modules.add(new WxpayModule(reactContext));
编写 WXPayEntryActivity 处理微信支付回调，在com.xx.xx.wxapi包下创建WXPayEntryActivity.java，注意包名或类名不一致会造成无法回调，代码如下：
package com.xx.xx.
import android.app.A
import android.content.I
import android.os.B
import android.util.L
import com.facebook.react.bridge.A
import com.facebook.react.bridge.WritableM
import com.tencent.mm.opensdk.constants.ConstantsAPI;
import com.tencent.mm.opensdk.modelbase.BaseR
import com.tencent.mm.opensdk.modelbase.BaseR
import com.tencent.mm.opensdk.openapi.IWXAPI;
import com.tencent.mm.opensdk.openapi.IWXAPIEventH
import com.tencent.mm.opensdk.openapi.WXAPIF
public class WXPayEntryActivity extends Activity implements IWXAPIEventHandler {
private static final String TAG = "WXPayEntryActivity";
private IWXAPI
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
api = WXAPIFactory.createWXAPI(this, WxpayModule.APP_ID);
api.handleIntent(getIntent(), this);
protected void onNewIntent(Intent intent) {
super.onNewIntent(intent);
setIntent(intent);
api.handleIntent(intent, this);
public void onReq(BaseReq req) {
public void onResp(BaseResp resp) {
Log.d(TAG, "onPayFinish, errCode = " + resp.errCode);
if (resp.getType() == ConstantsAPI.COMMAND_PAY_BY_WX) {
WritableMap map = Arguments.createMap();
map.putInt("errCode", resp.errCode);
WxpayModule.promise.resolve(map);
最后在 Android 这边要做的最后一件事就是注册这个模块，在com.xx.xx.MainApplication中注册模块：
protected List&ReactPackage& getPackages() {
return Arrays.&ReactPackage&asList(
new MainReactPackage(),
// ...other packages
new WxpayPackage() // &-- 注册模块
项目设置APPID，在Xcode中打开项目，设置项目属性中的URL Schemes为你的APPID。如图标红位置所示：
添加微信白名单info.plist –& 右击 –& open as –& source Code –& 添加白名单，如下图所示：代码如下：
&key&LSApplicationQueriesSchemes&/key&
&string&wechat&/string&
&string&weixin&/string&
导入必要的库文件，如下图所示：
在项目目录下创建Group Wxapi，并创建WxpayMoudle模块
下载开发工具包（），导入Wxapi中，最终如下图所示：
编写WxpayModule.h代码如下：
#import &React/RCTBridgeModule.h&
#import &React/RCTLog.h&
#import "WXApiObject.h"
#import "WXApi.h"
@interface WxpayMoudle : NSObject &RCTBridgeModule, WXApiDelegate&
编写WxpayModule.m代码如下：
#import "WxpayMoudle.h"
@implementation WxpayMoudle
RCTPromiseResolveBlock resolveBlock =
- (instancetype)init
self = [super init];
if (self) {
[[NSNotificationCenter defaultCenter] addObserver:self selector:@selector(handleWXPay:) name:@"WXPay" object:nil];
- (void)dealloc
[[NSNotificationCenter defaultCenter] removeObserver:self];
- (void)handleWXPay:(NSNotification *)aNotification
NSString * errCode =
[aNotification userInfo][@"errCode"];
resolveBlock(@{@"errCode": errCode});
RCT_EXPORT_METHOD(registerApp:(NSString *)APP_ID){
[WXApi registerApp: APP_ID];//向微信注册
RCT_EXPORT_METHOD(pay:(NSDictionary *)order
resolver:(RCTPromiseResolveBlock)resolve
rejecter:(RCTPromiseRejectBlock)reject){
resolveBlock =
//调起微信支付
PayReq *req = [[PayReq alloc] init];
req.partnerId = [order objectForKey:@"partnerid"];
req.prepayId = [order objectForKey:@"prepayid"];
req.nonceStr = [order objectForKey:@"noncestr"];
req.timeStamp = [[order objectForKey:@"timestamp"] intValue];
req.package = [order objectForKey:@"package"];
req.sign = [order objectForKey:@"sign"];
[WXApi sendReq:req];
RCT_REMAP_METHOD(isSupported, // 判断是否支持调用微信SDK
resolver:(RCTPromiseResolveBlock)resolve
rejecter:(RCTPromiseRejectBlock)reject){
if (![WXApi isWXAppInstalled]) resolve(@NO);
else resolve(@YES);
RCT_EXPORT_MODULE(Wxpay);
处理微信支付回调，在AppDelegate.m中添加如下代码：
//支付回调9以后
- (BOOL)application:(UIApplication *)app openURL:(NSURL *)url options:(NSDictionary*)options {
[WXApi handleOpenURL:url delegate:self];
//支付回调9以前
- (BOOL)application:(UIApplication *)application handleOpenURL:(NSURL *)url {
[WXApi handleOpenURL:url delegate:self];
//ios9以后的方法
- (BOOL)application:(UIApplication *)application openURL:(NSURL *)url sourceApplication:(NSString *)sourceApplication annotation:(id)annotation {
return [WXApi handleOpenURL:url delegate:self];
#pragma mark - wx callback
- (void) onReq:(BaseReq*)req
// TODO Something
- (void)onResp:(BaseResp *)resp
//判断是否是微信支付回调 (注意是PayResp 而不是PayReq)
if ([resp isKindOfClass:[PayResp class]])
//发出通知 从微信回调回来之后,发一个通知,让请求支付的页面接收消息,并且展示出来,或者进行一些自定义的展示或者跳转
NSNotification * notification = [NSNotification notificationWithName:@"WXPay" object:nil userInfo:@{@"errCode":@(resp.errCode)}];
[[NSNotificationCenter defaultCenter] postNotification:notification];
至此，iOS端微信SDK集成成功
修改原生代码后，需要重新打包运行程序：
react-native run-android # 运行Android端
react-native run-ios # 运行iOS端
编写Wxpay.js工具类
import { NativeModules } from 'react-native';
export default NativeModules.W
在入口文件index.js向微信注册应用
import Wxpay from './your/path/to/Wxpay';
Wxpay.registerApp(APPID); //向微信注册
调用Wxpay模块发起微信支付：
import Wxpay from './your/path/to/Wxpay';
async pay(params){ // params 为后端提供的参数
let isSupported = await call(Payway.isSupported);
if (!isSupported) { // 判断是否支持微信支付
message.show('找不到微信应用，请安装最新版微信');
let res = await call(getOrderInfo, params); // 从后端获取签名对象，参考支付接口调用
let ret = await call(Wxpay.pay, res.data); // 调起微信客户端，发起支付
if (ret.errCode === 0) {
// 支付成功回调
// 支付失败回调
支付接口调用参考和，本篇将不做赘述。
相关热门文章分享