微信授权登陆nginx代理

    server {
        listen       80;   //监听的端口号
        server_name  wxh5.beta.hqjy.com; 本地访问的域名(host文件也要配置)

        location /{
            proxy_pass http://wxh5.beta.hqjy.com:8080/; 代理的域名加本地项目启用的端口号->nginx服务会代理本地起的服务从而可以在wx开发者工具上调试，因为你的目的就是为了在工具调试本地的微信授权登录的流程
        }
        location /sns{
            # return 666;
            proxy_pass https://api.weixin.qq.com;微信公众号的域名
        }
        # location  /api/ {
        #     proxy_pass http://10.0.99.32:8093/;
        # }
      
    }

host文件配置
127.0.0.1      wxh5.beta.hqjy.com

// 微信登陆
    goWxLogin() {
      // TODO 
      const url = encodeURIComponent(location.href.split('#')[0]); //获取#之前的当前路径
      window.location.href = 'http://open.weixin.qq.com/connect/oauth2/authorize?appid='+this.appid+'&redirect_uri='+url+'&response_type=code&scope=snsapi_userinfo&state=STATE#wechat_redirect'
    }, 


  mounted() {
    if (this.$route.query.code) {
      // 获取code
      var code = this.$route.query.code
      // 通过code 获取access_token&openid
      this.$axios.get('/sns/oauth2/access_token?appid='+this.appid+'&secret='+this.secret+'&code='+code+'&grant_type=authorization_code').then((res) => {
        console.log(JSON.parse(JSON.stringify(res)), '通过code 获取access_token&openid')
        var res = JSON.parse(JSON.stringify(res))
        var access_token = res.data.access_token
        var openid = res.data.openid
        var refresh_token = res.data.refresh_token
        // 刷新access_token
        this.$axios.get('/sns/oauth2/refresh_token?appid='+this.appid+'&grant_type=refresh_token&refresh_token='+refresh_token).then((res) => {
          console.log(JSON.parse(JSON.stringify(res)), '刷新token延长失效时间')
        })
        // 获取unionid
        this.$axios.get('/sns/userinfo?access_token='+access_token+'&openid='+openid+'&lang=zh_CN').then((res) =>{
          console.log(JSON.parse(JSON.stringify(res)), '获取unionid')
          var res = JSON.parse(JSON.stringify(res))
          // res = decodeURIComponent(encodeURIComponent(res)) //兼容微信昵称中文乱码问题
          var unionid = res.data.unionid
          // 拿模数
          this.$api.getRsaPublicKey().then(res => {
            if (res.code === 200) {
              var modulus = res.data.modulus
              // 拿模数和获取微信unionid登陆
              const data = {
                clientType: 'h5',
                modulus: '', // 模数
                unionId: '',
                versionCode: 1
              }
              if (unionid) {
                this.$api.getWeChatLogin(data).then(res =>{
                  if (res.code === 200) {
                    // 登陆成功-设置token到cookie
                    this.$router.push({name:'textualResearch'})
                  }
                })
              }
            }
          })
        })
      })
    }
  },
记得线上也需要配置nginx代理，不然访问wx提供的接口肯定会报错的。

参考网站

https://blog.csdn.net/yuan_life/article/details/91820618

官方文档
https://developers.weixin.qq.com/doc/offiaccount/OA_Web_Apps/Wechat_webpage_authorization.html