springboot vue用户退出 spring boot vue admin

---

前言

前十二节课基本上把后端结构搭建了一遍，当然还有很多知识点没涉及，不过我已经想去写前端界面，至于其他知识点，在实战中再慢慢学习。前端脚手架我选了一款叫Vben Admin的开箱即用框架。
官方地址：Vben Admin

---

一、初始化Vben

1. 克隆

这里可以参考官方文档来做，我这边先fork了https://github.com/vbenjs/vue-vben-admin，然后克隆到本地

git clone [e-mail]:billyshen26/svbadmin-vben.git

2. 安装依赖

然后执行yarn安装依赖，这也是官方推荐的，安装速度还是比较快的。比当年用npm install快的多啊

3.启动

yarn serve

启动也比较快，然后访问，一起顺利。

二、使用/login 接口进行登录

1.跨域

本地测试用的都是localhost，端口不一样后会引起跨域问题，导致请求不可达。这里需要修改下配置

VITE_PROXY = [["/api","http://localhost:8080/api"],
VITE_GLOB_API_URL=/api

2.请求接口/api/login

这里简单改了下返回结构，url等，为了和vben脚手架匹配。

3.请求接口/api/users/getUserInfo

调用完login接口之后，紧接着又调用了getUserInfo，这种设计是比较好的。而且getUserInfo每次刷新页面都会调用，这样设计可以这么理解：当某个已登录用户权限有问题时，管理员对其修正权限后，该用户不用登出再登录直接刷新页面就可以获得到新的权限。

看下结果：

我们使用admin/123 登录后，已经获得到数据库中的名称了

---

总结

1. 这节对之前的spring security的部分内容做了些改动，可以对UsernamePasswordAuthenticationToken做更深入的了解
2. login 和getUserInfo 的设计还是比较普遍，大家得理解这种设计思路

---

问题

1. No content to map due to end-of-input
   
   如果post中body里没有任何数据就会报这个错，而这有可能是跨域问题导致的。

---

代码地址

代码前端代码改动不大，这里只改了个代理，和请求路径加了users，所以这里的代码还是java后端代码

---