项目5-博客系统1（准备工作+博客列表+博客详情页）

2024-04-13 07:28
文章标签 系统 工作 项目 博客 列表 准备 详情页

本文主要是介绍项目5-博客系统1（准备工作+博客列表+博客详情页），希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

1.创建项目

导入以下依赖

2.项目介绍

使⽤SSM框架实现⼀个简单的博客系统
共5个页面

2.1 前端页面展示

2.1.1 用户登录


2.1.2 博客发表页


2.1.3 博客编辑页


2.1.4 博客列表页


2.1.5博客详情页

2.2 功能描述:

⽤⼾登录成功后, 可以查看所有⼈的博客.

点击 <<查看全⽂>> 可以查看该博客的正⽂内容.

如果该博客作者为当前登录⽤⼾, 可以完成博客的修改和删除操作, 以及发表新博客

3.准备工作

3.1 数据准备

3.1.1 建立SQL

-- 建表SQL
create database if not exists java_blog_spring charset utf8mb4;
USE java_blog_spring;
-- 用户表
DROP TABLE IF EXISTS java_blog_spring.user;
CREATE TABLE java_blog_spring.user(`id` INT NOT NULL AUTO_INCREMENT,`user_name` VARCHAR ( 128 ) NOT NULL,`password` VARCHAR ( 128 ) NOT NULL,`github_url` VARCHAR ( 128 ) NULL,`delete_flag` TINYINT ( 4 ) NULL DEFAULT 0,`create_time` DATETIME DEFAULT now(),`update_time` DATETIME DEFAULT now(),PRIMARY KEY ( id ),
UNIQUE INDEX user_name_UNIQUE ( user_name ASC )) ENGINE = INNODB DEFAULT
CHARACTER
SET = utf8mb4 COMMENT = '用户表';
-- 博客表
drop table if exists java_blog_spring.blog;
CREATE TABLE java_blog_spring.blog (`id` INT NOT NULL AUTO_INCREMENT,`title` VARCHAR(200) NULL,`content` TEXT NULL,`user_id` INT(11) NULL,`delete_flag` TINYINT(4) NULL DEFAULT 0,`create_time` DATETIME DEFAULT now(),`update_time` DATETIME DEFAULT now(),PRIMARY KEY (id))
ENGINE = InnoDB DEFAULT CHARSET = utf8mb4 COMMENT = '博客表';
-- 新增用户信息
insert into java_blog_spring.user (user_name, password,github_url)values
("lay","107","https://www.weibo.com/u/2706896955?c=spr_qdhz_bd_360ss_weibo_mr");
insert into java_blog_spring.user (user_name, password,github_url)
values("muyierf","123456","https://gitee.com/muyierf");
insert into java_blog_spring.blog (title,content,user_id) values("第1篇博
客","lay的筑梦之旅",1);
insert into java_blog_spring.blog (title,content,user_id) values("第1篇博
客","muyierf的第一篇博客",2);

 创建成功！！！

3.2 前端代码引入项目中

3.3 配置配置文件

spring:datasource:url: jdbc:mysql://127.0.0.1:3306/java_blog_spring?characterEncoding=utf8&useSSL=falseusername: rootpassword: 123456driver-class-name: com.mysql.cj.jdbc.Driver
mybatis:configuration:map-underscore-to-camel-case: true #配置驼峰⾃动转换log-impl: org.apache.ibatis.logging.stdout.StdOutImpl #打印sql语句mapper-locations: classpath:mapper/**Mapper.xml
# 设置⽇志⽂件的⽂件名
logging:file:name: spring-book.log

3.4 测试项目能否启动成功

成功！！！

3.5 开发前的准备

3.5.1 项目流程

1.需求分析

2.技术方案设计
1)UML图,流程图,ER图

2)数据库设计

3)接口设计（我们需要完成的工作）

3.开发（我们需要完成的工作）

4.自测（我们需要完成的工作）

5.测试(QA)

6.联调

7. 验收

8.上线

3.5.2 数据库表的创建 

数据库表通常分两类:
1.实体表->对象 (员工表,部门表,图书表,博客表..)

2.关系表->实体之间的关系

我们的项目较为简单，所以我们只需要两个实体表即可。

用户表:用户名,密码,照片,昵称,github地址

1.根据用户名,查询用户信息
2.根据用户ID,查询用户信息

博客表: 标题,日期,内容,作者, 分类.. 

1.查询博客列表
2.根据博客ID, 查询博客信息
3.根据博客ID, 修改博客信息

4.插入博客

3.5.3 接口设计

1.用户登录
根据用户名和密码, 判断是否正确->根据用户名,查询用户信息,对比密码是否正确

2.查询用户信息
根据用户ID,查询用户信息->根据用户ID,去查询用户信息

3.博客列表

查询所有博客->查询所有博客

4.查询作者信息

1)根据博客, 拿到作者ID
2)根据作者ID,获取作者信息

->根据用户ID,去查询用户信息

5.查询博客详情

->根据博客ID, 查询博客信息

6.修改博客->根据博客ID, 修改博客信息

7.添加博客->插入博客信息

8.删除博客
1)物理删除
2)逻辑删除->根据博客ID,修改博客信息

3.5.4 建包 

  • controller
  • service
  • mapper
  • model
  • config
  • constants（里面写枚举类和常量类都可以）

4.代码部分 

4.1. 实体类（model包）

//要与数据库一致

package com.example.demo.model;import lombok.Data;import java.util.Date;@Data
public class BlogInfo {private Integer id;private String title;private String content;private Integer userId;private Integer deleteFlag;private Date createTime;private Date updateTime;
}
package com.example.demo.model;import lombok.Data;import java.util.Date;@Data
public class UserInfo {private Integer id;private String userName;private String password;private String githubUrl;private Byte deleteFlag;private Date createTime;private Date updateTime;
}

4.2 公共模块

包括实体类和同一功能处理<1.拦截器2.统一功能处理3.统一结果返回>

4.2.1. 统一返回结果实体类

a. code: 业务状态码
▪ 200: 业务处理成功
▪ -1 : 业务处理失败
▪ -2 : ⽤⼾未登录
▪ 后续有其他异常信息, 可以再补充.
b. msg: 业务处理失败时, 返回的错误信息
c. data: 业务返回数据

定义业务状态码//我们将这些确定的状态码存入Constants包中，防止修改 

package com.example.demo.model;import com.example.demo.constants.Constant;
import lombok.Data;@Data
public class Result {private int code;private String msg;private Object data;//业务执行时返回的方法public static Result success(Object data){Result result=new Result();result.setData(Constant.RESULT_CODE_SUCCESS);result.setMsg("");result.setData(data);return result;}public static Result fail(int code,String msg){Result result=new Result();result.setData(Constant.RESULT_CODE_FAIL);result.setMsg(msg);result.setData("");return result;}public static Result unlogin(int code,String msg,Object data){Result result=new Result();result.setData(Constant.RESULT_CODE_UNLOGIN);result.setMsg("用户未登录");result.setData(data);return result;}
}

4.2.2 统一返回结果

4.2.2.1 统一功能处理
package com.example.demo.model.result;import com.fasterxml.jackson.core.JsonProcessingException;
import com.fasterxml.jackson.databind.ObjectMapper;
import org.springframework.core.MethodParameter;
import org.springframework.http.MediaType;
import org.springframework.http.server.ServerHttpRequest;
import org.springframework.http.server.ServerHttpResponse;
import org.springframework.web.servlet.mvc.method.annotation.ResponseBodyAdvice;public class ResponseAdvice implements ResponseBodyAdvice {@Overridepublic boolean supports(MethodParameter returnType, Class converterType) {return true;}@Overridepublic Object beforeBodyWrite(Object body, MethodParameter returnType, MediaType selectedContentType,Class selectedConverterType, ServerHttpRequest request,ServerHttpResponse response) {if(body instanceof Result){return body;}if(body instanceof String){ObjectMapper objectMapper=new ObjectMapper();try {return objectMapper.writeValueAsString(Result.success(body));} catch (JsonProcessingException e) {e.printStackTrace();}}return Result.success(body);}
}

 记得加此注解！！！

统⼀的数据返回格式使⽤ @ControllerAdvice 和 ResponseBodyAdvice 的⽅式实现
@ControllerAdvice 表⽰控制器通知类
添加类 ResponseAdvice , 实现 ResponseBodyAdvice 接⼝, 并在类上添加@ControllerAdvice 注解

4.2.2.2 统一异常处理

@ExceptionHandler 是异常处理器，两个结合表⽰当出现异常的时候执⾏某个通知，也就是执⾏某个⽅法事件

package com.example.demo.model.result;import com.example.demo.constants.Constant;
import org.springframework.web.bind.annotation.ControllerAdvice;
import org.springframework.web.bind.annotation.ExceptionHandler;
import org.springframework.web.bind.annotation.ResponseBody;@ControllerAdvice
@ResponseBody
public class ExceptionAdvice {@ExceptionHandlerpublic Result exceptionAdvice(Exception e){return Result.fail(Constant.RESULT_CODE_FAIL,e.getMessage());}
}

4.2.2.3 拦截器 

4.3 业务代码

4.3.1 持久层（mapper）

根据需求, 先⼤致计算有哪些DB相关操作, 完成持久层初步代码, 后续再根据业务需求进⾏完善

1. 用户登录页

  • 根据用户名查询用户信息（select语句）

2. 博客列表⻚

  • 根据id查询user信息（select语句->通过id查询用户表）
  • 获取所有博客列表（select语句->通过id查询博客表）

3. 博客详情⻚

  • 根据博客ID查询博客信息
  • 根据博客ID删除博客(修改delete_flag=1,update)

4. 博客修改⻚

  • 根据博客ID修改博客信息(update)

5. 发表博客

  • 插⼊新的博客数据(insert)

1.BlogInfoMapper 

package com.example.demo.mapper;import com.example.demo.model.BlogInfo;
import org.apache.ibatis.annotations.Insert;
import org.apache.ibatis.annotations.Mapper;
import org.apache.ibatis.annotations.Select;import java.util.List;@Mapper
public interface BlogMapper {//a.获取所有博客列表@Select("select * from blog where delete_flag=0 order by create_time desc")List<BlogInfo> selectAllBlog();//b.根据博客id查询它的博客@Select("select * from blog where delete_flag=0 and id=#{id}")BlogInfo selectByIdBlog();//c.插⼊新的博客数据(insert)@Insert("insert into blog (title,content,user_id) values (#{title},#{content},#{userId})")Integer insertNewBlog(BlogInfo blogInfo);//d.博客修改页和博客删除页（update）-动态mybatis->xmlInteger updateBlog(BlogInfo blogInfo);}
<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE mapper PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN" "http://mybatis.org/dtd/mybatis-3-mapper.dtd" >
<mapper namespace="com.example.demo.mapper.BlogInfoMapper"><update id="updateBlog">update blog<set><if test="title!=null">title=#{title},</if><if test="content!=null">content=#{content},</if><if test="deleteFlag !=null">delete_flag = #{deleteFlag}</if></set>where id=#{id}</update>
</mapper>

2.UserInfoMapper

package com.example.demo.mapper;import com.example.demo.model.UserInfo;
import org.apache.ibatis.annotations.Mapper;
import org.apache.ibatis.annotations.Select;@Mapper
public interface UserInfoMapper {//1.根据id查询用户的信息@Select("select * from user where id = #{id}")UserInfo selectById(Integer id);//2.根据用户名查询用户的信息，登陆操作时用@Select("select * from user where user_name = #{userName}")UserInfo selectByName(String name);
}
4.3.1.1 测试持久层
package com.example.demo.mapper;import com.example.demo.model.BlogInfo;
import org.junit.jupiter.api.Test;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.boot.test.context.SpringBootTest;import static org.junit.jupiter.api.Assertions.*;@SpringBootTest
class BlogInfoMapperTest {@Autowiredprivate BlogInfoMapper blogInfoMapper;@Testvoid selectAllBlog() {System.out.println(blogInfoMapper.selectAllBlog());}@Testvoid selectByIdBlog() {System.out.println( blogInfoMapper.selectByIdBlog(1));}@Testvoid insertNewBlog() {BlogInfo blogInfo=new BlogInfo();blogInfo.setTitle("测试接口");blogInfo.setContent("单元测试测试接⼝测试接⼝");blogInfo.setUserId(5);blogInfoMapper.insertNewBlog(blogInfo);}@Testvoid updateBlog() {BlogInfo blogInfo=new BlogInfo();blogInfo.setId(3);blogInfo.setTitle("测试接口ing");blogInfo.setDeleteFlag(1);blogInfoMapper.updateBlog(blogInfo);}
}

测试成功！！！

测试结果

 数据库也成功录入信息！！！

4.3.2 实现博客列表

4.3.2.1 约定前后端交互接口
[请求]
/blog/getlist
[响应]
{"code": 200,"msg": "","data": [{"id": 1,"title": "第⼀篇博客","content": "111我是博客正⽂我是博客正⽂我是博客正⽂","userId": 1,"deleteFlag": 0,"createTime": "2023-10-21 16:56:57","updateTime": "2023-10-21T08:56:57.000+00:00"},.....]
}

客户端给服务器发送⼀个 /blog/getlist 这样的 HTTP 请求, 服务器给客⼾端返回了⼀个 JSON 格
式的数据.

4.3.2.2 实现服务器代码
1.service包

2.controller包

3.后端测试

失败！！！

与预想结果不符，我想要的code为200.经过检查,set错误，导致其为默认值。

修改之后重新测试

成功！！！ 

4.3.2.3 前后端交互->实现客户端代码

4.3.2.3.1 前端测试

成功！！！

4.3.2.3.2 相关部署（时间的返回格式确定）

此时⻚⾯的⽇期显⽰为时间戳, 我们从后端也⽇期进⾏处理
SimpleDateFormat 格式参考官⽅⽂档

我们建立一个utils包，进行相关的部署

重写获取博客创建时间

 重新测试

成功！！！

4.3.3 实现博客详情

⽬前点击博客列表⻚的 "查看全⽂" , 能进⼊博客详情⻚, 但是这个博客详情⻚是写死的内容. 我们期望能够根据当前的 博客 id 从服务器动态获取博客内容.
4.3.3.1 约定前后端交互接⼝

[请求]

/blog/getBlogDetail?blogId=1
[ 响应 ]
{
        "code" : 200,
        "msg" : "" ,
        "data" : {
        "id" : 1,
        "title" : " 第⼀篇博客 " ,
        "content" : "111 我是博客正⽂我是博客正⽂我是博客正⽂ " ,
        "userId" : 1,
        "deleteFlag" : 0,
        "createTime" : "2023-10-21 16:56:57" ,
        "updateTime" : "2023-10-21T08:56:57.000+00:00"
}
}
4.3.3.2 实现服务器代码
1.service包

2.controller包

3.后端测试

成功！！！

 4.3.3.3 前后端交互

首先清除写死的代码

后续将获得的内容赋值到上面

 4.3.3.3.1 前后测试成功！！！ 

这篇关于项目5-博客系统1（准备工作+博客列表+博客详情页）的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！


http://www.chinasem.cn/article/899497。

相关文章

不懂推荐算法也能设计推荐系统

不懂推荐算法也能设计推荐系统

本文以商业化应用推荐为例，告诉我们不懂推荐算法的产品，也能从产品侧出发， 设计出一款不错的推荐系统。 相信很多新手产品，看到算法二字，多是懵圈的。 什么排序算法、最短路径等都是相对传统的算法（注：传统是指科班出身的产品都会接触过）。但对于推荐算法，多数产品对着网上搜到的资源，都会无从下手。特别当某些推荐算法 和 “AI”扯上关系后，更是加大了理解的难度。 但，不了解推荐算法，就无法做推荐系
阅读更多...
这15个Vue指令，让你的项目开发爽到爆

这15个Vue指令，让你的项目开发爽到爆

1. V-Hotkey 仓库地址: github.com/Dafrok/v-ho… Demo: 戳这里 https://dafrok.github.io/v-hotkey 安装: npm install --save v-hotkey 这个指令可以给组件绑定一个或多个快捷键。你想要通过按下 Escape 键后隐藏某个组件，按住 Control 和回车键再显示它吗？小菜一碟： <template
阅读更多...
基于人工智能的图像分类系统

基于人工智能的图像分类系统

目录 引言项目背景环境准备 硬件要求软件安装与配置系统设计 系统架构关键技术代码示例 数据预处理模型训练模型预测应用场景结论 1. 引言 图像分类是计算机视觉中的一个重要任务，目标是自动识别图像中的对象类别。通过卷积神经网络（CNN）等深度学习技术，我们可以构建高效的图像分类系统，广泛应用于自动驾驶、医疗影像诊断、监控分析等领域。本文将介绍如何构建一个基于人工智能的图像分类系统，包括环境
阅读更多...
水位雨量在线监测系统概述及应用介绍

水位雨量在线监测系统概述及应用介绍

在当今社会，随着科技的飞速发展，各种智能监测系统已成为保障公共安全、促进资源管理和环境保护的重要工具。其中，水位雨量在线监测系统作为自然灾害预警、水资源管理及水利工程运行的关键技术，其重要性不言而喻。 一、水位雨量在线监测系统的基本原理 水位雨量在线监测系统主要由数据采集单元、数据传输网络、数据处理中心及用户终端四大部分构成，形成了一个完整的闭环系统。 数据采集单元：这是系统的“眼睛”，
阅读更多...
如何用Docker运行Django项目

如何用Docker运行Django项目

本章教程，介绍如何用Docker创建一个Django，并运行能够访问。 一、拉取镜像 这里我们使用python3.11版本的docker镜像 docker pull python:3.11 二、运行容器 这里我们将容器内部的8080端口，映射到宿主机的80端口上。 docker run -itd --name python311 -p
阅读更多...
嵌入式QT开发：构建高效智能的嵌入式系统

嵌入式QT开发：构建高效智能的嵌入式系统

摘要： 本文深入探讨了嵌入式 QT 相关的各个方面。从 QT 框架的基础架构和核心概念出发，详细阐述了其在嵌入式环境中的优势与特点。文中分析了嵌入式 QT 的开发环境搭建过程，包括交叉编译工具链的配置等关键步骤。进一步探讨了嵌入式 QT 的界面设计与开发，涵盖了从基本控件的使用到复杂界面布局的构建。同时也深入研究了信号与槽机制在嵌入式系统中的应用，以及嵌入式 QT 与硬件设备的交互，包括输入输出设
阅读更多...
JAVA智听未来一站式有声阅读平台听书系统小程序源码

JAVA智听未来一站式有声阅读平台听书系统小程序源码

智听未来，一站式有声阅读平台听书系统 🌟&nbsp;开篇：遇见未来，从“智听”开始 在这个快节奏的时代，你是否渴望在忙碌的间隙，找到一片属于自己的宁静角落？是否梦想着能随时随地，沉浸在知识的海洋，或是故事的奇幻世界里？今天，就让我带你一起探索“智听未来”——这一站式有声阅读平台听书系统，它正悄悄改变着我们的阅读方式，让未来触手可及！ 📚&nbsp;第一站：海量资源，应有尽有 走进“智听
阅读更多...
【区块链 + 人才服务】可信教育区块链治理系统 | FISCO BCOS应用案例

【区块链 + 人才服务】可信教育区块链治理系统 | FISCO BCOS应用案例

伴随着区块链技术的不断完善，其在教育信息化中的应用也在持续发展。利用区块链数据共识、不可篡改的特性， 将与教育相关的数据要素在区块链上进行存证确权，在确保数据可信的前提下，促进教育的公平、透明、开放，为教育教学质量提升赋能，实现教育数据的安全共享、高等教育体系的智慧治理。 可信教育区块链治理系统的顶层治理架构由教育部、高校、企业、学生等多方角色共同参与建设、维护，支撑教育资源共享、教学质量评估、
阅读更多...
在cscode中通过maven创建java项目

在cscode中通过maven创建java项目

在cscode中创建java项目 可以通过博客完成maven的导入 建立maven项目 使用快捷键 Ctrl + Shift + P 建立一个 Maven 项目 1 Ctrl + Shift + P 打开输入框2 输入 "> java create"3 选择 maven4 选择 No Archetype5 输入 域名6 输入项目名称7 建立一个文件目录存放项目，文件名一般为项目名8 确定
阅读更多...
软考系统规划与管理师考试证书含金量高吗？

软考系统规划与管理师考试证书含金量高吗？

2024年软考系统规划与管理师考试报名时间节点： 报名时间：2024年上半年软考将于3月中旬陆续开始报名 考试时间：上半年5月25日到28日，下半年11月9日到12日 分数线：所有科目成绩均须达到45分以上（包括45分）方可通过考试 成绩查询：可在“中国计算机技术职业资格网”上查询软考成绩 出成绩时间：预计在11月左右 证书领取时间：一般在考试成绩公布后3~4个月，各地领取时间有所不同
阅读更多...

Copyright China编程 23002807@qq.com

沪ICP备2023033072号-2