本次项目仅涉及h5通过android中bridge调用微信支付,不涉及android中微信支付bridge的开发
商户系统和微信支付系统主要交互说明:
步骤1:用户在商户APP中选择商品,提交订单,选择微信支付。
步骤2:商户后台收到用户支付单,调用微信支付统一下单接口。参见【统一下单API】。
步骤3:统一下单接口返回正常的prepay_id,再按签名规范重新生成签名后,将数据传输给APP。参与签名的字段名为appid,partnerid,prepayid,noncestr,timestamp,package。注意:package的值格式为Sign=WXPay
步骤4:商户APP调起微信支付。api参见本章节【app端开发步骤说明】
步骤5:商户后台接收支付通知。api参见【支付结果通知API】
步骤6:商户后台查询支付结果。,api参见【查询订单API】
1.流程3请求后端生成订单,流程7中返回信息要求格式,接口返回订单格式 2.将生成的订单,在用户确认支付时,进入流程9,使用android提供的bridge吊起微信支付,用户输入密码,将支付状态通过bridge的回调函数传递回来 3.将回调成功之后,想后端查询订单支付结果,后端返回支付结果,根据支付结果显示支付状态
bridge封装
function wechatPayment(payInfo, callback) { if (isAndroid) { window.flexBusJs && window.flexBusJs.callWxPay && window.flexBusJs.callWxPay(payInfo); } if (isIos) { window.webkit && window.webkit.messageHandlers && window.webkit.messageHandlers.bus && window.webkit.messageHandlers.bus.postMessage({ key: 'wxpay', payReq: payInfo, }); } if (!window.wxPayHandler) { window.wxPayHandler = function wechartHandler(result) { // console.debug(result, typeof result, 'paymentResult==='); try { result = decodeURIComponent(result); result = JSON.parse(result); } catch (e) { console.debug(e, 'e='); } wechartHandles.forEach(cb => { cb(result); }); }; } wechartHandles.push(callback); }支付代码:
awaitWraper(promise) { return promise .then(res => [null, res]) .catch(err => [err, null]); }, async wechatSubmit(params) { if (!params) return; // 获取订单信息 const [payError, payData] = await this.awaitWraper(api.et.wechatOrderInfo(params)); if (payError) { console.debug(payError, '获取订单支付信息失败!'); this.$toast.error('获取订单支付信息失败!'); return; } const data = payData.data || {}; // 将订单信息转换程bridge中需要的订单格式 let payInfo = { appid: data.appId || '', partnerid: data.partnerId || '', prepayid: data.prepayId || '', timestamp: data.timeStamp || '', package: data.packageValue || '', noncestr: data.nonceStr || '', sign: data.sign || '' }; payInfo = JSON.stringify(payInfo) || ''; await this.wechatPayment(payInfo); }, // 吊起微信支付,返回支付结果 async wechatPayment(payInfo) { if (!payInfo) { this.$toast.error('订单信息参数不存在!'); return; } const _this = this; // 微信支付bridge await this.$bridge.wechatPayment(payInfo, async paymentData => { // errCode 表示微信支付状态0为成功 if (paymentData && paymentData.errCode === 0) { // 双重校验,查询后端支付结果 await _this.checkWechatSign(); } else { _this.$toast.error('支付失败!'); console.debug(paymentData, 'alipayMent==resultStatus==error===='); } }); }, // 后端查询订单支付结果 async checkWechatSign() { const param = { orderId: this.orderInfo.id || '', }; const [callbackError, callbackData] = await this.awaitWraper(api.et.checkWechatOrder(param)); if (callbackError) { this.$toast.error('支付失败!'); console.debug(callbackError, '支付失败!'); return; } const data = (callbackData && callbackData.data) || {}; // 成功之后的订单显示 this.finishPaymentSuccess(data); },注意: 每个android中定义的brigde中订单参数可能会有略微不同,根据项目实际对接。
微信支付开发文档
