千家信息网

微信小程序充值页面及小程序支付后回调怎么实现

发表于:2025-11-09 作者:千家信息网编辑
千家信息网最后更新 2025年11月09日,本篇内容主要讲解"微信小程序充值页面及小程序支付后回调怎么实现",感兴趣的朋友不妨来看看。本文介绍的方法操作简单快捷,实用性强。下面就让小编来带大家学习"微信小程序充值页面及小程序支付后回调怎么实现"
千家信息网最后更新 2025年11月09日微信小程序充值页面及小程序支付后回调怎么实现

本篇内容主要讲解"微信小程序充值页面及小程序支付后回调怎么实现",感兴趣的朋友不妨来看看。本文介绍的方法操作简单快捷,实用性强。下面就让小编来带大家学习"微信小程序充值页面及小程序支付后回调怎么实现"吧!

用户在小程序中发起充值请求时,一般会先请求自己的服务器,将充值的参数发送给后端,然后后端会去请求微信充值,得到微信返回的统一下单的参数再返回给前端。前端调用wx.requestPayment API 即可唤起微信小程序的支付页面,此时用户输入正确的支付密码即可支付成功。具体流程如下:

1. 比如说页面上有一个充值按钮,点击充值按钮时可以获取到用户请求充值的参数。  

wx.request({  url: "后端的充值接口",   method: "POST",   dataType: "json",   header: {     'content-type': 'application/x-www-form-urlencoded'   },   data: {     amount: amount,  // 充值金额     token: token,     openId: openId   },   success: function (res) {     if (res.data.code == '1') {       that.setData({         payParams: res.data.data  // 后端从微信得到的统一下单的参数       })       that.xcxPay();  // 拿到统一下单的参数后唤起微信支付页面     }    }})
2. 调用 wx.requestPayment 唤起微信支付界面。
wx.requestPayment({   'timeStamp': that.data.payParams.timestamp.toString(),  // 时间戳必须是字符串,否则会报错   'nonceStr': that.data.payParams.str,   'package': 'prepay_id=' + that.data.payParams.prepay_id,  // 这里的值必须是 prepay_id=XXXXXXXXX 的格式,否则也会报错   'signType': 'MD5',   'paySign': that.data.payParams.sign,   'success': function (res) {     // 这里应该是 res.errMsg , 跟公众号的支付返回的参数不一样,公众号是 err_msg, 就因为没注意到这个,折腾了很长时间     if(res.errMsg == "requestPayment:ok"){  // 调用支付成功        wx.redirectTo({              url: '../chargelist/chargelist'   // 充值成功后的处理,可以跳转,也可以根据自己的需要做其他处理         })      }else if(res.errMsg == 'requestPayment:cancel'){      // 用户取消支付的操作    }   },   'fail': function (res) {     return false;   },   'complete': function (res) { }})

到此,相信大家对"微信小程序充值页面及小程序支付后回调怎么实现"有了更深的了解,不妨来实际操作一番吧!这里是网站,更多相关内容可以进入相关频道进行查询,关注我们,继续学习!

0