网络知识 娱乐 springboot+vue练手级项目,真实的在线博客系统

springboot+vue练手级项目,真实的在线博客系统

文章目录

  • spring boot 练手实战项目说明
  • 基础知识
  • 面试准备
  • 1. 工程搭建
    • 1.1 新建maven工程
    • 1.1.2遇到的bug
    • 1.2 配置
    • 1.3 启动类
  • 2. 首页-文章列表
    • 2.1 接口说明
    • 2.2 编码
    • 2.2.0 Spring---基于注解开发
      • 2.2.1 表结构
      • entity层
      • 2.2.2 Controller
      • 2.2.3 Service
    • 2.2.3.0 解决mapper爆红
    • 2.2.3.1mybatisplus遇到多表查询怎么办
    • 2.2.3.2创建文件夹时遇到的坑
      • 2.2.4 Dao层
      • 2.2.5 测试
  • 3. 首页-最热标签
    • 3.1 接口说明
    • 3.2 编码
      • 3.2.1 Controller
      • 3.2.2 Service
      • 3.2.3 Dao
      • 3.2.4 测试
  • 4.1. 统一异常处理
  • 4.2. 首页-最热文章
    • 4.2.1 接口说明
    • 4.2.2 Controller
    • 4.2.3 Service
    • 4.2.4 测试
  • 4.3. 首页-最新文章
    • 4.3.1 接口说明
    • 4.3.1 Controller
    • 4.3.2 Service
  • 4.4. 首页-文章归档
    • 4.4.1接口说明
    • 4.4.1 Controller
    • 4.4.2 Service
    • 4.4.3 Dao
    • 4.4.4 测试
  • 5.1. 登录
    • 5.1.1 接口说明
    • 5.1.2 JWT
    • 5.1.3 Controller
    • 5.1.4 Service
    • 5.1.5 登录参数,redis配置,统一错误码
    • 5.1.6 测试
  • 5.2. 获取用户信息
    • 5.2.1 接口说明
    • 5.2.2 Controller
    • 5.2.3 Service
    • 5.2.4 LoginUserVo
    • 5.2.5 测试
  • 5.3. 退出登录
    • 5.3.1 接口说明
    • 5.3.2 Controller
    • 5.3.3 Service
    • 5.3.4 测试
  • 6.1. 注册
    • 6.1.1 接口说明
    • 6.1.2 Controller
    • 6.1.3 Service
    • 6.1.4 加事务
    • 6.1.5 测试
  • 6.2. 登录拦截器
    • 6.2.1 拦截器实现
    • 6.2.2 使拦截器生效
    • 6.2.3 测试
  • 6.3. ThreadLocal保存用户信息
  • 7.1. ThreadLocal内存泄漏
  • 7.2. 文章详情
    • 7.2.1 接口说明
    • 7.2.2 涉及到的表
    • 7.2.3 Controller
    • 7.2.4 Service
    • 7.2.5 测试
  • 7.3. 使用线程池 更新阅读次数
    • 7.3.1 线程池配置
    • 7.3.1 使用
    • 7.3.3 测试
  • Bug修正
  • 8.1. 评论列表
    • 8.1.1 接口说明
    • 8.1.2 Controller
    • 8.1.3 Service
  • 8.2. 评论
    • 8.2.1 接口说明
    • 8.2.2 加入到登录拦截器中
    • 8.2.3 Controller
    • 8.2.4 Service
  • 写文章
  • 9.1. 所有文章分类
    • 9.1.1 接口说明
    • 9.1.2 Controller
    • 9.1.3 Service
  • 9.2. 所有文章标签
    • 9.2.1 接口说明
    • 9.2.2 Controller
    • 9.2.3 Service
  • 9.3. 发布文章
    • 9.3.1 接口说明
    • 9.3.2 Controller
    • 9.3.3 Service
    • 9.3.4 测试
  • 9.4. AOP日志
  • bug修正
  • 10.1. 文章图片上传
    • 10.1.1 接口说明
    • 10.1.2 Controller
    • 10.1.3 使用七牛云
    • 10.1.4 测试
  • 10.2. 导航-文章分类
    • 10.2.1 查询所有的文章分类
      • 10.2.1.1 接口说明
      • 10.2.1.2 Controller
      • 10.2.1.3 Service
    • 10.2.2 查询所有的标签
      • 10.2.2.1 接口说明
      • 10.2.2.3 Controller
      • 10.2.2.4 Service
  • 10.3. 分类文章列表
    • 10.3.1 接口说明
    • 10.3.2 Controller
    • 10.3.3 Service
  • 10.4. 标签文章列表
    • 10.4.1 接口说明
    • 10.4.2 Controller
    • 10.4.3 Service
    • 10.4.4 修改原有的查询文章接口
    • 10.4.5 测试
  • 11.1. 归档文章列表
    • 11.1.1 接口说明
    • 11.1.2 文章列表参数
    • 11.1.3 使用自定义sql 实现文章列表
    • 11.1.4 测试
  • 11.2. 统一缓存处理(优化)
  • 11.3. 思考别的优化
  • 管理后台
  • 12.1. 搭建项目
    • 12.1.1 新建maven工程 blog-admin
    • 12.1.2 配置
    • 12.1.3 启动类
    • 12.1.4 导入前端工程
    • 12.1.5 新建表
  • 12.2. 权限管理
    • 12.2.1 Controller
    • 12.2.2 Service
    • 12.2.3 测试
  • 12.3. Security集成
    • 12.3.1 添加依赖
    • 12.3.2 配置
    • 12.3.3 登录认证
    • 12.3.4 权限认证
  • 12.4. 作业
  • 13.总结技术亮点
  • 14.前端
  • 15、缓存一致性问题

spring boot 练手实战项目说明

后端视频链接

前端视频链接

码神之路网站所使用的博客,项目简单,需求明确,容易上手,非常适合做为练手级项目。

最终成品

blog.mszlu.com

项目讲解说明:

  1. 提供前端工程,只需要实现后端接口即可
  2. 项目以单体架构入手,先快速开发,不考虑项目优化,降低开发负担
  3. 开发完成后,开始优化项目,提升编程思维能力
  4. 比如页面静态化,缓存,云存储,日志等
  5. docker部署上线
  6. 云服务器购买,域名购买,域名备案等

项目使用技术 :

springboot + mybatisplus+redis+mysql

代码地址:
个人博客代码地址

基础知识

Spring常用注解,注解 IOC ,AOP,MVC 的理解
mybatisDao层 Mapper层 controller层 service层 model层 entity层 简介
mall商场学习文档
mybatisplus学习文档
mybatisplus配套代码
easycode搭配mybatisplus巨爽
@Autowired 的时候为什么注入接口不是实现类
@Service注解为什么是标注在实现类上的
mapper接口需要加注解吗?通过MapperScan减少注解
@Mapper与@MapperScan注解的作用是什么?

推荐安装插件
配好@Data使用
在这里插入图片描述

查看文章代码结构
在这里插入图片描述
自动提示编写的代码
在这里插入图片描述

快速生成xml文件
在这里插入图片描述

区分括号
在这里插入图片描述
vscode插件
在这里插入图片描述

面试准备

springboot个人博客项目面试准备

1. 工程搭建

前端的工程:

npm install
npm run build
npm run dev

1.1 新建maven工程


<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>
            
            <exclusions>
                <exclusion>
                    <groupId>org.springframework.boot</groupId>
                    <artifactId>spring-boot-starter-logging</artifactId>
                </exclusion>
            </exclusions>
        </dependency>

        
        <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>
        
        <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>

删除src文件

1.1.2遇到的bug

maven子工程如何引用父工程

1.2 配置

数据库配置

配置
mybatis-plus.configuration.log-impl=org.apache.ibatis.logging.stdout.StdOutImpl
使其打印到控制台
配置
mybatis-plus.global-config.db-config.table-prefix=ms_
代表标识下前缀是ms_,这样使其省略前缀,不用再定义前缀的表名

#server
server.port= 8888
spring.application.name=mszlu_blog
# datasource
spring.datasource.url=jdbc:mysql://localhost:3306/blog?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
mybatis-plus.global-config.db-config.table-prefix=ms_


package com.mszlu.blog.config;

import com.baomidou.mybatisplus.extension.plugins.MybatisPlusInterceptor;
import com.baomidou.mybatisplus.extension.plugins.inner.PaginationInnerInterceptor;
import org.mybatis.spring.annotation.MapperScan;
import org.springframework.context.annotation.Bean;
import org.springframework.context.annotation.Configuration;

/**
 * @Author ljm
 * @Date 2021/10/10 20:11
 * @Version 1.0
 */
//让spring可以扫描到它
@Configuration
//扫包,将此包下的接口生成代理实现类,并且注册到spring容器中
@MapperScan("com.mszlu.blog.dao.mapper")
public class MybatisPlusConfig {

    //分页插件
    //@Configuration可理解为用spring的时候xml里面的标签。
    // @Bean可理解为用spring的时候xml里面的标签。
    @Bean
    public MybatisPlusInterceptor mybatisPlusInterceptor(){
        MybatisPlusInterceptor interceptor = new MybatisPlusInterceptor();
        interceptor.addInnerInterceptor(new PaginationInnerInterceptor());
        return interceptor;
    }
}

package com.mszlu.blog.config;

import org.springframework.context.annotation.Configuration;
import org.springframework.web.servlet.config.annotation.CorsRegistry;
import org.springframework.web.servlet.config.annotation.WebMvcConfigurer;

@Configuration
public class WebConfig  implements WebMvcConfigurer {

    @Override
    public void addCorsMappings(CorsRegistry registry) {
        //跨域配置,不可设置为*,不安全, 前后端分离项目,可能域名不一致
        //本地测试 端口不一致 也算跨域
        registry.addMapping("/**").allowedOrigins("http://localhost:8080");
    }
}

1.3 启动类

package com.mszlu.blog;

import org.springframework.boot.SpringApplication;
import org.springframework.boot.autoconfigure.SpringBootApplication;

@SpringBootApplication
public class BlogApp {

    public static void main(String[] args) {
        SpringApplication.run(BlogApp.class,args);
    }
}

2. 首页-文章列表

2.1 接口说明

接口url:/articles

请求方式:POST

请求参数:

参数名称参数类型说明
pageint当前页数
pageSizeint每页显示的数量

返回数据:

{
    "success": true,
    "code": 200,
    "msg": "success",
    "data": [
        {
            "id": 1,
            "title": "springboot介绍以及入门案例",
            "summary": "通过Spring Boot实现的服务,只需要依靠一个Java类,把它打包成jar,并通过`java -jar`命令就可以运行起来。rnrn这一切相较于传统Spring应用来说,已经变得非常的轻便、简单。",
            "commentCounts": 2,
            "viewCounts": 54,
            "weight": 1,
            "createDate": "2609-06-26 15:58",
            "author": "12",
            "body": null,
            "tags": [
                {
                    "id": 5,
                    "avatar": null,
                    "tagName": "444"
                },
                {
                    "id": 7,
                    "avatar": null,
                    "tagName": "22"
                },
                {
                    "id": 8,
                    "avatar": null,
                    "tagName": "11"
                }
            ],
            "categorys": null
        },
        {
            "id": 9,
            "title": "Vue.js 是什么",
            "summary": "Vue (读音 /vjuː/,类似于 view) 是一套用于构建用户界面的渐进式框架。",
            "commentCounts": 0,
            "viewCounts": 3,
            "weight": 0,
            "createDate": "2609-06-27 11:25",
            "author": "12",
            "body": null,
            "tags": [
                {
                    "id": 7,
                    "avatar": null,
                    "tagName": "22"
                }
            ],
            "categorys": null
        },
        {
            "id": 10,
            "title": "Element相关",
            "summary": "本节将介绍如何在项目中使用 Element。",
            "commentCounts": 0,
            "viewCounts": 3,
            "weight": 0,
            "createDate": "2609-06-27 11:25",
            "author": "12",
            "body": null,
            "tags": [
                {
                    "id": 5,
                    "avatar": null,
                    "tagName": "444"
                },
                {
                    "id": 6,
                    "avatar": null,
                    "tagName": "33"
                },
                {
                    "id": 7,
                    "avatar": null,
                    "tagName": "22"
                },
                {
                    "id": 8,
                    "avatar": null,
                    "tagName": "11"
                }
            ],
            "categorys": null
        }
    ]
}

2.2 编码

2.2.0 Spring—基于注解开发

Spring基于注解的开发
每个注解的作用

2.2.1 表结构

文章表

CREATE TABLE `blog`.`ms_article`  (
  `id` bigint(0) NOT NULL AUTO_INCREMENT,
  `comment_counts` int(0) NULL DEFAULT NULL COMMENT '评论数量',
  `create_date` bigint(0) NULL DEFAULT NULL COMMENT '创建时间',
  `summary` varchar(255) CHARACTER SET utf8 COLLATE utf8_general_ci NULL DEFAULT NULL COMMENT '简介',
  `title` varchar(64) CHARACTER SET utf8 COLLATE utf8_general_ci NULL DEFAULT NULL COMMENT '标题',
  `view_counts` int(0) NULL DEFAULT NULL COMMENT '浏览数量',
  `weight` int(0) NOT NULL COMMENT '是否置顶',
  `author_id` bigint(0) NULL DEFAULT NULL COMMENT '作者id',
  `body_id` bigint(0) NULL DEFAULT NULL COMMENT '内容id',
  `category_id` int(0) NULL DEFAULT NULL COMMENT