人手必备的一款博客系统

2021138

于 2024-07-25 16:13:09 发布

阅读量1.3k

点赞数 40

文章标签： java javascript android

本文链接：https://blog.csdn.net/weixin_63318285/article/details/140692841

版权

先展示一下最终效果

登录页面
![外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传] 请添加图片描述

注册页面
在这里插入图片描述

主页面（默认显示所有博客页面，我的博客、回收站、我点赞的、我收藏的页面类似，只是查询条件不同而已）

在这里插入图片描述

详细博客页面

在这里插入图片描述

关联评论示例

在这里插入图片描述

我的评论页面（回复我的页面类似，只是查询条件不同）

在这里插入图片描述

数据库表的设计

一共七张表，分为数据表和关系表

数据表
- account：用户表，存储用户基本信息，用户名、密码。自增ID用于记录关系
- brief_article：简略信息表，加载多数页面时查询的表，标题不能超过255个字。点赞、收藏和评论数量在这里展示。字段deleted用于隐藏博客，便于后续恢复
- detail_article：主要内容表，只存储所属用户ID和博客的具体内容，别的信息如标题、更新时间由简略信息表查出，评论使用连表查询查出。文章内容使用MEDIUMTEXT类型，能存储16MB（16,777,215个字符）。有一个自增主键ID
- comment：评论表，每篇博客后面的评论，只能输入文字且不超过255个字符。like_num表示该评论的点赞数，parent表示该评论是针对哪一条评论的，比如对已发表的评论进行评论。默认-1，没有父评论。
关系表
- article_liked：博客点赞关系表，记录用户与文章之间的点赞关系，便于前端展示是否点赞以及查看自己点赞的文章
- article_collect：收藏关系表，记录用户与文章之间的收藏关系，便于前端展示是否收藏以及查看自己收藏的文章。
- comment_liked：评论点赞关系表，与上面类似

代码及说明

文件目录如下所示
在这里插入图片描述

config包

config：配置包，CORSConfig用于解决前后端分离时的跨域问题

@Configuration
public class CorsConfig implements WebMvcConfigurer {

    @Override
    public void addCorsMappings(CorsRegistry registry) {
        registry.addMapping("/**")
                //是否发送Cookie
                .allowCredentials(true)
                //放行哪些原始域
                .allowedOriginPatterns("*")
                .allowedMethods(new String[]{"GET", "POST", "PUT", "DELETE"})
                .allowedHeaders("*")
                .exposedHeaders("*");
    }
}

constant包

constant：常量包，定义了前后端的数据交互格式，记录了用到的一些常量，比如尚未注册、用户名密码不匹配的int值及提示信息。

Result类用于前后端交互，封装了状态码、提示信息和对应数据

success()方法表示成功处理，重载两个方法，一个有返回值，另一个没有返回值
fail()方法表示出现异常，返回状态码和提示信息

@Data
@AllArgsConstructor
public class Result<T> implements Serializable {

    private int code;
    private String message;
    private Object data;

    public Result(int code, String message) {
        this.code = code;
        this.message = message;
    }

    public static Result success() {
        return new Result(Status.SUCCESS, Message.SUCCESS);
    }

    public static Result success(Object data) {
        return new Result(Status.SUCCESS, Message.SUCCESS, data);
    }

    public static Result fail(int code, String message) {
        return new Result(code, message);
    }
}

Message类封装了提示信息

public class Message {

    public static final String SUCCESS = "一帆风顺";
    public static final String NOT_SIGN_UP = "该用户名尚未注册";
    public static final String WRONG_PASSWORD = "用户名密码不匹配";
    public static final String EXIST_NAME = "用户名已存在";
    public static final String WRONG_PWD = "原始密码不正确";
    public static final String FAIL = "出现问题，请稍后再试";
}

Status类封装了状态码以及一些状态，如博客的点赞收藏标记、评论的点赞

public class Status {

    public static final int SUCCESS = 200;
    public static final int NOT_SIGN_UP = 301;
    public static final int WRONG_PASSWORD = 302;
    public static final int EXIST_NAME = 303;
    public static final int WRONG_PWD = 304;

    public static final int ARTICLE_LIKE = 0;
    public static final int ARTICLE_COLLECT = 1;
    public static final int COMMENT_LIKE = 2;

    public static final int FAIL = 600;
}

domain包

domain：程序中用到的类，又分为三个子包

结构如下所示
在这里插入图片描述

dto：不同层之间，比如前端向后端传输，服务层与控制层之间数据传输使用到的类
- 对于添加博客、查询博客、更新博客时数据分别由ArticleInsertDTO、ArticleSelectDTO、ArticleUpdateDTO实例承载，UserChangeDTO用于修改用户信息时的数据传输
- CommentDTO和UserDTO用于前端向后端传输评论和用户信息
- ChangeNumDTO用于修改博客点赞和收藏、评论的点赞数量，提取出一个公共的类，id记录博客或评论id，newNum记录了新的数量，使用type标记是哪种类型
- DetailArticleDTO用于承载博客的具体内容以及评论，与简要博客信息拼接后组成博客页面
- DetailInfoDTO有两个作用
  - 修改评论或简要博客信息时传递数据
  - 根据标题模糊查询时传递参数，如模糊查询用户收藏或点赞的博客
entity：数据库表对应的类。一个字段对应一个属性。account表对应User类、brief_article表对应BriefArticle类、detail_article表对应DetailArticle类、comment对应Comment类、article_liked、article_collect、comment_liked表共用Relation类表示，使用type标识不同表，0表示博客点赞，1表示博客收藏，2表示评论点赞，与Status类中常量定义一致
vo：前后端交互时用到的类。
- ArticleChangeDTO用于修改博客时的前端页面展示
- BriefCommentVO、BriefArticleVO分别用于展示简要评论（我评论的选项页面展示）和简要博客
- CommentVO、DetailArticleVO用于展示具体的评论以及博客信息
- UserVO用于登录成功后返回给前端用户数据，略去了密码等重要信息

dao包

dao：与数据库进行交互，封装了增删改查等基本数据库操作，实现了数据访问的功能。

SQL语句声明在resources/mapper文件夹下，命名规则一致，这里略

service包

service：业务逻辑的核心，封装了处理业务的具体逻辑。协调多个dao层之间的数据访问并处理事务

具体见代码，功能都写在代码里了，这里就不一一概述了~~

controller包

controller：控制层，用户请求的入口点，接收来自前端的HTTP请求，处理一些简单的业务逻辑

程序主要分为三个部分

用户的相关处理，功能有登录、注册、修改用户名或密码、注销用户等。方法声明在UserController中
博客的处理，如发表博客、编辑博客、删除博客（隐藏博客，可以在回收站删除）、删除博客（彻底从数据库删除）、查询博客详细信息、查询博客全部信息、点赞、收藏等，方法声明在ArticleController中
评论的处理，如发表评论、编辑评论、删除评论、查询博客对应的评论、查询用户发表的评论、点赞、查询对于用户评论的评论，方法声明在CommentController中

UserController类、ArticleController类、CommentController类大多数都是直接调用service层方法并返回，只有登录会有特殊的判断，流程图如下所示
在这里插入图片描述