关键词：
文章目录
Springboot+Vue博客项目总结
1.工程搭建
1.1 新建maven工程
<?xml version="1.0" encoding="UTF-8"?>
<project xmlns="http://maven.apache.org/POM/4.0.0"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd">
<modelVersion>4.0.0</modelVersion>
<groupId>com.mszlu</groupId>
<artifactId>blog-parent</artifactId>
<version>1.0-SNAPSHOT</version>
<parent>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-parent</artifactId>
<version>2.5.0</version>
<relativePath/>
</parent>
<properties>
<project.build.sourceEncoding>UTF-8</project.build.sourceEncoding>
<project.reporting.outputEncoding>UTF-8</project.reporting.outputEncoding>
<java.version>1.8</java.version>
</properties>
<dependencies>
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter</artifactId>
<!-- 排除 默认使用的logback -->
<exclusions>
<exclusion>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-logging</artifactId>
</exclusion>
</exclusions>
</dependency>
<!-- log4j2 -->
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-log4j2</artifactId>
</dependency>
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-aop</artifactId>
</dependency>
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-mail</artifactId>
</dependency>
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-web</artifactId>
</dependency>
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-test</artifactId>
<scope>test</scope>
</dependency>
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-data-redis</artifactId>
</dependency>
<dependency>
<groupId>com.alibaba</groupId>
<artifactId>fastjson</artifactId>
<version>1.2.76</version>
</dependency>
<dependency>
<groupId>mysql</groupId>
<artifactId>mysql-connector-java</artifactId>
</dependency>
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-configuration-processor</artifactId>
<optional>true</optional>
</dependency>
<dependency>
<groupId>org.apache.commons</groupId>
<artifactId>commons-lang3</artifactId>
</dependency>
<dependency>
<groupId>commons-collections</groupId>
<artifactId>commons-collections</artifactId>
<version>3.2.2</version>
</dependency>
<dependency>
<groupId>com.baomidou</groupId>
<artifactId>mybatis-plus-boot-starter</artifactId>
<version>3.4.3</version>
</dependency>
<dependency>
<groupId>org.projectlombok</groupId>
<artifactId>lombok</artifactId>
</dependency>
<!-- https://mvnrepository.com/artifact/joda-time/joda-time -->
<dependency>
<groupId>joda-time</groupId>
<artifactId>joda-time</artifactId>
<version>2.10.10</version>
</dependency>
</dependencies>
<build>
<plugins>
<plugin>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-maven-plugin</artifactId>
</plugin>
</plugins>
</build>
</project>
1.2 application.properties配置
#server
server.port= 8888
spring.application.name=mszlu_blog
# datasource
spring.datasource.url=jdbc:mysql://localhost:3306/blogxpp?useUnicode=true&characterEncoding=UTF-8&serverTimeZone=UTC
spring.datasource.username=root
spring.datasource.password=root
spring.datasource.driver-class-name=com.mysql.cj.jdbc.Driver
#mybatis-plus
mybatis-plus.configuration.log-impl=org.apache.ibatis.logging.stdout.StdOutImpl
#定义前缀表名，因为数据库中的表带ms_。这样实体类的表不用加前缀就可以匹配
mybatis-plus.global-config.db-config.table-prefix=ms_
1.3 配置分页插件
不知道的可以查看MyBatis-Plus官网关于分页插件的介绍
@Configuration
//扫包，将此包下的接口生成代理实现类，并且注册到spring容器中
@MapperScan("com.xpp.blog.dao.mapper")
public class MybatisPlusConfig
//集成分页插件
@Bean
public MybatisPlusInterceptor mybatisPlusInterceptor()
MybatisPlusInterceptor interceptor = new MybatisPlusInterceptor();
interceptor.addInnerInterceptor(new PaginationInnerInterceptor());
return interceptor;
1.4 配置解决跨域
解决跨域问题可以参考：SpringBoot解决跨域的5种方式
前后端端口不一样，需要解决跨域问题。
这里解决的方法是重写WebMvcConfigurer：
@Configuration
public class WebConfig implements WebMvcConfigurer
@Autowired
private LoginInterceptor loginInterceptor;
//跨域配置，前端和后端端口不一样
@Override
public void addCorsMappings(CorsRegistry registry)
//8080前端使用的端口号
registry.addMapping("/**").allowedOrigins("http://localhost:8080");
1.5 添加启动类
@SpringBootApplication
public class BlogApp
public static void main(String[] args)
SpringApplication.run(BlogApp.class,args);
2.统一异常处理
不管是controller层还是service，dao层，都有可能报异常，如果是预料中的异常，可以直接捕获处理，如果是意料之外的异常，需要统一进行处理，进行记录，并给用户提示相对比较友好的信息。
@ControllerAdvice：对加了@Controller的方法进行拦截处理，AOP的实现@ExceptionHandler：统一处理某一类异常，从而减少代码重复率和复杂度，比如要获取自定义异常可以@ExceptionHandler(BusinessException.class)
//作用：对加了@Controller的方法进行拦截处理，AOP的实现
@ControllerAdvice
public class AllExceptionHandler
//进行一次处理，处理Exception.class的异常
@ExceptionHandler(Exception.class)
//返回json数据，不加的话直接返回页面
@ResponseBody
public Result doException(Exception e)
e.printStackTrace();
return Result.fail(-999,"系统异常");
3.登录功能实现
3.1 接口说明
接口url：/login
请求方式：POST
请求参数：
| 参数名称 | 参数类型 | 说明 |
|---|---|---|
| account | string | 账号 |
| password | string | 密码 |
返回数据：
"success": true,
"code": 200,
"msg": "success",
"data": "token"
3.2 JWT
可以参考：JWT整合Springboot
登录使用JWT技术：
- jwt 可以生成 一个加密的
token，做为用户登录的令牌，当用户登录成功之后，发放给客户端。 - 请求需要登录的资源或者接口的时候，将
token携带，后端验证token是否合法。
jwt 有三部分组成：A.B.C
- A：
Header，“type”:“JWT”,“alg”:“HS256” 固定 - B：
playload，存放信息，比如，用户id，过期时间等等，可以被解密，不能存放敏感信息 - C:
签证，A和B加上秘钥加密而成，只要秘钥不丢失，可以认为是安全的。
jwt 验证，主要就是验证C部分是否合法。
依赖包：
<dependency>
<groupId>io.jsonwebtoken</groupId>
<artifactId>jjwt</artifactId>
<version>0.9.1</version>
</dependency>
工具类：
public class JWTUtils
//密钥
private static final String jwtToken = "123456Mszlu!@#$$";
//生成token
public static String createToken(Long userId)
Map<String,Object> claims = new HashMap<>();
claims.put("userId",userId);
JwtBuilder jwtBuilder = Jwts.builder()
.signWith(SignatureAlgorithm.HS256, jwtToken) // 签发算法，秘钥为jwtToken
.setClaims(claims) // body数据，要唯一，自行设置
.setIssuedAt(new Date()) // 设置签发时间
.setExpiration(new Date(System.currentTimeMillis() + 24 * 60 * 60 * 60 * 1000));// 一天的有效时间
String token = jwtBuilder.compact();
return token;
//检查token是否合法
public static Map<String, Object> checkToken(String token)
try
Jwt parse = Jwts.parser().setSigningKey(jwtToken).parse(token);
return (Map<String, Object>) parse.getBody();
catch (Exception e)
e.printStackTrace();
return null;
public static void main(String[] args)
String token=JWTUtils.createToken(100L);
System.out.println(token);
Map<String, Object> map = JWTUtils.checkToken(token);
System.out.println(map.get("userId"));
3.3 Controller
@RestController
@RequestMapping("login")
public class loginController
@Autowired
private LoginService loginService;
@PostMapping
public Result login(@RequestBody LoginParam loginParam)
//登录->验证用户
return loginService.login(loginParam);
3.4 Service
关于这里StringUtils的用法：Java之StringUtils的常用方法
md5加密的依赖包：
<dependency>
<groupId>commons-codec</groupId>
<artifactId>commons-codec</artifactId>
</dependency>
@Service
public class LoginServiceImpl implements LoginService
@Autowired
private SysUserService sysUserService;
@Autowired
private RedisTemplate<String, String> redisTemplate;
//加密盐
private static final String slat = "mszlu!@#";
@Override
public Result login(LoginParam loginParam)
//1.检查参数是否合法
String account = loginParam.getAccount();
String password = loginParam.getPassword();
if (StringUtils.isBlank(account) || StringUtils.isAllBlank(password))
return Result.fail(ErrorCode.PARAMS_ERROR.getCode(), ErrorCode.PARAMS_ERROR.getMsg());
//用md5加密
password = DigestUtils.md5Hex(password + slat);
//2.根据用户名何密码去user表中查询 是否存在
SysUser sysUser = sysUserService.findUser(account, password);
//3.如果不存在 登录失败
if (sysUser == null)
return Result.fail(ErrorCode.ACCOUNT_PWD_NOT_EXIST.getCode(), ErrorCode.ACCOUNT_PWD_NOT_EXIST.getMsg());
//4.如果存在 使用jwt 生成token 返回给前端
String token = JWTUtils.createToken(sysUser.getId());
//5.toekn放入redis，设置过期时间。登录认证的时候先认证token字符串是否合法，在认证redsi认证是否合法
redisTemplate.opsForValue().set("TOKEN_" + token, JSON.toJSONString(sysUser), 1, TimeUnit.DAYS);
return Result.success(token);
/**
* 根据account和password查询用户表
* @param accounvue+springboot博客项目总结(代码片段)
Vue+Springboot博客项目总结技术栈：Vue+Springboot+Mybatis-Plus+Redis+MySQL1、项目环境的搭建1.1、子模块和父模块的依赖问题当父模块使用版本管理进行依赖管理的话，必须声明版本号，如果不这样子模块是无法... 查看详情
springboot和vue集成视频播放组件——基于springboot和vue的后台管理系统项目系列博客（二十二）(代码片段)
系列文章目录系统功能演示——基于SpringBoot和Vue的后台管理系统项目系列博客（一）Vue2安装并集成ElementUI——基于SpringBoot和Vue的后台管理系统项目系列博客（二）Vue2前端主体框架搭建——基于SpringBoot和Vue的后... 查看详情
vue+springboot超详细！一周开发一个springboot+vue+mybatisplus+shiro+jwt+redis前后端分离个人博客项目！！！项目完结(代码片段)
...备前后端分离项目技术栈Java后端接口开发1、前言2、新建Springboot项目3、整合mybatisplus3、统一结果封装4、整合shiro+jwt，并会话共享ShiroConfigAccountRealmJwtTokenAccountProfileJwtFilter5、异常处理6、实体校验7、跨域问题Swagger2配置8、... 查看详情
vue+springboot超详细！一周开发一个springboot+vue+mybatisplus+shiro+jwt+redis前后端分离个人博客项目！！！项目完结(代码片段)
...备前后端分离项目技术栈Java后端接口开发1、前言2、新建Springboot项目3、整合mybatisplus3、统一结果封装4、整合shiro+jwt，并会话共享ShiroConfigAccountRealmJwtTokenAccountProfileJwtFilter5、异常处理6、实体校验7、跨域问题Swagger2配置8、... 查看详情
springboot前后端分离vue个人博客系统(代码片段)
...、技术互助文末获取源码 一，项目简介本项目使用springboot+mybatis+前端vue，使用前后端分离架构实现的个人博客系 查看详情
springboot+vue练手级项目，真实的在线博客系统(代码片段)
文章目录springboot练手实战项目说明基础知识面试准备1.工程搭建1.1新建maven工程1.1.2遇到的bug1.2配置1.3启动类2.首页-文章列表2.1接口说明2.2编码2.2.0Spring—基于注解开发2.2.1表结构entity层2.2.2Controller2.2.3Service2.2.3.0解决mapper爆红2.2.3.... 查看详情
01springboot+security+vue个人博客系统之项目创建(代码片段)
整体项目结构更改后的目录结构为配置pom.xml文件添加依赖<!--security--><dependency><groupId>org.springframework.boot</groupId><artifactId>spring-boot-starter-security</artifactId></depend 查看详情
教学妹开发springboot+vue的博客论坛系统，soesay(代码片段)
今天给大家介绍一个简单的系统。基于springboot+vue的博客论坛系统，如果你想学习更多的项目源码，可以在文章的末尾领取源码资料。当然前面已经开源了很多的项目源码，都是免费学习的：1，挑战一天开... 查看详情
个人博客项目开发总结项目架构及后端开发(代码片段)
一.项目架构1.技术栈介绍（1）后端SpringBoot2：后端服务开发框架MyBatis：数据库交互与管理Redis：数据缓存Shiro：身份与权限管理JWT：前后端分离令牌Quartz：定时任务调度MD5：数据加密Qiniu：七... 查看详情
-文章搜索）博客论坛项目高仿csdn（一篇文章精通系列）(代码片段)
Java之SpringBoot+Vue+ElementUI前后端分离项目（上-项目搭建）Java之SpringBoot+Vue+ElementUI前后端分离项目（中-功能完善-实现查询）Java之SpringBoot+Vue+ElementUI前后端分离项目（下-功能完善-发布文章 查看详情
项目部署vue+springboot前后分离个人博客项目实战部署保姆教程linux+docker安装部署启动一条龙教程(代码片段)
目录SpringBoot开源项目部署在75元阿里云centos7上，小白手把手教程技术栈系统环境需求后端部署步骤redis配置前端域名从如何拥有个人服务器和域名开始说起。在职程序员教你如何选择个人服务器和个人域名，让自己变得IT... 查看详情
java项目:个人博客系统(前后端分离+java+vue+springboot+ssm+mysql+maven+redis)(代码片段)
一、项目简述本系统功能包括：文章展示、热门文章、文章分类、标签云用户登录评论、匿名评论用户留言、匿名留言评论管理、文章发布、文章管理文章数据统计等等．二、项目运行环境配置：Jdkl.8+Tomcats.5... 查看详情
超详细docker部署springboot+vue项目（三更博客项目部署）(代码片段)
文章目录1.项目部署规划2.前置工作2.1修改后端配置文件ip2.2修改前端Vue项目运行端口2.3修改前端对应的服务器ip2.4后端项目打包2.4.1解决打包问题2.4.2项目打包，本地运行jar包测试2.5前端项目打包2.6开放端口2.7配置安全组规则3... 查看详情
springboot+vue前后端分离，两种文件上传方式总结(代码片段)
...作，就是在后端提供一个文件上传接口，这是一个普通的SpringBoot项目，如下：SimpleDateFormatsdf=newS 查看详情
springboot练手项目总结(代码片段)
...6、线程池7、AOP日志缓存8、七牛云9、SpringSecurity项目总结SpringBoot+MybatisPlus+Redis+Vue+SpringSecurity前后端分离个人博客采用前后端分离，前端提供接口，后端根据接口开发，加上后台管理系统采用MybatisPlus优化... 查看详情
最细致的springboot结合vue前后端分离项目打包部署步骤（搭配nginx）(代码片段)
文章目录前言一、环境准备二、SpringBoot项目打jar包1.1使用Maven的package插件打包1.2上传至Linux服务器三、Vue项目打包1.1修改后台请求地址1.2生成dist文件1.3上传至linux服务器三、配置Nginx四、启动项目1.1启动Nginx服务器1.2启动SpringBoot1... 查看详情
前端项目笔记总结(代码片段)
技术栈：SpringBoot+vue3.0Element-Plus路由采用vue-router图标插件采用echarts5.0编写vite热更新能力更新速度非常快提高了开发的体验启动命令：npmrunserve列表采用el-table进行编写，并且采用el-pagination作为分页组件。通过globalP... 查看详情
博客项目踩坑-couldnotwritejson:infiniterecursion(stackoverflowerror)(代码片段)
之前用SpringBoot+JPA+Thymeleaf的方式开发过一个博客系统，现在想要将博客系统改造成前后端分离的方式（前端Vue，后端SpringBoot），开发过程中遇到CouldnotwriteJSON:Infiniterecursion(StackOverflowError)的问题。控制台... 查看详情