调用微信支付wx.chooseWXPay 详细流程

第一步：配置微信基本配置

  /** 获取微信配置以下的参数后台提供这里切记，经常会报错，因为页面的url的问题，我这里是后台写死的，根据不同的环境配置不同url* */initWxConfig () {this.$fetch(url).then(res => {console.log(res)wx.config({debug: false,appId: res.data.appId,timestamp: res.data.timestamp,nonceStr: res.data.noncestr,signature: res.data.signature,jsApiList: ['chooseWXPay']})wx.ready(res => {wx.checkJsApi({jsApiList: ['chooseWXPay'],success: res => {console.log('checked api:', res)},fail: err => {console.log('check api fail:', err)}})})})}

当你看到这样即获取微信基本配置成功

第二步：调用微信支付

这里需要的参数都是后台自己调取微信之后提供给前端，

这里重点说一下基本错误，

我这边报错是因为后台没有提供paySign支付签名所以报错

这里是需要在微信的商户后台配置支付页面的url，切记是支付页面的上一个页面的路径

    /** 先是用户下单，下完单之后再调取微信支付* */this.$post(url).then(res => {let data = JSON.parse(res.data.paySign)wx.chooseWXPay({// 支付签名时间戳，注意微信jssdk中的所有使用timestamp字段均为小写。但最新版的支付后台生成签名使用的timeStamp字段名需大写其中的S字符timestamp: data.timeStamp,// 支付签名随机串，不长于 32 位nonceStr: data.nonceStr,// 统一支付接口返回的prepay_id参数值，提交格式如：prepay_id=\*\*\*）package: data.package,// 签名方式，默认为'SHA1'，使用新版支付需传入'MD5'signType: data.signType,// 支付签名paySign: data.paySign,// 支付成功后的回调函数success: function (res) {// res.errMsg === 'chooseWXPay:ok'方式判断前端返回,微信团队郑重提示：// res.errMsg将在用户支付成功后返回ok，但并不保证它绝对可靠， 切记。if (res.errMsg === 'chooseWXPay:ok') {that.$router.push({name: 'ReturnPage',query: {orderNo: res.data.orderBaseinfo.orderNo}})}},// 支付取消回调函数cancel: function (res) {Toast('用户取消支付~')},// 支付失败回调函数fail: function (res) {Toast('支付失败~')}})})

第三步：到这里基本都可以调通了，至于怎么处理成功回调和错误回调需根据原型，哈哈
谢谢大家

调用微信支付wx.chooseWXPay 详细流程相关推荐

微信小程序获取用户手机号码，Java后台servlet解密（微信小程序调用微信支付也是大致的流程）
本篇记录说明微信小程序获取用户手机号码,Java后台servlet解密(微信小程序调用微信支付也是大致的流程,详细内容可私信交流) (第一次写博客,写得不好的地方见谅,面向新手,大佬请无视,不喜勿喷 ...
微信公众号页面支付接口java,[Java教程]微信公众号支付（三）：页面调用微信支付JS并完成支付...
[Java教程]微信公众号支付(三):页面调用微信支付JS并完成支付 0 2015-09-15 15:00:30 一.调用微信的JS文件 1.首先要绑定[JS接口安全域名],"公众号设置&q ...
php 调用微信支付的时间戳,前端调用微信支付接口
支付按钮的点击事件$(´.Save_Patient_Msg´).click(function(){ $(´.Save_Patient_Msg´).off(´click´); var hrdfId = ...
java微信web支付开发_微信支付java开发详细第三方支付功能开发之支付宝web端支...
这段时间把支付基本搞完了,因为做的过程中遇到许多问题,特地记录下来,同时方便其他java coder,废话少说,下面开始. 整体思路:在后台,根据参数创建支付宝客户端AlipayClient,发送参数 ...
调用微信支付接口总结
项目里面用到了微信支付的功能,照着文档学习了一下,这里做个总结来记录.项目用到的是anglusJS来做前端开发,我这边简化了,用的ajax进行异步的调用,然后业务也直接写在了控制层(不过不应该 ...
小程序开发调用微信支付以及微信回调地址配置
首先观看微信提供的文档 https://pay.weixin.qq.com/wiki/doc/api/wxa/wxa_api.php?chapter=7_3&index=1 清楚调用微信支付必 ...
微信小程序安卓机型调用微信支付后取消付款会重新调用一次页面的onShow方法
onShow里面写了携带优惠券ID查询的接口,此时该优惠券已经下过单了,故会报错安卓机型会有这个问题,苹果机型暂未发现我这边的解决办法是在调用微信支付前定义一个全局Flag,在页面onShow里判 ...
苹果手机微信PHP问题,安卓、ios APP调用微信支付时，页面出现空白。（php微信支付，app发起微信支付白屏）?...
安卓.ios APP调用微信支付时,页面出现空白我的后端是用php开发的.我是先调用微信的统一下单生成,生成prepay_id预支付订单号,代码如下: public function send_pa ...
H5页面调用微信支付
1.H5页面使用微信支付,首先需要注册微信公众号,在设置与开发>公众号设置>功能设置中配置业务域名.JS接口安全域名.网页授权域名.支付功能页面需在此域名链接下的页面. 2.加入域名后,就 ...

调用微信支付wx.chooseWXPay 详细流程

调用微信支付wx.chooseWXPay 详细流程相关推荐

最新文章

热门文章