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

深碍√TFBOYSˉ_ 2023-10-01 20:53 4阅读 0赞

### 文章目录 ###

*  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.前端

# spring boot 练手实战项目说明 #

[视频链接][Link 1]

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

最终成品

[blog.mszlu.com][]

项目讲解说明：

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

项目使用技术 ：

springboot + mybatisplus+redis+mysql

# 基础知识 #

[mybatisDao层 Mapper层 controller层 service层 model层 entity层 简介][mybatisDao_ Mapper_ controller_ service_ model_ entity_]  
[mall商场学习文档][mall]  
[mybatisplus学习文档][mybatisplus]  
[mybatisplus配套代码][mybatisplus 1]  
[easycode搭配mybatisplus巨爽][easycode_mybatisplus]

推荐安装插件  
配好@Data使用  
![在这里插入图片描述][e2f5c4eb9cf2423b842381af83257bf4.png]

查看文章代码结构  
![在这里插入图片描述][0f0504a431af4295b66f3052c7839feb.png]  
自动提示编写的代码  
![在这里插入图片描述][b2850ef527484df88701916ef89bd8a8.png]

快速生成xml文件  
![在这里插入图片描述][223ecf8d35ef49bf9d961dad5b3b1a86.png]

区分括号  
![在这里插入图片描述][d01a13fe992743b984e4d249593fc756.png]  
vscode插件  
![在这里插入图片描述][watermark_type_ZHJvaWRzYW5zZmFsbGJhY2s_shadow_50_text_Q1NETiBAbGptXzk5_size_12_color_FFFFFF_t_70_g_se_x_16]

# 面试准备 #

[springboot个人博客项目面试准备][springboot]

# 1. 工程搭建 #

前端的工程：

npm install
    npm run build
    npm run dev

## 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>
                
                <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子工程如何引用父工程][maven]

## 1.2 配置 ##

#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;
    
    @Configuration
    //扫包，将此包下的接口生成代理实现类，并且注册到spring容器中
    @MapperScan("com.mszlu.blog.dao")
    public class MybatisPlusConfig {
    	//分页插件
        @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

请求参数：

参数名称

参数类型

说明

page

int

当前页数

pageSize

int

每页显示的数量

返回数据：

{
        "success": true,
        "code": 200,
        "msg": "success",
        "data": [
            {
                "id": 1,
                "title": "springboot介绍以及入门案例",
                "summary": "通过Spring Boot实现的服务，只需要依靠一个Java类，把它打包成jar，并通过`java -jar`命令就可以运行起来。
    
    这一切相较于传统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基于注解的开发][Spring]  
[每个注解的作用][Link 2]

### 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 '类别id',
      PRIMARY KEY (`id`) USING BTREE
    ) ENGINE = InnoDB AUTO_INCREMENT = 25 CHARACTER SET = utf8 COLLATE = utf8_general_ci ROW_FORMAT = Dynamic;

标签表  
id，文章id，标签id，通过文章id可以间接查到标签id

CREATE TABLE `blog`.`ms_tag`  (
      `id` bigint(0) NOT NULL AUTO_INCREMENT,
      `article_id` bigint(0) NOT NULL,
      `tag_id` bigint(0) NOT NULL,
      PRIMARY KEY (`id`) USING BTREE,
      INDEX `article_id`(`article_id`) USING BTREE,
      INDEX `tag_id`(`tag_id`) USING BTREE
    ) ENGINE = InnoDB AUTO_INCREMENT = 1 CHARACTER SET = utf8 COLLATE = utf8_general_ci ROW_FORMAT = Dynamic;

用户表

CREATE TABLE `blog`.`ms_sys_user`  (
      `id` bigint(0) NOT NULL AUTO_INCREMENT,
      `account` varchar(64) CHARACTER SET utf8 COLLATE utf8_general_ci NULL DEFAULT NULL COMMENT '账号',
      `admin` bit(1) NULL DEFAULT NULL COMMENT '是否管理员',
      `avatar` varchar(255) CHARACTER SET utf8 COLLATE utf8_general_ci NULL DEFAULT NULL COMMENT '头像',
      `create_date` bigint(0) NULL DEFAULT NULL COMMENT '注册时间',
      `deleted` bit(1) NULL DEFAULT NULL COMMENT '是否删除',
      `email` varchar(128) CHARACTER SET utf8 COLLATE utf8_general_ci NULL DEFAULT NULL COMMENT '邮箱',
      `last_login` bigint(0) NULL DEFAULT NULL COMMENT '最后登录时间',
      `mobile_phone_number` varchar(20) CHARACTER SET utf8 COLLATE utf8_general_ci NULL DEFAULT NULL COMMENT '手机号',
      `nickname` varchar(255) CHARACTER SET utf8 COLLATE utf8_general_ci NULL DEFAULT NULL COMMENT '昵称',
      `password` varchar(64) CHARACTER SET utf8 COLLATE utf8_general_ci NULL DEFAULT NULL COMMENT '密码',
      `salt` varchar(255) CHARACTER SET utf8 COLLATE utf8_general_ci NULL DEFAULT NULL COMMENT '加密盐',
      `status` varchar(255) CHARACTER SET utf8 COLLATE utf8_general_ci NULL DEFAULT NULL COMMENT '状态',
      PRIMARY KEY (`id`) USING BTREE
    ) ENGINE = InnoDB AUTO_INCREMENT = 16 CHARACTER SET = utf8 COLLATE = utf8_general_ci ROW_FORMAT = Dynamic;

### entity层 ###

别名： model层 ，domain层  
用途： 实体层，用于存放我们的实体类，与数据库中的属性值基本保持一致，实现set和get的方法。  
例子：user表的实体User  
文章

package com.mszlu.blog.dao.pojo;
    
    import lombok.Data;
    
    @Data
    public class Article {
    
        public static final int Article_TOP = 1;
    
        public static final int Article_Common = 0;
    
        private Long id;
    
        private String title;
    
        private String summary;
    
        private int commentCounts;
    
        private int viewCounts;
    
        /**
         * 作者id
         */
        private Long authorId;
        /**
         * 内容id
         */
        private Long bodyId;
        /**
         *类别id
         */
        private Long categoryId;
    
        /**
         * 置顶
         */
        private int weight = Article_Common;
    
    
        /**
         * 创建时间
         */
        private Long createDate;
    }

用户

package com.mszlu.blog.dao.pojo;
    
    import lombok.Data;
    
    @Data
    public class SysUser {
    
        private Long id;
    
        private String account;
    
        private Integer admin;
    
        private String avatar;
    
        private Long createDate;
    
        private Integer deleted;
    
        private String email;
    
        private Long lastLogin;
    
        private String mobilePhoneNumber;
    
        private String nickname;
    
        private String password;
    
        private String salt;
    
        private String status;
    }

标签

package com.mszlu.blog.dao.pojo;
    
    import lombok.Data;
    
    @Data
    public class Tag {
    
        private Long id;
    
        private String avatar;
    
        private String tagName;
    
    }

### 2.2.2 Controller ###

controller层。控制器，导入service层，因为service中的方法是我们使用到的，controller通过接收前端传过来的参数进行业务操作，在返回一个指定的路径或者数据表

package com.mszlu.blog.api;
    
    import com.mszlu.blog.dao.pojo.Article;
    import com.mszlu.blog.service.ArticleService;
    import com.mszlu.blog.vo.Archive;
    import com.mszlu.blog.vo.ArticleVo;
    import com.mszlu.blog.vo.Result;
    import com.mszlu.blog.vo.params.PageParams;
    import org.springframework.beans.factory.annotation.Autowired;
    import org.springframework.web.bind.annotation.*;
    
    import java.util.List;
    
    @RestController
    @RequestMapping("articles")
    public class ArticleController {
    
        @Autowired
        private ArticleService articleService;
    	//Result是统一结果返回
        @PostMapping
        public Result articles(@RequestBody PageParams pageParams) {
            //ArticleVo 页面接收的数据
            List<ArticleVo> articles = articleService.listArticlesPage(pageParams);
    
            return Result.success(articles);
        }
    
    
    }

统一最后的结果

package com.mszlu.blog.vo;
    
    import com.mszlu.blog.dao.pojo.Article;
    import lombok.AllArgsConstructor;
    import lombok.Data;
    import lombok.NoArgsConstructor;
    
    import java.util.List;
    
    @Data
    @AllArgsConstructor
    @NoArgsConstructor
    public class Result {
    
        private boolean success;
    
        private Integer code;
    
        private String msg;
    
        private Object data;
    
    
        public static Result success(Object data) {
            return new Result(true,200,"success",data);
        }
        public static Result fail(Integer code, String msg) {
            return new Result(false,code,msg,null);
        }
    }

建立与前端交互的Vo文件

package com.mszlu.blog.vo;
    
    import com.mszlu.blog.dao.pojo.ArticleBody;
    import com.mszlu.blog.dao.pojo.Category;
    import com.mszlu.blog.dao.pojo.SysUser;
    import com.mszlu.blog.dao.pojo.Tag;
    import lombok.Data;
    
    import java.util.List;
    
    @Data
    public class ArticleVo {
    
        private Long id;
    
        private String title;
    
        private String summary;
    
        private int commentCounts;
    
        private int viewCounts;
    
        private int weight;
        /**
         * 创建时间
         */
        private String createDate;
    
        private String author;
    
        private ArticleBodyVo body;
    
        private List<TagVo> tags;
    
        private List<CategoryVo> categorys;
    
    }

### 2.2.3 Service ###

*service层主要是写业务逻辑方法，service层经常要调用dao层（也叫mapper层）的方法对数据进行增删改查的操作。*\*

## 2.2.3.0 解决mapper爆红 ##

[解决mapper爆红][mapper]

建立service接口

package com.mszlu.blog.service;
    
    import com.mszlu.blog.vo.Archive;
    import com.mszlu.blog.vo.ArticleVo;
    import com.mszlu.blog.vo.params.PageParams;
    
    import java.util.List;
    
    public interface ArticleService {
    
        /**
         * 分页查询文章列表
         * @param pageParams
         * @return
         */
    
        List<ArticleVo> listArticlesPage(PageParams pageParams);
    
    }

建立service接口的实现类

package com.mszlu.blog.service.impl;
    
    import com.baomidou.mybatisplus.core.conditions.query.LambdaQueryWrapper;
    import com.baomidou.mybatisplus.core.conditions.query.QueryWrapper;
    import com.baomidou.mybatisplus.extension.plugins.pagination.Page;
    import com.mszlu.blog.dao.ArticleMapper;
    import com.mszlu.blog.dao.SysUserMapper;
    import com.mszlu.blog.dao.pojo.Article;
    import com.mszlu.blog.dao.pojo.SysUser;
    import com.mszlu.blog.dao.pojo.Tag;
    import com.mszlu.blog.service.ArticleService;
    import com.mszlu.blog.service.SysUserService;
    import com.mszlu.blog.service.TagsService;
    import com.mszlu.blog.vo.ArticleBodyVo;
    import com.mszlu.blog.vo.ArticleVo;
    import com.mszlu.blog.vo.TagVo;
    import com.mszlu.blog.vo.params.PageParams;
    import org.joda.time.DateTime;
    import org.springframework.beans.BeanUtils;
    import org.springframework.beans.factory.annotation.Autowired;
    import org.springframework.stereotype.Service;
    
    import java.util.ArrayList;
    import java.util.List;
    
    
    @Service
    public class ArticleServiceImpl implements ArticleService {
    
        @Autowired
        private ArticleMapper articleMapper;
        @Autowired
        private TagService tagService;
    
        @Autowired
        private SysUserService sysUserService;
    
        @Override
        public Result listArticle(PageParams pageParams) {
            /**
             * 1、分页查询article数据库表
             */
            Page<Article> page = new Page<>(pageParams.getPage(), pageParams.getPageSize());
            LambdaQueryWrapper<Article> queryWrapper = new LambdaQueryWrapper<>();
            //是否置顶进行排序,        //时间倒序进行排列相当于order by create_data desc
            queryWrapper.orderByDesc(Article::getWeight,Article::getCreateDate);
            Page<Article> articlePage = articleMapper.selectPage(page, queryWrapper);
            //分页查询用法 https://blog.csdn.net/weixin_41010294/article/details/105726879
            List<Article> records = articlePage.getRecords();
            // 要返回我们定义的vo数据，就是对应的前端数据，不应该只返回现在的数据需要进一步进行处理
            List<ArticleVo> articleVoList =copyList(records,true,true);
            return Result.success(articleVoList);
        }
    
        private List<ArticleVo> copyList(List<Article> records,boolean isTag,boolean isAuthor) {
    
            List<ArticleVo> articleVoList = new ArrayList<>();
    
            for (Article record : records) {
                articleVoList.add(copy(record,isTag,isAuthor));
            }
            return articleVoList;
    
        }
    
        //"eop的作用是对应copyList，集合之间的copy分解成集合元素之间的copy
        private ArticleVo copy(Article article,boolean isTag,boolean isAuthor){
            ArticleVo articleVo = new ArticleVo();
            //BeanUtils.copyProperties用法   https://blog.csdn.net/Mr_linjw/article/details/50236279
            BeanUtils.copyProperties(article, articleVo);
            articleVo.setCreateDate(new DateTime(article.getCreateDate()).toString("yyyy-MM-dd HH:mm"));
            //并不是所有的接口都需要标签和作者信息
            if(isTag){
                Long articleId = article.getId();
                articleVo.setTags(tagService.findTagsByArticleId(articleId));
            }
            if (isAuthor) {
                //拿到作者id
                Long authorId = article.getAuthorId();
    
                articleVo.setAuthor(sysUserService.findUserById(authorId).getNickname());
            }
            return articleVo;
    
        }
    }

建立用户的service接口

package com.mszlu.blog.service;
    
    import com.mszlu.blog.dao.pojo.SysUser;
    
    public interface UserService {
    
        SysUser findUserById(Long userId);
    }

建立用户的service接口实现类

package com.mszlu.blog.service.impl;
    
    import com.mszlu.blog.dao.SysUserMapper;
    import com.mszlu.blog.dao.pojo.SysUser;
    import com.mszlu.blog.service.UserService;
    import org.springframework.beans.factory.annotation.Autowired;
    import org.springframework.stereotype.Service;
    
    @Service
    public class SysUserServiceImpl implements SysUserService {
    
        @Autowired
        private SysUserMapper sysUserMapper;
    
        @Override
        public SysUser findUserById(Long id) {
            //根据id查询
            //为防止sysUser为空增加一个判断
            SysUser sysUser = sysUserMapper.selectById(id);
            if (sysUser == null){
                sysUser = new SysUser();
                sysUser.setNickname("码神之路");
            }
            return sysUser;
        }
    }

## 2.2.3.1mybatisplus遇到多表查询怎么办 ##

TagMapper的建立中遇到这个问题了，办法是在建立到TagMapper后需要建立xml文件进行读写  
xml文件放到resource文件夹下  
文件夹名和xml文件名必须和TagMapper.java文件夹保持一致  
![在这里插入图片描述][af3eab062ffa4da3b9ed70c395286ad3.png]

![在这里插入图片描述][a9e8bd190451491fb200164568abfdd7.png]

## 2.2.3.2创建文件夹时遇到的坑 ##

使用IntelliJ IDEA创建多级文件夹时，文件夹名为com.immer.monitor.persistence 和 com/immer/monitor/persistence 均会显示为如下图所示

![在这里插入图片描述][012a9edbeba84c0e904e8af06de2ea53.png]

但实际结构确实截然不同 com.immer.monitor.persistence 是单个文件夹 而 com/immer/monitor/persistence 是一个文件夹嵌套

会导致资源文件not found 的问题，而且很难排查得到  
要不会显示找不到文件夹路径的问题，因为我们要保证mapper.xml要和mapper的文件夹和路径保持一致

[如何创建多级文件夹][Link 3]

建立标签的service接口

package com.mszlu.blog.service;
    
    import com.mszlu.blog.dao.pojo.Tag;
    import com.mszlu.blog.vo.TagVo;
    
    import java.util.List;
    
    public interface TagsService {
    
    
        List<TagVo> findTagsByArticleId(Long id);
    }

建立tag的service接口的实现类

package com.mszlu.blog.service.impl;
    
    import com.baomidou.mybatisplus.core.conditions.query.LambdaQueryWrapper;
    import com.mszlu.blog.dao.TagMapper;
    import com.mszlu.blog.dao.pojo.Tag;
    import com.mszlu.blog.service.TagsService;
    import com.mszlu.blog.vo.TagVo;
    import org.apache.commons.collections.CollectionUtils;
    import org.springframework.beans.BeanUtils;
    import org.springframework.beans.factory.annotation.Autowired;
    import org.springframework.stereotype.Service;
    
    import java.util.ArrayList;
    import java.util.Collection;
    import java.util.Collections;
    import java.util.List;
    
    @Service
    public class TagsServiceImpl implements TagsService {
        @Autowired
        private TagMapper tagMapper;
    
        /**
         * ms_article_tag是文章和标签的关联表
         * ms_tag为单纯的标签的表
         * @param articleId
         * @return
         */
    
        @Override
        public List<TagVo> findTagsByArticleId(Long articleId) {
            //mybatisplus无法进行多表查询
            List<Tag> tags = tagMapper.findTagsByArticleId(articleId);
            return copyList(tags);
        }
    
        private List<TagVo> copyList(List<Tag> tagList) {
            List<TagVo> tagVoList = new ArrayList<>();
            for (Tag tag : tagList) {
                tagVoList.add(copy(tag));
            }
            return tagVoList;
    
        }
    
        private TagVo copy(Tag tag) {
            TagVo tagVo = new TagVo();
            BeanUtils.copyProperties(tag, tagVo);
            return tagVo;
        }
    }

### 2.2.4 Dao层 ###

**mapper层=dao层**，现在用mybatis逆向工程生成的mapper层，其实就是dao层。  
dao层对数据库进行数据持久化操作，他的方法语句是直接针对数据库操作的，而service层是针对我们controller，也就是针对我们使用者。service的impl是把mapper和service进行整合的文件。

**dao层和service层关系**：service层经常要调用dao层的方法对数据进行增删改查的操作，现实开发中，对业务的操作会涉及到数据的操作，而对数据操作常常要用到数据库，所以service层会经常调用dao层的方法。

文章的dao层  
由于我们直接继承了mybatisplus的BaseMapper所以基本的增删改查都不用再写了。

package com.mszlu.blog.dao;
    
    import com.baomidou.mybatisplus.core.mapper.BaseMapper;
    import com.mszlu.blog.dao.pojo.Article;
    import com.mszlu.blog.vo.ArticleVo;
    
    import java.util.List;
    
    public interface ArticleMapper extends BaseMapper<Article> {
    	
    }

标签的dao层

package com.mszlu.blog.dao;
    
    import com.baomidou.mybatisplus.core.mapper.BaseMapper;
    import com.mszlu.blog.dao.pojo.Tag;
    
    import java.util.List;
    
    public interface TagMapper extends BaseMapper<Tag> {
    
        List<Tag> findTagsByArticleId(Long articleId);
    }

作者的dao层

package com.mszlu.blog.dao;
    
    import com.baomidou.mybatisplus.core.mapper.BaseMapper;
    import com.mszlu.blog.dao.pojo.SysUser;
    
    public interface SysUserMapper extends BaseMapper<SysUser> {
    }

这就是上文提到的mybatisplus遇到多表查询怎么办，我们需要建立自己的xml文件进行联合查询操作  
![在这里插入图片描述][746f8eb6eb7a41fe879444adbe05afea.png]

在mapper文件中  
利用mapperX插件我们可以创建  
方法名为select的命令

总的xml文件如下所示

<?xml version="1.0" encoding="UTF-8" ?>
    
    <!DOCTYPE mapper PUBLIC "-//mybatis.org//DTD Config 3.0//EN" "http://mybatis.org/dtd/mybatis-3-mapper.dtd">
    
    <mapper namespace="com.mszlu.blog.dao.mapper.TagMapper">
    
        <sql id="all">
            id,avatar,tag_name as tagName
        </sql>
    
    
    
        <select id="findTagsByArticleId" parameterType="long" resultType="com.mszlu.blog.dao.pojo.Tag">
            select  id,avatar,tag_name as tagName from ms_tag
            where id in (select tag_id from ms_article_tag where article_id=#{articleId})
        </select>
    </mapper>

### 2.2.5 测试 ###

![在这里插入图片描述][watermark_type_ZHJvaWRzYW5zZmFsbGJhY2s_shadow_50_text_Q1NETiBAbGptXzk5_size_20_color_FFFFFF_t_70_g_se_x_16]

# 3. 首页-最热标签 #

## 3.1 接口说明 ##

接口url：/tags/hot

请求方式：GET

请求参数：无

id  
标签名称  
我们期望点击标签关于文章的所有列表都显示出来

返回数据：

{
        "success": true,
        "code": 200,
        "msg": "success",
        "data": [
            {
                "id":1,
                "tagName":"4444"
            }
        ]
    }

## 3.2 编码 ##

### 3.2.1 Controller ###

package com.mszlu.blog.api;
    
    import com.mszlu.blog.service.ArticleService;
    import com.mszlu.blog.service.TagsService;
    import com.mszlu.blog.vo.Archive;
    import com.mszlu.blog.vo.ArticleVo;
    import com.mszlu.blog.vo.Result;
    impo

[Link 1]: https://www.bilibili.com/video/BV1Gb4y1d7zbp=16&spm_id_from=pageDriver
[blog.mszlu.com]: https://blog.mszlu.com//#/
[mybatisDao_ Mapper_ controller_ service_ model_ entity_]: https://blog.csdn.net/lijiaming_99/article/details/120584796spm=1001.2014.3001.5501
[mall]: https://gitee.com/iszoutao/java-construct/blob/master/%E6%90%9E%E4%B8%83%E6%90%9E%E5%85%AB/mall-tiny%E9%A1%B9%E7%9B%AE%E5%AD%A6%E4%B9%A0.md
[mybatisplus]: https://www.kuangstudy.com/bbs/1366329082232467457
[mybatisplus 1]: https://gitee.com/kuangstudy/kuang_livenote/blob/master/%E3%80%90%E9%81%87%E8%A7%81%E7%8B%82%E7%A5%9E%E8%AF%B4%E3%80%91MyBatisPlus%E8%A7%86%E9%A2%91%E7%AC%94%E8%AE%B0/%E4%BB%A3%E7%A0%81.rar
[easycode_mybatisplus]: https://www.jianshu.com/p/e4192d7c6844
[e2f5c4eb9cf2423b842381af83257bf4.png]: https://img-blog.csdnimg.cn/e2f5c4eb9cf2423b842381af83257bf4.png
[0f0504a431af4295b66f3052c7839feb.png]: https://img-blog.csdnimg.cn/0f0504a431af4295b66f3052c7839feb.png
[b2850ef527484df88701916ef89bd8a8.png]: https://img-blog.csdnimg.cn/b2850ef527484df88701916ef89bd8a8.png
[223ecf8d35ef49bf9d961dad5b3b1a86.png]: https://img-blog.csdnimg.cn/223ecf8d35ef49bf9d961dad5b3b1a86.png
[d01a13fe992743b984e4d249593fc756.png]: https://img-blog.csdnimg.cn/d01a13fe992743b984e4d249593fc756.png
[watermark_type_ZHJvaWRzYW5zZmFsbGJhY2s_shadow_50_text_Q1NETiBAbGptXzk5_size_12_color_FFFFFF_t_70_g_se_x_16]: https://img-blog.csdnimg.cn/8085dedbac7b4db6aba46639ea34e9d7.png?x-oss-process=image/watermark,type_ZHJvaWRzYW5zZmFsbGJhY2s,shadow_50,text_Q1NETiBAbGptXzk5,size_12,color_FFFFFF,t_70,g_se,x_16
[springboot]: https://blog.csdn.net/lijiaming_99/article/details/120922916
[maven]: https://www.cnblogs.com/javasl/p/12391732.html
[Spring]: https://segmentfault.com/a/1190000025187511
[Link 2]: https://www.cnblogs.com/xrq730/p/5313412.html
[mapper]: https://blog.csdn.net/hanqing456/article/details/111878930utm_medium=distribute.pc_relevant.none-task-blog-2~default~CTRLIST~default-1.no_search_link&depth_1-utm_source=distribute.pc_relevant.none-task-blog-2~default~CTRLIST~default-1.no_search_link
[af3eab062ffa4da3b9ed70c395286ad3.png]: https://img-blog.csdnimg.cn/af3eab062ffa4da3b9ed70c395286ad3.png
[a9e8bd190451491fb200164568abfdd7.png]: https://img-blog.csdnimg.cn/a9e8bd190451491fb200164568abfdd7.png
[012a9edbeba84c0e904e8af06de2ea53.png]: https://img-blog.csdnimg.cn/012a9edbeba84c0e904e8af06de2ea53.png
[Link 3]: https://blog.csdn.net/weixin_39875832/article/details/114721716
[746f8eb6eb7a41fe879444adbe05afea.png]: https://img-blog.csdnimg.cn/746f8eb6eb7a41fe879444adbe05afea.png
[watermark_type_ZHJvaWRzYW5zZmFsbGJhY2s_shadow_50_text_Q1NETiBAbGptXzk5_size_20_color_FFFFFF_t_70_g_se_x_16]: https://img-blog.csdnimg.cn/937739ee77074de7ab0ee5f8fedeffdb.png?x-oss-process=image/watermark,type_ZHJvaWRzYW5zZmFsbGJhY2s,shadow_50,text_Q1NETiBAbGptXzk5,size_20,color_FFFFFF,t_70,g_se,x_16