由于最近公司业务调整,需要在小程序的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>';
然后跳转给小程序的某个页面:
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();
}
})
},