Wechat mobile terminal development - account login authorization

Login authorization to obtain openid

The process ：

adopt appid And some other parameters splice the login authorization link of wechat official account , The callback address filled in will return a code Parameters come back , adopt code Send a request to the background to get openid, this code Can only be used once , Get once openid Later code To void , Acquired openid amount to token, Cache required (storage)

  data () {
      return {
          //  Fill in your appid
          appid: '....',
      }
  },
  methods: {
      //  obtain code
      getWxCode () {
        //  Judge the present url Is there a code return 
        let noCode = window.location.href.indexOf('code=') === -1;
        //  If not code Parameter description login authorization is required when this page is just opened 
        if(noCode){
          // code token url 
          let redirect_uri = location.origin + location.pathname;
          //  Jump to wechat login authorization , The function of each parameter can be checked on wechat public platform 
          window.location.href=`https://open.weixin.qq.com/connect/oauth2/authorize?appid=${this.appid}&redirect_uri=${redirect_uri}&response_type=code&scope=snsapi_userinfo&#wechat_redirect`;
        }
        // If belt code Parameter description login authorization successfully fetched code Pass it to the backstage openid
        else {
          let code = location.href.split('code=')[1].split('&')[0];
          this.getOpenid(code);
        }
      },
      getOpenid (code) {
          //  take code Send it to the background to get openid
          ....
      } 
  }

  

Process assumptions ：

The current login authorization page route is https://www.a.com/#/login

Suppose wechat callback code by 123456

Set the route to access / Automatically access /login Next

Callback results ：

Through the above hypothesis , Then visit https://www.a.com/#/login when , The final result of callback jump will arrive at https://www.a.com Next , Its url The address is https://www.a.com?code=123456, Because the route is set to access / Automatically access /login Next , So it will return to the current authorization page , The address is https://www.a.com?code=123456/#/login, Now explain code The parameter is already in the current route url Next , Take it out and send it to the background to get openid, take openid cache , Then login authorization is completed