微信h5支付，支付宝h5支付 详细流程

一、微信h5支付

1.效验是否是微信浏览器

var uAgent = window.navigator.userAgent;
if (uAgent.indexOf("MicroMessenger") > 0) {
	//微信浏览器
}

2.微信h5通过公众号支付

在 uni-app 中可以使用模块方式引用微信 js-sdk ，可以避免与 uni-app 内置 wx 全局对象冲突的问题。

npm 引入

npm install jweixin-module
​
页面引入
import wx from 'jweixin-module';

3.微信授权

var redirectUri=decodeURIComponent('https://pay.***.com') //公众号回调绑定的域名
const wx_appid='******';//正式 auth_user
window.location.href= `https://open.weixin.qq.com/connect/oauth2/authorize?appid=${wx_appid}&redirect_uri=${redirectUri}&response_type=code&scope=snsapi_base#wechat_redirect`

然后请求后台接口返回参数注入微信支付配置

submitPay(){
               this.$u.post('/***', params).then(res => {
                    this.wxConfig(res.data.data)
               })
            },
            /**
             * @param {*} wx 微信JSSDK
             * @param {*} response 后台返回的支付配置文件
             */
            wxConfig(response) {
                // let payInfo=JSON.parse(response.pay_info)
                wx.config({
                    debug: false,
                    appId: response["appId"],
                    timestamp: response["timestamp"], //时间戳
                    nonceStr: response["nonceStr"], //随机串 
                    signature: response["paySign"], //sign
                    jsApiList: ["chooseWXPay"], // 必填，需要使用的JS接口列表 
                });
                this.wxPay(response)
            },
           /**