微信公众号授权失败，code为null

Question

问题描述

部分用户存在访问公众号内页面时，提示授权失败。而且不是偶现，同一用户每次都无法授权成功。将错误抛出后，发现微信授权时，code为null


我知道上述两张图片的错误码不一致，是我没有保存下来。有一致的时候就是code为null

问题出现的环境背景及自己尝试过哪些方法

前端是vue框架+vue router + vuex
后端是java用的spring boot

（片段一）
我将获取code的代码写在项目的index.html页面，我的想法是已进入就获取code，然后去鉴权。代码如下，事实证明也是可以获取的，因为大部分用户是能正常登录的。
（片段二）
还有一个情况是，我的router里面，/index路由是指向home.vue页面。在home.vue加载的时候调用了两个接口，是需要登陆才能调用的，如果未登陆，后端报401错误码，我在axios的拦截器中，进行拦截，跳转到login（登陆接口）
（片段三）

相关代码

// 请把代码文本粘贴到下方（请勿用图片代替代码）
有两处获得code的代码

// 片段一
// index.html
// 网页授权之获取code
    const code = getUrlParam('code')
    let openId = window.localStorage.getItem('openId')
    if (!openId && !code) {
      const appid = 'wxxxxxxxxxx'
      let url = encodeURIComponent(location.href.split('#')[0])
      window.location.href = 'http://open.weixin.qq.com/connect/oauth2/authorize?appid=' + appid + '&redirect_uri=' +
        url + '&response_type=code&scope=snsapi_userinfo&state=STATE#wechat_redirect'
    }
    //获取url中参数
    function getUrlParam(name) {
      var reg = new RegExp('(^|&)' + name + '=([^&]*)(&|$)')
      var r = window.location.search.substr(1).match(reg)
      if (r != null) return r[2]
      return 'index'
    }

// 片段二
// axios拦截器
let loginHandle
let loginApiFlag = false
let goIndex = false
axios.interceptors.response.use((response) => {
    Toast.clear()
    fromatLog(0, response)
    let { status, data: { code, ...res } } = response
    if (status === 200) {
      // 成功的部分
      return
    }
    return Promise.reject(new Error('请求数据状态错误'))
  }, function (error) {
    Toast.clear()
    fromatLog(1, error)
    let config = error.config
    if (error.response.status === 401) {
      // 请求 login 接口
      if (!loginApiFlag) {
        loginApiFlag = true
        loginHandle = login()
      }
      // 将请求存放在handlers数组中
      return loginHandle.then(() => {
        return axios(config)
      })
    }
    if (goIndex) {
      window.location.href = '/index'
    }
    return Promise.reject(error)
  })

// 片段三
export const login = () => {
  let code = getUrlParam('code')
  return axios.post(`/api/login?code=${code}`)
}
//获取url中参数
    function getUrlParam(name) {
      var reg = new RegExp('(^|&)' + name + '=([^&]*)(&|$)')
      var r = window.location.search.substr(1).match(reg)
      if (r != null) return r[2]
      return 'index'
    }

你期待的结果是什么？实际看到的错误信息又是什么？

大部分的用户是能正常登陆的，有少部分用户一直是授权失败，机型是iphone，目前只能定位到code是null，我觉得应该是我路由跳转的时候有问题。可能没有进入index.html,导致没有进行code获取，因为当我在index.html上写上alert(code),都无法将code抛出，直接没有执行alert。

Answer 1

我之前也出现过code拿不到的情况，你可以参照我写的vue微信网页授权最终解决方案 我当时拿不到

 try {
      // 通过回调链接设置code status
      wechatAuth.returnFromWechat(to.fullPath)
    } catch (err) {
      // 失败，设置状态未登录，刷新页面
      store.dispatch('user/setLoginStatus', 0)
      location.reload()
    }
    // !!!!!!这里我直接判断if(wechatAuth.code)就不行，我赋值到code就可以，之后就没有出现过类似的情况
        const code = wechatAuth.code
    if (code) {
    }
    

微信授权坑很多，一点点来吧