前后端分离------后端创建笔记（03）前后端对接（上）

  本文章转载于【SpringBoot+Vue】全网最简单但实用的前后端分离项目实战笔记 - 前端_大菜007的博客-CSDN博客

仅用于学习和讨论，如有侵权请联系

源码：https://gitee.com/green_vegetables/x-admin-project.git
素材：https://pan.baidu.com/s/1ZZ8c-kRPUxY6FWzsoOOjtA 提取码：up4c
项目概述笔记：https://blog.csdn.net/m0_37613503/article/details/128961102
数据库笔记：https://blog.csdn.net/m0_37613503/article/details/128961401
前端笔记：https://blog.csdn.net/m0_37613503/article/details/128961447
后端笔记：https://blog.csdn.net/m0_37613503/article/details/128961569

1、获取用户信息接口---下

1.1 SQL语句准备好了，我们想调他，还得准备一个sql接口

 1.2 Mapper接口要与id保持一致

 1.3  写一个返回值类型，这里可以用注解写sql语句

2 写完之后，回到userSiver里面，现在想拿角色就随便去拿了，我们用刚才写的方法，传入id，这样我们就能够得到我们的角色列表 

 2.1 起名字roles

 2.2 角色列表也塞进去了，然后返回一下数据,return data,可以得到一个角色列表，同时前端的名称是roles

 2.3 重新运行一下，再打开postman,打开我们的登录接口，，让我测试一下我们的token

2.4 点一下发送

 

2.5 token，在这里，前后端必须使用的软件是postman

 2.6 我们新建一个请求

2.7 我们带上一个参数

 

 2.8 直观的填写token

2.9 发送一下请求，获取用户地址，头像，地址都查出来了

3 除了登录之外，还要注销接口，以前我们用的是session,现在是在redis里，如何去掉token,开始前我们要牢记他是一个post请求，先点一下注销

 

3.1 logout 请求出来了

 

 

3.2 后期token都会在请求头里出现

 3.3 文件里有拦截器，有响应拦截器等等，第一个是响应拦截器

3.4 请求拦截器，他在响应之前帮你做了一件事，帮你塞了一个token进来

 3.5 参数到请求头里面获取，然后把他放到redis删除掉

 

3.6 写上那个token的名字

 

 3.7 把token给他传过去，

 3.8  把数据返回过去

 3.9 logout方法并没有创建，此时我们将他创建一下

3.10 这里有个错误提示，在sevice中有个类没有实现，按住ctrl点击即可

 3.11实现一下类

 

3.12 他的实现逻辑非常简单,token传进来，然后删掉

 3.13 打开redis的管理工具

 3.14 看一下我们redis里面的数据

3.15 里面有一条数据是我们刚才测试的数据

 

 3.16 我再来侧一次登录

 

 

3.17 8513数据已经写到了我们redis里面了

 

 3.18  我測試要複製鍵名

3.19  要坐请求登录的测试，他的请求方式是post

3.20 他需要带一个参数，他带的参数放到header里

 3.21 在这里写一个名字，名字是x-token，然后点击send

 3.22 他说成功，redis有没有被刷掉

 3.23redis数据被刷掉了，以上三个接口都写好了（搭建接口用的技术springBoot和redis+Postman），接下来我们做前后端对接

 

 

4、针前端来做一点点的改造，这里我们先让我们的前端调到我们的后端

4.1 这里先让我们的接口规格是一致的，让我们的url是一致的

4.2 这里的地址，跟我们后面的地址是一致的

 4.3 前面这些是没有的，给他删掉

 

 

4.1

5、现在我想调后端，这里有三份跟环境相关的配置

5.1 第一份开发配置，我想打包部署

 5.2 你打包的话，你就得改第二个生成配置

 5.3 这个改成我们后端的地址

5.4 这个/之前仍然是我们前端的服务地址，我们要访问的是我们的后端， ​​

5.5 这就是我们调用后端接口统一的前缀

 6 再调后端接口的时候，这一节再拼上这一节，就是上面这一节再拼下面这一节，就是完整的配置地址了

 

6.1 看新的配置文件，内置的默认服务

6.2 注释掉

 

7

 7、将前端项目重启一下 ctrl + d

 

7.1

8、看一下控制台，这个报错是在意料之中的

 

8.1

9、以后你只要看到了这个问题，就证明了你犯了一个跨域的问题

 

 

9.1

10、跨域的问题是怎么造成的，你从这个地址访问这个地址，A地址访问到B地址，并且发生了异步调用，这时候就跨域了，因此跨域的条件看什么，看ip地址

 

10.1

11、第一个是ip地址目前我们写的ip地址都是localhost,所以都是一致的

11.1

12 第二个是端口，端口并不一致，端口不一致也被认为是跨域，但如果你是发给自己，那么就不会发生这种情况，异步调用，如果发给不同的服务器和端口就会出现这种情况。