微信公众号支付 -- 笔记

1.拉起微信登录获取code码  https://open.weixin.qq.com/connect/oauth2/authorize?appid=xxxxxx&redirect_uri=客户端页面的回调地址&response_type=code&scope=snsapi_base&state=STATE#wechat_redirect

注意 1.客户端页面的回调地址 需要使用 encodeURI(http://xxxxxxxx)

        2.如果是vue的hash模式 执行步骤1会出现拉起登录失败 因为 url上出现两个# 

2.拿到code值去换取微信的 openid

3.发起业务支付流程

payOrder () {
      let payDto = {
        'amount': this.amount,
        'payInfo': this.notice,
        'name': this.name,
        'idCardNum': this.idCardNum,
        'mobile': this.mobile
      }
      wxpayH5Create(payDto).then(result => {
        var resu = result.data.result
        this.onBridgeReady(resu)
      })
    },
onBridgeReady (resu) {
      WeixinJSBridge.invoke(
        'getBrandWCPayRequest', {
        'appId': resu.appid,
        'timeStamp': resu.timeStamp,
        'nonceStr': resu.nonceStr,
        'package': resu.package,
        'signType': resu.signType,
        'paySign': resu.paySign
      },
        (res)=> {if (res.err_msg.indexOf('ok') !== -1) {
            this.$router.push({
              path: 'reportIndex',
              query: {
                name: this.name,
                idCardNum: this.idCardNum,
                mobile: this.mobile
              }
            })
          }
        })
    }

注意:WeixinJSBridge 是微信浏览器内部提供的,其他浏览器无法使用此功能调用支付

原文地址:https://www.cnblogs.com/caoruichun/p/12695382.html