- A+
由于最近公司业务调整,需要在小程序的webview中拉起小程序的微信支付,经过各种爬坑和搜索,找到如下结果方法,供大家参考:
一、判断小程序浏览器
使用 USER_AGENT判断小程序还是公众号浏览器还是APP:
if(strstr($_SERVER['HTTP_USER_AGENT'],'mini')){ $isminiapp= 1; } $payParam = array(); //支付参数
然后生成支付的参数,支付的签名和统一下单不在此细说,可自行百度或者使用各种开源代码
二、将支付的参数返回给小程序
首先使用php引入一个小程序的js包:
echo '<script type="text/javascript" src='https://res.wx.qq.com/open/js/jweixin-1.3.2.js'></script>';
然后跳转给小程序的某个页面:
echo '<script> wx.miniProgram.navigateTo({ url: '/pages/login/login?json='.json_encode($payParam); })';
url 的地址由小程序提供
三、在小程序里接收此json参数,拉起微信支付
onLoad: function (obj) { console.log(obj) //获取options的订单Id var orderId = obj.orderId; //调起微信支付 wx.requestPayment({ 'appId': '', 'timeStamp': obj.timestamp, 'nonceStr': obj.nonceStr, 'package': 'prepay_id=' + obj.prepay_id, 'signType': obj.signType, 'paySign': obj.paySign, //小程序微信支付成功的回调通知 'success': function (res) { //定义小程序页面集合 var pages = getCurrentPages(); //当前页面 (wxpay page) var currPage = pages[pages.length - 1]; //上一个页面 (index page) var prevPage = pages[pages.length - 2]; //通过page.setData方法使index的webview 重新加载url 有点类似于后台刷新页面 //此处有点类似小程序通过加载URL的方式回调通知后端 该订单支付成功。后端逻辑不做赘述。 prevPage.setData({ url: '', }), //小程序主动返回到上一个页面。即从wxpay page到index page。此时index page的webview已经重新加载了url 了 //微信小程序的page 也有栈的概念navigateBack 相当于页面出栈的操作 wx.navigateBack(); }, //小程序支付失败的回调通知 'fail': function (res) { console.log("支付失败"), console.log(res) var pages = getCurrentPages(); var currPage = pages[pages.length - 1]; var prevPage = pages[pages.length - 2]; console.log("准备修改数据") prevPage.setData({ url: "https://xxxxxxxxxx/wx_isPayment.jhtml?orderId=" + orderId + '&ispay=0', }), console.log("准备结束页面") wx.navigateBack(); } }) },