vue-element-admin 连接 springboot 项目的 login接口,完成登录验证

一、前端：

1.设置前端指向的接口通信的地址。

   这里面.env.development=>开发环境（这里的设置入口是：开发环境）

           .env.production=>生产环境

           BASE_API和具体的路径进行拼接

2.解决跨域问题

在vue.config.js文件中

1. 设置跨域配置 proxy属性

2. 设置 target属性：跨域的地址

3. 是否容许跨域

4. 注释模拟数据 mock就是给" before: require('./mock/mock-server.js') " 给注释掉

3.进行接口通信 

在user.js在src下的api文件夹中，把这个user.js文件中的的端口与你后端中的测试端口保持一致

 4.向后端发起请求

找到request.js文件进行设置请求头和使用拦截器

二、后端

springboot

一定要先添加maven依赖项，用代码生成器生成这些包文件，修改数据库等一些配置，写/user/login接口和info接口。

可以用QueryWrapper获取当前用户登录的身份编号

这里是/user/login接口，这里面的ResponseUtil是自己建的方法文件，里面有很多方法，也可以添加自己需要的方法，这里进行直接引用

这里面的第一个红框里的内容，这里的IUser1Service最好是代码生成器生成的，不然容易报错。这个名字是根据你的表名而定的

 这个是info接口，如果需要其他的接口也可以自行添加

注意：在Preview中，这里面的格式要写对

 

 三、报错情况

这种情况，先检查你的maven依赖项

 这个是info接口没写，或者写错了，检查你后端的info接口

 

 还有一些控制台的错误可以查查百度