微信网页JSAPI支付

• 微信jspi支付只适用于微信内部浏览器使用 JSAPI支付官方文档

主要流程分以下一个步骤

1.根据官方文档的（开发步骤）进行一些相应的配置（域名）
2.进入支付界面后立即执行以下代码

window.location.href = 'https://open.weixin.qq.com/connect/oauth2/authorize?appid=' + appid +
                        '&redirect_uri=' + url +
                        '&response_type=code&scope=snsapi_base&state=STATE#wechat_redirect'

链接中的参数解析
appid:是微信支付平台官网的appid
url:是获取到code后要重定向的路由页面 也就是支付页面

• 获取到code后支付页面的url中会携带code 类似于如下链接这种形式

https://xxxxx.com/wap/payOrder.html/?code=abc677adaduiadi7838&state=STATE

3.通过以下代码获取url中code值

getCode () {
   let a = window.location.href
    if (a.split('?').length > 1) {
        let str = a.split('?')[1]
        let arr = str.split('&')
        for (let i in arr) {
            if (typeof arr[i] === 'string') {
                if (arr[i].substring(0, 4) === 'code') {
                    str = arr[i].substring(5)
                    this.h5code = str

                }
            }
        }
    }
},

4.通过code调用后端接口获取支付参数
5.获取到支付参数后 调用微信内置对象进行支付

	h5Pay(paymentData){
				console.log(666,paymentData)
				function onBridgeReady () {
				    WeixinJSBridge.invoke(
				        'getBrandWCPayRequest', {
				            'appId': paymentData.appid, //公众号名称，由商户传入     
				            'timeStamp': paymentData.timeStamp, //时间戳，自1970年以来的秒数     
				            'nonceStr': paymentData.nonceStr, //随机串     
				            'package': paymentData.package,
				            'signType': paymentData.signType, //微信签名方式：     
				            'paySign': paymentData.paySign ,//微信签名 
				        },
				        function (res) {
				            if (res.err_msg === 'get_brand_wcpay_request:ok') {
				              console.log('支付成功')
							  // uni.redirectTo({
							  //     url: '/pages/pay/paycomplete'
							  // })
								window.location.href = `/h5/#/pages/pay/paycomplete`
				            }  else if (res.err_msg === 'get_brand_wcpay_request:cancel') {
				                console.log('取消支付')
								// uni.reLaunch({
								// 	url:`/pages/personal/myOrder?type=${''}&id=0`
								// })
								lwindow.location.href = `/h5/#/pages/personal/myOrder?type=${""}&id=0`
				            } else {
								console.log('支付失败')
								uni.showToast({
									title:'支付失败',
									icon:'none'
								})
								uni.reLaunch({
									url:`/pages/personal/myOrder?type=${''}&id=0`
								})
				            }
				        }
				    )
				}
				if (typeof WeixinJSBridge !== 'undefined') {
					console.log(1)
				    onBridgeReady(paymentData)
				} else {
				    if (typeof WeixinJSBridge === 'undefined') {
						console.log(2)
				        if (document.addEventListener) {
							console.log(3)
				            document.addEventListener('WeixinJSBridgeReady', onBridgeReady, false)
				        } else if (document.attachEvent) {
							console.log(4)
				            document.attachEvent('WeixinJSBridgeReady', onBridgeReady)
				            document.attachEvent('onWeixinJSBridgeReady', onBridgeReady)
				        }
				    }
				}
			},

注意：支付完成或者取消支付后的跳转一定要用 window.location.href 跳转到指定页面