微信JSAPI支付流程详细描述
一、前言本文将详细描述微信JSAPI支付的流程，包括内部起调H5支付和支付完成跳转公众号并发送公众号消息模板。
二、获取用户OpenID在进行微信JSAPI支付之前，我们需要先获取用户的OpenID。由于OpenID是必传的，所以我们需要按照以下步骤来获取它：
1. 获取code首先，我们需要让用户点击一个带有授权作用的链接，这个链接会跳转到微信的授权页面。在这个页面，用户可以选择是否授权我们的应用。授权成功后，微信会将code传递给我们。
```javascript// 强制关注...
wx.chooseWXApp({
success: function (res) {
if (res.err_msg == "get_user_info:ok") {
// 用户已同意授权 wx.getUserInfo({
success: function (res) {
console.log(res);
}
})
} else {
console.log('用户未同意授权');
}
},
cancel: function () {
console.log('用户取消了授权');
}
});
```
2. 获取OpenID获取code后，我们需要将其传递给微信服务器，换取OpenID。我们可以使用wx.requestAPI来实现这个功能。
```javascript// 使用wx.requestAPI获取OpenIDwx.request({
url: ' method: 'GET',
success: function (res) {
console.log(res);
},
fail: function () {
console.log('获取OpenID失败');
}
});
```
三、内部起调H5支付在获取用户OpenID后，我们可以使用wx.requestPaymentAPI来内部起调H5支付。
```javascript// 内部起调H5支付wx.requestPayment({
'timeStamp': timestamp,
'nonceStr': nonceStr,
'package': packageValue,
'signType': signType,
'paySign': paySign,
success: function (res) {
console.log('支付成功');
},
fail: function () {
console.log('支付失败');
}
});
```
四、支付完成跳转公众号并发送公众号消息模板在内部起调H5支付成功后，我们可以使用wx.redirectToAPI来跳转到我们的公众号。
```javascript// 支付完成跳转公众号wx.redirectTo({
url: '/pages/index/index',
success: function () {
console.log('跳转成功');
},
fail: function () {
console.log('跳转失败');
}
});
```
在跳转到我们的公众号后，我们可以使用wx.requestAPI来发送公众号消息模板。
```javascript// 发送公众号消息模板wx.request({
url: ' method: 'POST',
data: {
"touser": openid,
"template_id": templateId,
"url": url,
"data": {
"first": {
"value": "支付成功",
"color": "173177"
},
"keyword1": {
"value": "￥" + price,
"color": "173177"
},
"remark": {
"value": "感谢您的支持",
"color": "173177"
}
}
},
success: function (res) {
console.log('发送成功');
},
fail: function () {
console.log('发送失败');
}
});
```
以上就是微信JSAPI支付流程的详细描述。
