前后端分离------后端创建笔记(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 第二个是端口,端口并不一致,端口不一致也被认为是跨域,但如果你是发给自己,那么就不会发生这种情况,异步调用,如果发给不同的服务器和端口就会出现这种情况。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.rhkb.cn/news/87960.html

如若内容造成侵权/违法违规/事实不符,请联系长河编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

Mybatis动态SQL

此文章为笔记,为阅读其他文章的感受、补充、记录、练习、汇总,非原创,感谢每个知识分享者。 文章目录 一、MyBatis动态 sql 是什么二、MyBatis标签三、MyBatis关联查询 一、MyBatis动态 sql 是什么 动态 SQL 是 MyBatis 的强大特性之一。在 …

JavaWeb 中对 HTTP 协议的学习

HTTP1 Web概述1.1 Web和JavaWeb的概念1.2 JavaWeb技术栈1.2.1 B/S架构1.2.2 静态资源1.2.3 动态资源1.2.4 数据库1.2.5 HTTP协议1.2.6 Web服务器 1.3 Web核心 2 HTTP2.1 简介2.2 请求数据格式2.2.1 格式介绍2.2.2 实例演示 2.3 响应数据格式2.3.1 格式介绍2.3.2 响应状态码2.3.…

Nonebot实战之编写插件1

前言 应粉丝群内粉丝要求,我也决定写一个Nonebot插件编写教程,从0开始教学。有些不对的地方也欢迎大家指正,修改。 开始 准备 合适的代码编辑器一定的python基础懂得提问的方式 代码编辑器 代码编辑器有很多种选择,比如 vsc…

TFRecords详解

内容目录 TFRecords 是什么序列化(Serialization)tf.data 图像序列化(Serializing Images)tf.Example函数封装 小结 TFRecords 是什么 TPU拥有八个核心,充当八个独立的工作单元。我们可以通过将数据集分成多个文件或分片(shards)…

Redis 搭建分片集群

文章目录 0.10.2 散列插槽0.3 集群伸缩0.3.1 需求分析0.3.1 创建新的 Redis 实例0.3.3 添加新节点到 Redis0.3.4 转移插槽 0.4 故障转移0.4.1 自动故障转移0.4.2 生动故障转移 0.5 RedisTemplate访问分片集群 1. 集群架构2. 准备实例和配置3. 启动4. 创建集群5. 测试 0.1 主从…

企业服务器被devos勒索病毒攻击后怎么处理,devos勒索病毒如何攻击的

众所周知,科学技术是第一生产力,科学技术的发展给企业与人们的生活带来了极大变化,但随之而来的网络安全威胁也不断增加。最近,我们收到很多企业的求助,企业的计算机服务器遭到了devos勒索病毒的攻击,导致企…

第17章-Spring AOP经典应用场景

文章目录 一、日志处理二、事务控制三、参数校验四、自定义注解五、AOP 方法失效问题1. ApplicationContext2. AopContext3. 注入自身 六、附录1. 示例代码 AOP 提供了一种面向切面操作的扩展机制,通常这些操作是与业务无关的,在实际应用中,可…

Golang-语言源码级调试器 Delve

前言 Go 目前的调试器有如下几种: GDB 最早期的调试工具,现在用的很少。LLDB macOS 系统推荐的标准调试工具,单 Go 的一些专有特性支持的比较少。Delve 专门为 Go 语言打造的调试工具,使用最为广泛。 本篇简单说明如何使用 Del…

Mongoose http server 例子

今天抽了点时间看了一下 mongoose的源码, github 地址,发现跟以前公司内部使用的不太一样,这里正好利用其 http server 例子来看一下。以前的 http message 结构体是这样的: /* HTTP message */ struct http_message {struct mg_…

CentOS7.7.1908升级python3版本

介绍 本文将详细介绍在CentOS7.7.1908系统的服务器将自带的python版本升级到3.8.0版本的过程。 在升级前CentOS7.7.1908中已经存在旧python版本。 查看CentOS版本命令: cat /etc/centos-release升级前后的python版本(python3升级前为3.6.8&#xff09…

css3背景渐变

1.线性渐变 <style>.box {width: 200px;height: 200px;border: 1px solid black;float: left;margin-left: 50px;}.box1 {background-image: linear-gradient(green, yellow, red);}/* 右上 */.box2 {background-image: linear-gradient(to right top, green, yellow, re…

基于Java+SpringBoot+Vue的书籍学习平台设计与实现(源码+LW+部署文档等)

博主介绍&#xff1a; 大家好&#xff0c;我是一名在Java圈混迹十余年的程序员&#xff0c;精通Java编程语言&#xff0c;同时也熟练掌握微信小程序、Python和Android等技术&#xff0c;能够为大家提供全方位的技术支持和交流。 我擅长在JavaWeb、SSH、SSM、SpringBoot等框架…

Leetcode-每日一题【剑指 Offer 20. 表示数值的字符串】

题目 请实现一个函数用来判断字符串是否表示数值&#xff08;包括整数和小数&#xff09;。 数值&#xff08;按顺序&#xff09;可以分成以下几个部分&#xff1a; 若干空格一个 小数 或者 整数&#xff08;可选&#xff09;一个 e 或 E &#xff0c;后面跟着一个 整数若干空…

Matlab时频工具箱tftb下载及安装

Matlab 时频工具箱下载及安装 首先下载安装包安装包地址如下 链接: https://tftb.nongnu.org/ 点击下面的download 跳转到如下界面&#xff0c;选择下面的安装包下载 下载之后得到一个压缩包 然后找到Matlab的安装目录&#xff0c;右键桌面图标&#xff0c;打开文件所在位置…

图论——最短路算法

引入&#xff1a; 如上图&#xff0c;已知图G。 问节点1到节点3的最短距离。 可心算而出为d[1,2]d[2,3]112,比d[1,3]要小。 求最短路径算法&#xff1a; 1.Floyd(弗洛伊德) 是一种基于三角形不等式的多源最短路径算法。边权可以为负数 表现为a[i,j]a[j,k]<a[i,k]。 …

电脑mfc140u.dll丢失的怎么办呢?这个方法亲测可以解决

修复mfc140u.dll是我最近遇到的一个技术问题&#xff0c;虽然在解决过程中遇到了一些困难&#xff0c;但最终的成功修复让我对技术的力量有了更深的体会。 首先&#xff0c;我想谈谈遇到问题时的困惑。当我尝试运行一个应用程序时&#xff0c;突然弹出一个错误提示&#xff0c;…

Fireworks CS6 不能把文件拖进去

打开软件安装文件夹 我的是&#xff1a;C:\Program Files\Adobe Fireworks CS6\Adobe Fireworks CS6 在该位置找到文件【Fireworks.exe】 右键属性 取消勾选&#xff0c;【以管理员身份运行此程序】

使用 HTML、CSS 和 JavaScript 创建多步骤表单

使用 HTML、CSS 和 JavaScript 创建多步骤表单 为了处理又长又复杂的表单&#xff0c;我们需要将它们分成多个步骤。通过一次只在屏幕上显示一些输入&#xff0c;表单会感觉更容易理解&#xff0c;并防止用户感到被大量的表单字段淹没。 在本文中&#xff0c;我将逐步指导如何…

CCLINK转MODBUS-TCP网关cclink通讯接线图 终端电阻

大家好&#xff0c;今天我们要聊的是生产管理系统中的CCLINK和MODBUS-TCP协议&#xff0c;它们的不同使得数据互通比较困难&#xff0c;但捷米JM-CCLK-TCP网关的出现改变了这一切。 1捷米JM-CCLK-TCP是一款自主研发的CCLINK从站功能的通讯网关&#xff0c;它的主要功能是将各种…

Arcgis中影像图切片有白斑或者白点

效果 步骤 1、3dmax渲染或者其它原片 2、Arcgis中加载图片 原数据效果 3、定义投影和转换坐标系等等 我这边测试数据是EPSG:4326的坐标系 4、导出jp2(JPG2000)格式 转换后效果 5、发布服务 6、效果对比