开发博客系统

前言

准备工作

数据库表分为实体表和关系表

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

第一，建数据库表

在这里插入图片描述
然后导入前端页面
在这里插入图片描述

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

创建公共模块

就是统一返回值，异常那些东西

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

在这里插入图片描述
自己造一个自定义异常

在这里插入图片描述

普通类

在这里插入图片描述

在这里插入图片描述

mapper

在这里插入图片描述
在这里插入图片描述

获取全部博客

我们只需要返回id，title，content，userId，updateTime就可以了

在这里插入图片描述
所以我们直接定义一个返回的类
在这里插入图片描述
在这里插入图片描述

在这里插入图片描述
在这里插入图片描述
但是这个时间展示不太好看
我们可以设置一下，就是改一下get方法

在这里插入图片描述

这个是方法一，设置get方法，但是注意的是，这个get方法只对date类型的有效，对这个类型没有效果
方法二就是用注解

在这里插入图片描述
在这里插入图片描述
如果是date类型的话，就要设置时区，就是上面的那个注解

前端

在这里插入图片描述
在这里插入图片描述
这样就成功了

获取博客详情

博客详情我们还是和上面的接口返回一样的类

在这里插入图片描述
在这里插入图片描述

如果要实现全部列表展示部分数据，详情列表展示全部数据，可以在get方法那里做文章，那么这样的话，两个接口的返回类型就不一样了，因为get方法都不一样

在这里插入图片描述
在这里插入图片描述

但是我们这样写还没有判断查出来是否为null

我们判断是否为null也可以用注解

在这里插入图片描述
@NotNull表示不能为null
@NotEmpty表示不能null，且不为空
@NotBlank表示不为空

在这里插入图片描述
表示id不能为null
如果参数id为null，就会报这个异常HandlerMethodValidationException

可以捕获一下

在这里插入图片描述
在这里插入图片描述

前端

在这里插入图片描述

在这里插入图片描述
这样就OK了

Jwt令牌

在这里插入图片描述
如果我们使用cookie和session的话
这个负载均衡的作用就是根据网速配置那些东西去让客户端去选择用哪个服务器，这些服务器都是部署的同一个项目
如果用session1的话，如果下一次请求负载均衡换了服务器的话，session就失效了，就找不到了，因为不同的服务器有不同的sessionId
所以在多机多集群的部署下，session就失效了

我们的处理方法之一就是设置一个公共的服务器，专门去存储session这些东西，比如redis，session都存储在这个redis里面，而不是对应的服务器里面

方法二就是生成Jwt令牌
用户第一次访问服务器的时候，就会带着用户信息去访问
然后服务器就会给客户端返回一个令牌，这下有了这个令牌，就是token，就可以携带令牌token去访问不同的服务器了

令牌的有点就是解决了集群环境的认证问题
但是我们需要自己去实现令牌，令牌传递，令牌校验

Jwt官网

在这里插入图片描述
这个就是token，这个不是加密的

第一个是header，声明一个头，说明算法是什么等等
第二个是载荷，声明我们的信息是什么
第三个是签名，
现在开始使用Jwt令牌
先引入依赖

在这里插入图片描述
在这里插入图片描述

在这里插入图片描述
以点来进行分割的
复制到官网去

在这里插入图片描述
上面这个没有签名
现在开始设置签名

签名就是一个key，所以我们还要定义一个key

在这里插入图片描述
在这里插入图片描述

但是报错了，这个是因为我们的签名太短了

在这里插入图片描述

在这里插入图片描述
在这里插入图片描述
但是我们的这个签名是非法的

我们专门来定义一个方法去生成key

在这里插入图片描述
这个就是生成的签名

在这里插入图片描述
现在开始校验token
在这里插入图片描述

在这里插入图片描述
在这里插入图片描述
我们在重新生成一个token

在这里插入图片描述

在这里插入图片描述
在这里插入图片描述
我们来把签名改一下

在这里插入图片描述

用户输入账户密码，生成token，返回给前端，前端存储起来，每次访问都要携带token，每次访问拦截器都要去判断token，校验token

登录

登录的请求和响应数据都可以设置为单独的类
请求就是用户名和密码
响应就是userId，和token

在这里插入图片描述
在这里插入图片描述

在这里插入图片描述

在这里插入图片描述

在这里插入图片描述

这样就成功了

在这里插入图片描述
传入的参数是类的话就用注解Validated
在这里插入图片描述

然后类里面的成员变量就用具体的限制注解

如果传入的参数直接就是基本类型，那么就可以用具体的注解限制了

在这里插入图片描述
在完善一下条件的判断

前端

在这里插入图片描述
我们在前端把token存储在localStorage这里，这样就会一直存着了
在这里插入图片描述
在这里插入图片描述

登录成功这样就存储好了

而且这个不会随着服务器的重启而清空
不会改变
只会随着登录信息的改变而改变

我们这就把token放在header里面了，这样的话，后端只需要用request就可以得到token了
而且每次请求都会携带token

拦截器

在这里插入图片描述
这样我们的拦截器就写成功了
现在开始配置拦截器
就是配置路径那些

在这里插入图片描述
这样我们就成功了

但是值得注意的就是，当我们用postman测试的时候，就要手动添加对应的header才可以测试成功，手动添加user_token
因为poatman没有前端添加header的操作

还有一个点就是localStorage并不是header，localStorage是存储在浏览器中的，长期长达24h
而header是每次请求发出的请求体
所以每次发生请求
每次ajax的时候，都要把localStorage中的token添加到header中
每次ajax，这个我们就要用新的知识了
在这里插入图片描述

这串代码的意思就是每次ajax都把token设置到header中
但是你把这串代码放在一个html中，那么这串代码就只在这个html中生效
所以我们把这个代码放在一个js文件中
然后每个html页面都要引入这个页面

<script src="js/common.js"></script>

在这里插入图片描述
所以这里也要改一下

所以每次请求都会ajax，都会带入token
都会去拦截器中判断，成功的话就正常controller
如果token校验失败的话
就会返回状态码401
意思就是ajax失败了
所以每个ajax失败的请求都要判断一下
我们这里重点判断401状态码
每次ajax失败
所以我们还是写在一个公共的js文件中

在这里插入图片描述
我们去前端页面测试的时候，直接把localStorage删完就可以了

然后就成功了

博客列表页与博客详情页获取个人信息

在这里插入图片描述
定义一个返回的类

在这里插入图片描述
在这里插入图片描述
注意postman测试的时候，一定要手动添加header

在这里插入图片描述

这样就OK了
在这里插入图片描述

在加上一些限制

前端

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

或者这样也可以

由于博客详情页面也要定义getUserInfo这个方法，而且只有url不同
所以我们把这个方法也放在一个公共的js文件中

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

在这里插入图片描述
这样就可以了

注销

右上角有一个注销按钮
注销按钮就是要退出登录
而且每个页面除了登录页面，都有这个功能
所以我们还是写在common.js中

退出登录就是在localstorage中删除token就可以了

在这里插入图片描述

这样就可以了没有后端的操作

发布博客

还是要添加一个请求类

在这里插入图片描述
我们这个设计有点缺陷
就是博客列表那里会显示不是自己的博客，但是没有关系
我们自己写的博客，作者还是自己的

在这里插入图片描述

在这里插入图片描述

在这里插入图片描述
这个可以不用设置，因为有默认值
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

完善一下

前端

在这里插入图片描述这样写是不可以的
因为makedown有mk的获取方式

markdown

这个就是markdown网站

在这里插入图片描述
这个就是对应的组件

在这里插入图片描述

这个是对markdown组件的样式修改

参数对应组件的id即editor
在这里插入图片描述
我们这样写就可以了

在这里插入图片描述
在这里插入图片描述

在这里插入图片描述
但是博客列表那里显示正文的时候，显示了井号，我们可以不用显示的

所以我们可以把博客列表和博客详情返回的类分别处理一下

而且博客列表的内容可以不用显示完全

在这里插入图片描述

在这里插入图片描述

这样就好看多了
还有一个问题就是博客详情页的时候要用markdown的格式来展示

这个就是前端的问题了
用markdown来展示
这个可以去看官网来展示

在这里插入图片描述
我们这样写
但是这样写是id选择器
所以还要增加一个detail的id

在这里插入图片描述

在这里插入图片描述
所以前端这样写就可以了

在这里插入图片描述

样子好多了
但是markdown自己具有样式
我们还要搞一下这个样式

在这里插入图片描述
我们自己去设置了背景
就不会去用markdown的样式了
这个背景设置的是透明状态
那么就默认会用父组件的背景

在这里插入图片描述
这样就正确了

编辑和删除

显示

因为我们登录会显示所有的博客
不管是不是自己写的，都会显示
所以当我们查看不是自己的博客的时候
就不要显示删除和编辑按钮了

怎么判断呢
就在博客详情页面
用返回的数据中的userId与登录的useId进行判断就可以了
不相等的话，就不显示了

所以要求返回的数据中要有userId

在这里插入图片描述
然后前端就可以判断了

在这里插入图片描述

OK了
记得还要把原来的按钮删掉

在这里插入图片描述

成功了

后端

还是要创建新的类

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

前端

在这里插入图片描述

这个没有问题

在这里插入图片描述

在这里插入图片描述

这样就OK了

对了
我们的删除采用逻辑删除

所以改一下

在这里插入图片描述
这样就OK了

在这里插入图片描述

在这里插入图片描述

还有一个问题就是有些时候不会显示完全

是因为我们给contenet的赋值不规范

给markdown的赋值，不能这么草率

在这里插入图片描述

这样赋值才规范，就不会出现有些时候显示，有些时候不显示的问题了

加密加盐

在这里插入图片描述
对称：就是加密与解密的密钥是一样的
非对称：加密与解密的密钥是不一样的

公钥是所有人都可以看到，锁
私钥就是我们可以看到，钥匙

摘要算法：CRC算法，把一段字符串变成固定长度的字符串

在这里插入图片描述
MD5就是摘要算法

在这里插入图片描述
摘要算法是无法解密的
其他两个可以解密

我们用MD5加密
非对称效率比较低

在这里插入图片描述

MD5加密，如果字符串很复杂就无法解密了
如果密码简单，就可以很容易解密了

所以要让密码变的复杂
所以可以加上随机的字符串
这个就是盐值
在这里插入图片描述
在这里插入图片描述

代码测试

我们用的MD5是spring提供的

在这里插入图片描述

在这里插入图片描述
我们可以去解密软件去解密一下
在这里插入图片描述
使用同样的字符串，加密出来的字符串都是一样的

在这里插入图片描述
在这里插入图片描述
总共长度是32位，这个就是盐值的长度
一般不会重复的
基本不会重复
极低的概率会重复

这个是根据用户的mac地址去生成的uuid

明文与盐值直接拼接就可以了

在这里插入图片描述

在这里插入图片描述
看得出来最后加出来的还是32位
这个是无法解密的
我们只需要存储最后的密码和盐值就可以了

注意盐值和最后的密文都是16进制的32位的

工具类

我们现在写一个工具类
分别代表加密和解密

在这里插入图片描述
这样我们就成功了
数据库存储的就是盐和密文

后端

我们没有注册操作
所以直接加密去修改数据库

在这里插入图片描述
在这里插入图片描述
然后就是修改后端登录代码
只需要校验就可以了

在这里插入图片描述
登录接口主要是修改这里
就是判断密码的那里

在这里插入图片描述
我输入的123456就成功了

在这里插入图片描述

这样就失败了，问题主要是后端数据库存储的密码没有64位
在改一下

在这里插入图片描述
这里密码错误会抛出异常，然后被全局异常处理
这个ajax请求是失败的
我们要处理一下前端
在这里插入图片描述
在这里插入图片描述

注意我们可以把这个我们自定义异常的状态码取消掉
这样就是正常返回给前端了
前端就会sucess了，不会err了
因为如果设置为其他状态码
前端就会err
然后res可能就不是简简单单的Result了

总结

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

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

相关文章

【Spring Boot 应用开发】-05 命令行参数

【Spring Boot 应用开发】-05 命令行参数

Spring Boot 常用命令行参数 Spring Boot 支持多种命令行参数&#xff0c;这些参数可以在启动应用时通过命令行直接传递。以下是一些常用的命令行参数及其详细说明&#xff1a; 1. 基本配置参数 --server.port端口号 指定应用程序运行的HTTP端口&#xff0c;默认为8080。 jav…
阅读更多...
20250304学习记录

20250304学习记录

第一部分&#xff0c;先来了解一下各种论文期刊吧&#xff0c;毕竟也是这把岁数了&#xff0c;还什么都不懂呢 国际期刊&#xff1a; EI收集的主要有两种&#xff0c; JA&#xff1a;EI源刊 CA&#xff1a;EI会议 CPCI也叫 ISTP 常说的SCI分区是指&#xff0c;JCR的一区、…
阅读更多...
2024 年 MySQL 8.0.40 安装配置、Workbench汉化教程最简易（保姆级）

2024 年 MySQL 8.0.40 安装配置、Workbench汉化教程最简易（保姆级）

首先到官网上下载安装包&#xff1a;http://www.mysql.com 点击下载&#xff0c;拉到最下面&#xff0c;点击社区版下载 windows用户点击下面适用于windows的安装程序 点击下载&#xff0c;网络条件好可以点第一个&#xff0c;怕下着下着断了点第二个离线下载 双击下载好的安装…
阅读更多...
网络安全检查漏洞内容回复 网络安全的漏洞

网络安全检查漏洞内容回复 网络安全的漏洞

网络安全的核心目标是保障业务系统的可持续性和数据的安全性&#xff0c;而这两点的主要威胁来自于蠕虫的暴发、黑客的攻击、拒绝服务攻击、木马。蠕虫、黑客攻击问题都和漏洞紧密联系在一起&#xff0c;一旦有重大安全漏洞出现&#xff0c;整个互联网就会面临一次重大挑战。虽…
阅读更多...
汽车智能钥匙中PKE低频天线的作用

汽车智能钥匙中PKE低频天线的作用

PKE&#xff08;Passive Keyless Entry&#xff09;即被动式无钥匙进入系统&#xff0c;汽车智能钥匙中PKE低频天线在现代汽车的智能功能和安全保障方面发挥着关键作用&#xff0c;以下是其具体作用&#xff1a; 信号交互与身份认证 低频信号接收&#xff1a;当车主靠近车辆时…
阅读更多...
uiautomatorviewer定位元素报Unexpected ... UI hierarchy

uiautomatorviewer定位元素报Unexpected ... UI hierarchy

发现问题 借鉴博客 Unexpected error while obtaining UI hierarchy android app UI自动化-元素定位辅助工具 Unexpected error while obtaining UI hierarchy&#xff1a;使用uiautomatorviewer定位元素报错 最近在做安卓自动化,安卓自动化主要工作之一就是获取UI树 app端获…
阅读更多...
通俗的方式解释“零钱兑换”问题

通俗的方式解释“零钱兑换”问题

“零钱兑换”是一道经典的算法题目&#xff0c;其主要问题是&#xff1a;给定不同面额的硬币和一个总金额&#xff0c;求出凑成总金额所需的最少硬币个数。如果没有任何一种硬币组合能组成总金额&#xff0c;返回-1。 解题思路 动态规划&#xff1a;使用动态规划是解决零钱兑…
阅读更多...
GBT32960 协议编解码器的设计与实现

GBT32960 协议编解码器的设计与实现

GBT32960 协议编解码器的设计与实现 引言 在车联网领域&#xff0c;GBT32960 是一个重要的国家标准协议&#xff0c;用于新能源汽车与监控平台之间的数据交互。本文将详细介绍如何使用 Rust 实现一个高效可靠的 GBT32960 协议编解码器。 整体架构 编解码器的核心由三个主要组…
阅读更多...
Halcon 车牌识别-超精细教程

Halcon 车牌识别-超精细教程

车牌示例 流程: 读取图片转灰度图阈值分割,找车牌内容将车牌位置设置变换区域形状找到中心点和弧度利用仿射变换,斜切车牌旋转转正,把车牌抠出来利用形态学操作拼接车牌号数字训练ocr开始识别中文车牌 本文章用到的算子(解析) Halcon 算子-承接车牌识别-CSDN博客 rgb1_to_gray…
阅读更多...
UDP透传程序

UDP透传程序

UDP透传程序 本脚本用于在 设备 A 和 设备 B 之间建立 UDP 数据转发桥梁&#xff0c;适用于 A 和 B 设备无法直接通信的情况。 流程&#xff1a; A --> 电脑 (中继) --> B B --> 电脑 (中继) --> A 需要修改参数&#xff1a; B_IP “192.168.1.123” # 设备 B 的…
阅读更多...
Holtek HT82V42A深度解析：CCD/CIS信号处理的集成化解决方案

Holtek HT82V42A深度解析：CCD/CIS信号处理的集成化解决方案

——简化图像采集系统设计的终极利器 一、HT82V42A核心参数与外设资源 HT82V42A是Holtek专为图像传感器信号处理设计的模拟前端芯片&#xff0c;集成CCD/CIS信号处理与LED驱动功能&#xff0c;关键参数如下&#xff1a; 参数类别规格说明信号处理通道单通道CCD/CIS模拟信号输…
阅读更多...
详细分析KeepAlive的基本知识 并缓存路由（附Demo）

详细分析KeepAlive的基本知识 并缓存路由（附Demo）

目录 前言1. 基本知识2. Demo2.1 基本2.2 拓展2.3 终极 3. 实战 前言 &#x1f91f; 找工作&#xff0c;来万码优才&#xff1a;&#x1f449; #小程序://万码优才/r6rqmzDaXpYkJZF 基本知识推荐阅读&#xff1a;KeepAlive知识点 从实战中学习&#xff0c;源自实战中vue路由的…
阅读更多...
记一次误禁用USB导致键盘鼠标失灵的修复过程

记一次误禁用USB导致键盘鼠标失灵的修复过程

背景说明 在电脑上插入了一个USB hub&#xff0c;然后弹窗提示&#xff1a;“集线器端口上出现电涌”&#xff0c;点开让选择“重置”或者“关闭”&#xff0c;不小心点了关闭&#xff0c;结果这个usb口就被关了&#xff0c;再插任何东西都没反应&#xff0c;找了很多办法都恢…
阅读更多...
小米手机如何录制屏幕？手机、电脑屏幕录制方法分享

小米手机如何录制屏幕？手机、电脑屏幕录制方法分享

大家最近有没有遇到想记录手机屏幕操作的情况&#xff1f; 比如精彩的游戏瞬间、有趣的视频教程&#xff0c;或者需要录制屏幕来制作演示材料。小米手机在这方面可是个好帮手&#xff0c;今天就来给你好好唠唠&#xff0c;小米手机如何录制屏幕&#xff0c;以及后续如何处理这…
阅读更多...
如何将JAR交由Systemctl管理？

如何将JAR交由Systemctl管理？

AI越来越火了&#xff0c;我们想要不被淘汰就得主动拥抱。推荐一个人工智能学习网站&#xff0c;通俗易懂&#xff0c;风趣幽默&#xff0c;最重要的屌图甚多&#xff0c;忍不住分享一下给大家。点击跳转到网站 废话不多说&#xff0c;进入正题。下面开始说如何使用 systemctl…
阅读更多...
chrome Vue.js devtools 提示不支持该扩展组件，移除

chrome Vue.js devtools 提示不支持该扩展组件，移除

可能是版本不兼容&#xff0c;可以重新安装&#xff0c;推荐网址极简插件官网_Chrome插件下载_Chrome浏览器应用商店 直接搜索vue&#xff0c;下载旧版&#xff0c;vue2、vue3都支持&#xff0c;上面那个最新版本试了下&#xff0c;vue2的肯定是不能用
阅读更多...
【RabbitMQ】RabbitMQ的核心概念与七大工作模式

【RabbitMQ】RabbitMQ的核心概念与七大工作模式

&#x1f525;个人主页&#xff1a; 中草药 &#x1f525;专栏&#xff1a;【中间件】企业级中间件剖析 在现代分布式系统和微服务架构中&#xff0c;消息队列&#xff08;Message Queue&#xff09; 是解决服务间通信、系统解耦和流量削峰的关键技术之一。而 RabbitMQ 作为一…
阅读更多...
SQLAlchemy系列教程：理解SQLAlchemy元数据

SQLAlchemy系列教程：理解SQLAlchemy元数据

SQLAlchemy是Python开发人员的强大ORM工具。SQLAlchemy中的元数据是对象-关系映射配置的集合&#xff0c;允许开发人员无缝地定义和使用数据库模式。 使用元数据 SQLAlchemy中的元数据充当各种数据库描述符&#xff08;如表、列和索引&#xff09;的容器。这使开发人员能够通…
阅读更多...
MacDroid for Mac v2.3 安卓手机文件传输助手 支持M、Intel芯片 4.7K

MacDroid for Mac v2.3 安卓手机文件传输助手 支持M、Intel芯片 4.7K

MacDroid 是Mac毒搜集到的一款安卓手机文件传输助手&#xff0c;在Mac和Android设备之间传输文件。您只需要将安卓手机使用 USB 连接到 Mac 电脑上即可将安卓设备挂载为本地磁盘&#xff0c;就像编辑mac磁盘上的文件一样编辑安卓设备上的文件&#xff0c;MacDroid支持所有 Andr…
阅读更多...
Android+SpringBoot的老年人健康饮食小程序平台

Android+SpringBoot的老年人健康饮食小程序平台

感兴趣的可以先收藏起来&#xff0c;还有大家在毕设选题&#xff0c;项目以及论文编写等相关问题都可以给我留言咨询&#xff0c;我会一一回复&#xff0c;希望帮助更多的人。 系统介绍 我将从经济、生活节奏、技术融合等方面入手&#xff0c;详细阐述居家养老管理模式兴起的…
阅读更多...
最新文章

Copyright @ 2022~2023