美文网首页vue相关问题
vue在微信端自动获取微信openid

vue在微信端自动获取微信openid

作者: 一条小团团ovo的就很棒 | 来源:发表于2019-06-27 15:29 被阅读0次
    //在导航进入该路由之前
    beforeRouteEnter(to, from, next) {
        next(_this=>{
          let openid=getCookie('openid')
          //如果没有openid,直接微信获取
          if(!openid){
          //判断是否为微信环境
            if(_this.isWeixin){
              let code=_this.getUrlKey('code');
              if(code){
                let data={
                  code:code
                }
                codeGetOpenid(data).then((res)=>{
                  if(res.data.error==0){
                    openid=res.data.datArr.openid;
                    setCookie('openid',openid)
                    //跳转当前页面并加上参数
                    window.location.replace('/scanLogin/checkingCaller?event_id='+_this.event_id)
                  }else{
                    Toast.fail(res.data.msg);
                    window.location.replace('/scanLogin/checkingCaller?event_id='+_this.event_id)
                  }
                })
              }else{
                _this.getCodeApi('wx')
              }
            }else{
              Toast.fail('请在微信客户端打开')
            } 
          }
        })
      },
     methods: {
        //获取url参数
        getUrlKey(name){   
           return decodeURIComponent((new RegExp('[?|&]'+name+'='+'([^&;]+?)(&|#|;|$)').exec(location.href)||[,""])[1].replace(/\+/g,'%20'))||null;
        },
        //获取code
        getCodeApi(state){
          let data={
            url:location.href
          }
          getWXconfig(data).then((res)=>{
            let Data = res.data;
            let appId=Data.appId
            // config信息验证后会执行ready方法,所有接口调用都必须在config接口获得结果之后,config是一个客户端的异步操作
              wx.config({
                debug: false, // 开启调试模式,开发时可以开启
                appId: Data.appId,   // 必填,公众号的唯一标识   由接口返回
                timestamp: Data.timestamp, // 必填,生成签名的时间戳 由接口返回
                nonceStr: Data.nonceStr,    // 必填,生成签名的随机串 由接口返回
                signature: Data.signature,   // 必填,签名 由接口返回
                jsApiList: [] // 此处填你所用到的方法
            });
            let urlNow=encodeURIComponent(window.location.href);
            let scope='snsapi_base';    //snsapi_userinfo   //静默授权 用户无感知
            let url="http://m.yunbisai.com/wechat/Openid?url="+urlNow;
            window.location.replace(url);
          })    
        },
        isWeixin(){
          const ua = window.navigator.userAgent.toLowerCase();
          if(ua.match(/MicroMessenger/i) == 'micromessenger'){
            return true;
          } else {
            return false;
          }
        },
      }
    

    相关文章

      网友评论

        本文标题:vue在微信端自动获取微信openid

        本文链接:https://www.haomeiwen.com/subject/awhrcctx.html