用户登陆实现

接口 url method
登录 /user/login post
获取用户信息 /user/info get
注销 /user/logout post
// 登陆接口返回数据
{"code":20000,"data":{"token":"admin-token"}}
// 获取用户返回数据
{"code":20000,"data":{"roles":["admin"],"introduction":"I am a super administrator","avatar":"<https://wpimg.wallstcn.com/f778738c-e4f8-4870-b634-56703b4acafe.gif","name":"Super> Admin"}}
// 注销返回数据
{"code":20000,"data":"success"}

登陆流程

  1. 前端发送POST请求,携带账号密码
  2. 后端返回一个Map,Map包含一个token字段
  3. 前端发送GET请求,携带token请求用户的信息
  4. 后端返回用户数据

前端去掉mock

  1. 修改 .env.development 中的base api,打包部署的话要修改.env.production
VUE_APP_BASE_API = '<http://localhost:9999>'
  1. 修改vue.config.js,屏蔽mock请求

Untitled

  1. 修改src\api\user.js,将url中的/vue-admin-template去掉

Untitled

  1. 测试,预期会出现跨域错误
  2. 后端做跨域处理测试应该成功,并可在调试窗口观察接口调用情况