需求是在移动端的微信内置浏览器里使用微信支付，需要跳转到一个自定义的页面去，获取code值，支付成功之后，还要跳转回去原来的页面。
url格式：
/?code=061NnYFa1sSJ4D0DttFa1xCA4G0NnYFU&state=STATE#/wxcode
正则表达式获取微信code：
this.weChatCode = window.location.search.substring(6).split('&')[0]
效果：
微信内置浏览器里使用微信支付，需要注意的点：
1、微信内置浏览器。在严格模式下。无法使用window对象
2、微信返回的code包含在url里面，需要自己去截取
3、返回上一页。微信内置浏览器里，如果想跳转回原来的页面，我们需要在跳转之前就缓存好那个页面地址，可以使用路由跳转
4、设置的跳转链接微信支付redirect_url域名。必须确保微信授权域名填写一致
5、检查下单接口传的appid与获取openid接口的appid是否同一个（需一致）
6、检查appid对应的公众号或小程序后台（mp.），是否配置的授权域名和获取openid的域名一致。授权域名配置路径：微信公众平台--设置--公众号设置--功能设置--网页授权域名
跳转前：
/*** 如果是微信内支付。* 还需要跳转到指定网址，去获取微信code*/getWeChatCode() {let appId = 'xxxxxx'this.$message.info('微信授权中……')let currentUrl = encodeURIComponent('/#/wxcode')window.location.href ='https://open./connect/oauth2/authorize?appid=' +appId +'&redirect_uri=' +currentUrl +'&response_type=code&scope=snsapi_base&state=STATE&connect_redirect=1#wechat_redirect'},
将要跳转到的支付页面：
<template><div class="back-page"><h1>正在支付中……请不要关闭网页</h1><!-- <p>微信内置浏览器获取的：</p>--><!-- <p>原来的url：{{ oldUrl }}</p>--><!-- <p>新的的url：{{ newUrl }}</p>--><!-- <p>wxOrder:::{{ wxOrder }}</p>--><!-- <p>weChatCode:::{{ weChatCode }}</p>--><!-- <p>weChatParameter:::{{ weChatParameter }}</p>--><!-- <p>messageRes::::{{ messageRes }}</p>--><!-- <p>wechatPaySuccess是否购买成功？::::{{ $store.state.user.wechatPaySuccess }}</p>--></div></template><script>export default {data() {return {oldUrl: null, //原来的urlnewUrl: null, //截取#后的路由weChatCode: null, //提取的codewxOrder: null, //wxOrderweChatParameter: null,messageRes: null}},components: {},computed: {},methods: {init() {this.getWeChatCode()},getWeChatCode() {this.oldUrl = window.location.href// 需要用正则处理一下code，因为code位于url中间。格式：/?code=061NnYFa1sSJ4D0DttFa1xCA4G0NnYFU&state=STATE#/wxcodethis.weChatCode = window.location.search.substring(6).split('&')[0]this.wxOrder = this.$store.state.user.wxOrderthis.$mit('SET_WECHATCODE', this.weChatCode)this.weChatPay()},weChatPay() {// 如果是微信内支付。还需要去获取微信codeif (this.weChatCode) {// this.$message.success('调用后台接口，传code了');this.$api.innerWechatpay({ id: this.wxOrder, code: this.weChatCode }).then(res => {if (res.code == 200) {// this.$message.success('通过code成功获取参数');this.weChatParameter = res.datathis.checkWeChatJSBridge()} else {this.$message.error(res.msg)}}).catch(err => {this.$message.error(err)})} else {// this.$message.success('没有微信code！无法支付');}},//解决微信内置对象报错checkWeChatJSBridge() {let vm = thisif (typeof WeixinJSBridge == 'undefined') {if (document.addEventListener) {document.addEventListener('WeixinJSBridgeReady',vm.onBridgeReady(),false)} else if (document.attachEvent) {document.attachEvent('WeixinJSBridgeReady', vm.onBridgeReady())document.attachEvent('onWeixinJSBridgeReady', vm.onBridgeReady())}} else {vm.onBridgeReady()}},//微信内置浏览器类，weChatParameter对象中的参数是3.步骤代码中从后端获取的数据onBridgeReady() {let vm = thislet timestamp = Math.round(vm.weChatParameter.timeStamp).toString()// vm.$message.success('开始调用微信jsapi');// eslint-disable-next-lineWeixinJSBridge.invoke('getBrandWCPayRequest',{appId: vm.weChatParameter.appId, //公众号名称，由商户传入timeStamp: timestamp, //时间戳，自1970年以来的秒数nonceStr: vm.weChatParameter.nonceStr, //随机串package: vm.weChatParameter.package, //预支付交易码signType: vm.weChatParameter.signType, //微信签名方式：paySign: vm.weChatParameter.paySign //微信签名// jsApiList: ['chooseWXPay']},function(res) {vm.$message.success(res)vm.messageRes = res// 使用以上方式判断前端返回,微信团队郑重提示：res.err_msg将在用户支付成功后返回ok，但并不保证它绝对可靠。if (res.err_msg == 'get_brand_wcpay_request:ok') {vm.$message.success('支付成功')vm.number = null// vm.$router.go(-1)vm.$mit('SET_WECHATPAYSUCCESS', true)//window.location.href = vm.BASE_URL + 'index.html#/depositResult'vm.goBack()} else {vm.$message.error('取消支付')vm.$message.error('支付失败')vm.$message.error('即将返回上一页')vm.$mit('SET_WECHATPAYSUCCESS', false)vm.goBack()}})},goBack() {//如果有支付成功，才跳转回去console.log('如果有支付成功，才跳转回去??',this.$store.state.user.wechatPaySuccess)this.$message.success('支付成功，即将返回上一页')console.log('返回地址??')console.log(localStorage.getItem('returnUrl'))console.log(this.$store.state.user.returnUrl)let returnUrl = this.$store.state.user.returnUrlconsole.log('调到缓存的页面地址', returnUrl)// window.open(url);// 截取#后的路由this.newUrl = returnUrl.split('#')[1]console.log('截取#后的路由??', this.newUrl)this.$router.push(this.newUrl)}},created() {this.init()},mounted() {}}</script><style lang="less" scoped>.back-page {width: 100%;margin: 0 auto;h1 {line-height: 50px;margin: 0 auto;}}</style>
