微信登录

文档地址：

developers.weixin.qq.com/doc/oplatfo…

1、跳转到扫码页面

let redirectUri = encodeURIComponent( process.env.VUE_APP_TAOZHI_URL + '/login');
let state = new Date().getTime();
window.localStorage.setItem("user_wx_state", state);
window.location.href = `https://open.weixin.qq.com/connect/qrconnect?
appid=***************
&redirect_uri=${redirectUri}
&response_type=code
&scope=snsapi_login
&state=${state}
#wechat_redirect`

2、扫码完成之后，跳转回 redirect_uri 路径

开始的做法：

1、页面初始化的时候，监听一下路径的参数

2、判断是否有code和state ，并且state 和本地存储的是否一致

3、如果一致则拿着这个code走后台的接口，去获取access_token和refresh_token

4、设置token，更新用户信息，完成登录

问题：

但是这样的话有个问题，code直接在路径上暴露出来了

解决：

1、跳转到扫码页面的时候，加一个 back_url参数，和当前路径一致

2、扫码完成，跳转回来的时候，在路由拦截里拦截一下，走之前的逻辑

3、登录完成之后，跳转到back_url的页面