uniapp h5 公众号 支付

接入前准备

下面封装好的方法 将接口返回的参数替换掉就可以了

function onBridgeReady(url, data, callback) {
	uni.request({
		url: api[url],//接口地址
		method: 'POST',
		header: {
			'content-type': 'application/x-www-form-urlencoded',
			"Authorization": 'Bearer ' + uni.getStorageSync('token')
		},
		data: data,
		success(res) {
			if(res.statusCode == 200){
				WeixinJSBridge.invoke(
					'getBrandWCPayRequest', {
						"appId": "88888888", //公众号ID，由商户传入     
						"timeStamp": res.data.data.config.timestamp, //时间戳，自1970年以来的秒数     
						"nonceStr": res.data.data.config.nonceStr, //随机串     
						"package":res.data.data.config.package,
						"signType":res.data.data.config.signType, //微信签名方式：     
						"paySign": res.data.data.config.paySign //微信签名 
					},
					function(res) {
					    console.log('方法',res)
						if (res.err_msg == "get_brand_wcpay_request:ok") {
							callback(res)
							// 使用以上方式判断前端返回,微信团队郑重提示：
							//res.err_msg将在用户支付成功后返回ok，但并不保证它绝对可靠。
						}
					});
			}
			
		}
	})
	
}

点击按钮调用就可以调用微信支付了 

// 充值
			    bindchange(){
			        const that = this;
			        let data = {
			            gold_coin_id:that.moneyIndex
			        }
                          //调用封装的方法           
			        $.onBridgeReady('recharge',data,res =>{
			            console.log(res)
			            if(res.errMsg == 'requestPayment:ok'){
			                that.userInfo()
			            }
			            
			        })
			    },

然后在uniapp 上发行 

然后在公众号上设置链接 在本地或者微信开发者工具上是调用不起来的  因为要求是微信内置浏览器才可以用这个方法

  然后进入页面调用支付就可以了