小程序超简单的微信支付前端工作来咯

总的来说微信支付的前端工作就两个步骤。非常简单:
第一步:通过向后端请求,获取参数nonceStr、package、paySign、timeStamp。这几个参数必须是通过后端处理返回的数据。也是在下一步调起微信支付必须用到的参数。另外还有一个加密类型可有可无,默认是MD5。

wx.request({
    
    
    url: config.Pay.url,              //向后端请求的链接,这里我是封装好的,所以直接调用
    method:config.Pay.method,  //请求方法类型
    header:config.Pay.header,  //请求头参数
    data:{
    
          //请求参数,包括用户的Openid,费用说明,以及价格。注意:价格的单位为分,所以需要在你的金额基础上乘以100
        UserOpenid:app.globalData.openid,
        Body:'富凯陪护床支付费用',
        Price:this.data.rechargeBlance
    },
    success:res=>{
    
    
        wx.hideLoading()
        wx.requestPayment({
    
       //在成功返回参数以后,使用requestPayment调起微信支付
          nonceStr: res.data.Data.data.NonceStr,
          package: res.data.Data.data.Package,
          paySign: res.data.Data.data.PaySign,
          timeStamp: res.data.Data.data.TimeStamp,
          signType:res.data.Data.data.SignType,
          success:res=>{
    
        //用户支付完执行success
            wx.showToast({
    
    
              title: '支付成功',
              icon:'success'
            })
            this.setData({
    
    
              balance:this.data.balance+this.data.rechargeBlance
            })
          },
          fail:res=>{
    
      //用户取消支付执行fail
            wx.showToast({
    
    
              title: '支付失败',
              icon:'none'
            })
          }
        })
    }
  })

以上就是微信支付的前端工作,很简单。有一些注意事项我都写在了注释里面。请参考代码里的注释进行理解。有问题可以留言哦~

猜你喜欢

转载自blog.csdn.net/weixin_43729943/article/details/108771016