最新下载
热门教程
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
微信小程序支付功能的前端代码实例
时间:2022-11-14 22:12:43 编辑:袖梨 来源:一聚教程网
微信小程序 支付功能(前端)的实现
只提供微信小程序端代码:
代码如下 | 复制代码 |
varapp = getApp(); Page({ data: {}, onLoad:function(options) { // 页面初始化 options为页面跳转所带来的参数 varthat =this //登陆获取code wx.login({ success:function(res) { console.log(res.code) //获取openid that.getOpenId(res.code) } }); }, getOpenId:function(code) { varthat =this; wx.request({ url:"https://api.weixin.qq.com/sns/jscode2session?appid=小程序appid&secret=小程序应用密钥&js_code="+ code +"&grant_type=authorization_code", data: {}, method:'GET', success:function(res) { that.generateOrder(res.data.openid) }, fail:function() { // fail }, complete:function() { // complete } }) }, /**生成商户订单 */ generateOrder:function(openid) { varthat =this //统一支付 wx.request({ url:'后台路径', method:'GET', data: { gfee:'商品价钱', gname:'商品名称', openId:openid (商品价钱和商品名称根据自身需要是否传值,openid为必传) }, success:function(res) { varpay = res.data //发起支付 vartimeStamp = pay[0].timeStamp; varpackages = pay[0].package; varpaySign = pay[0].paySign; varnonceStr = pay[0].nonceStr; varparam = {"timeStamp": timeStamp,"package": packages,"paySign": paySign,"signType":"MD5","nonceStr": nonceStr }; that.pay(param) }, }) },
/* 支付 */ pay:function(param) { console.log("支付") console.log(param) wx.requestPayment({ timeStamp: param.timeStamp, nonceStr: param.nonceStr, package: param.package, signType: param.signType, paySign: param.paySign, success:function(res) { // success wx.navigateBack({ delta: 1,// 回退前 delta(默认为1) 页面 success:function(res) { wx.showToast({ title:'支付成功', icon:'success', duration: 2000 }) }, fail:function() { // fail
}, complete:function() { // complete } }) }, fail:function(res) { // fail }, complete:function() { // complete } }) } }) 感谢阅读,希望能帮助到大家,谢谢大家对本站的支持! 微信小程序 支付功能(前端)的实现 只提供微信小程序端代码: varapp = getApp(); Page({ data: {}, onLoad:function(options) { // 页面初始化 options为页面跳转所带来的参数 varthat =this //登陆获取code wx.login({ success:function(res) { console.log(res.code) //获取openid that.getOpenId(res.code) } }); }, getOpenId:function(code) { varthat =this; wx.request({ url:"https://api.weixin.qq.com/sns/jscode2session?appid=小程序appid&secret=小程序应用密钥&js_code="+ code +"&grant_type=authorization_code", data: {}, method:'GET', success:function(res) { that.generateOrder(res.data.openid) }, fail:function() { // fail }, complete:function() { // complete } }) }, /**生成商户订单 */ generateOrder:function(openid) { varthat =this //统一支付 wx.request({ url:'后台路径', method:'GET', data: { gfee:'商品价钱', gname:'商品名称', openId:openid (商品价钱和商品名称根据自身需要是否传值,openid为必传) }, success:function(res) { varpay = res.data //发起支付 vartimeStamp = pay[0].timeStamp; varpackages = pay[0].package; varpaySign = pay[0].paySign; varnonceStr = pay[0].nonceStr; varparam = {"timeStamp": timeStamp,"package": packages,"paySign": paySign,"signType":"MD5","nonceStr": nonceStr }; that.pay(param) }, }) },
/* 支付 */ pay:function(param) { console.log("支付") console.log(param) wx.requestPayment({ timeStamp: param.timeStamp, nonceStr: param.nonceStr, package: param.package, signType: param.signType, paySign: param.paySign, success:function(res) { // success wx.navigateBack({ delta: 1,// 回退前 delta(默认为1) 页面 success:function(res) { wx.showToast({ title:'支付成功', icon:'success', duration: 2000 }) }, fail:function() { // fail
}, complete:function() { // complete } }) }, fail:function(res) { // fail }, complete:function() { // complete } }) } }) |
感谢阅读,希望能帮助到大家,谢谢大家对本站的支持!
相关文章
- 王者荣耀侦探能力大测试攻略 王者荣耀侦探能力大测试怎么过 11-22
- 无期迷途主线前瞻兑换码是什么 11-22
- 原神欧洛伦怎么培养 11-22
- 炉石传说网易云音乐联动怎么玩 11-22
- 永劫无间手游确幸转盘怎么样 11-22
- 无期迷途主线前瞻兑换码是什么 无期迷途主线前瞻直播兑换码介绍 11-22