基于Java+SpringBoot+Vue前后端分离个人博客系统设计和实现
随着国内市场经济这几十年来的蓬勃发展，突然遇到了从国外传入国内的互联网技术，互联网产业从开始的群众不信任，到现在的离不开，中间经历了很多挫折。本次开发的个人博客系统，有管理员，用户，博主三个角色。管理员功能有个人中心，用户管理，博主管理，文章分类管理，博主文章管理，系统公告管理，轮播图管理。博主可以注册登录，修改个人信息，对自己发布的博主文章进行管理操作。开发本程序后台用到了Spring Boot
博主介绍：✌全网粉丝30W+,csdn特邀作者、博客专家、CSDN新星计划导师、Java领域优质创作者,博客之星、掘金/华为云/阿里云/InfoQ等平台优质作者、专注于Java技术领域和毕业项目实战✌
🍅文末获取源码联系🍅
👇🏻 精彩专栏推荐订阅👇🏻 不然下次找不到哟
系统介绍：
随着国内市场经济这几十年来的蓬勃发展，突然遇到了从国外传入国内的互联网技术，互联网产业从开始的群众不信任，到现在的离不开，中间经历了很多挫折。本次开发的个人博客系统，有管理员，用户，博主三个角色。管理员功能有个人中心，用户管理，博主管理，文章分类管理，博主文章管理，系统公告管理，轮播图管理。博主可以注册登录，修改个人信息，对自己发布的博主文章进行管理操作。用户可以注册登录，查看管理员发布的公告信息和博主发布的文章信息，还可以对博主文章进行收藏评论以及评论操作。开发本程序后台用到了Spring Boot开发技术，页面设计采用VUE框架和layui样式。数据库采用关系数据库市场占有率最高的MySQL作为本程序使用的数据库，完全符合程序使用并且有丰富的拓展余地。程序从需求到设计，从开发到测试，都在功能上和性能上都不断的进行了调试，让开发的程序在使用上用户体验更美好。
程序的功能在系统分析这部分已经确定了，这部分主要还是针对程序功能进行更加详细的设计，设计成果使用结构图展示直观明了，也更容易让人理解。绘制结构图采用的工具是Visio，使用它可以快速绘制出不同角色拥有的功能结构。
图4.2 功能结构图
程序上交给用户进行使用时，需要提供程序的操作流程图，这样便于用户容易理解程序的具体工作步骤，现如今程序的操作流程都有一个大致的标准，即先通过登录页面提交登录数据，通过程序验证正确之后，用户才能在程序功能操作区页面操作对应的功能。
程序操作流程图
功能截图：
对个人博客系统进行了前面的系统分析，系统设计之后，接下来的环节就是个人博客系统的具体编码实现功能的部分。这部分内容会显示系统各个功能的具体界面运行效果。
5.1 管理员功能实现
5.1.1 用户管理
管理员可以对用户信息进行添加，修改，删除，查询操作。
对个人博客系统进行了前面的系统分析，系统设计之后，接下来的环节就是个人博客系统的具体编码实现功能的部分。这部分内容会显示系统各个功能的具体界面运行效果。
5.1 管理员功能实现
5.1.1 用户管理
管理员可以对用户信息进行添加，修改，删除，查询操作。
图5.1 用户管理页面
5.1.2 文章分类管理
管理员可以对文章分类信息进行添加，修改，删除，查询操作。
图5.2 文章分类管理页面
5.1.3 公告信息管理
管理员可以对公告信息进行添加，修改，删除，查询操作。
图5.3 公告信息管理页面
5.1.4 博主信息管理
管理员可以对博主信息信息进行添加，修改，删除，查询操作。
图5.4 博主信息管理页面
5.2 博主功能实现
5.2.1 博主文章管理
博主可以对自己发布过的博主文章信息进行添加，修改，删除，查询操作，还可以查看评论。
图5.5首页页面
5.3 用户功能实现
5.3.1 博主文章信息
用户可以在博主文章里面查看到博主发布的文章信息，可以对博主文章信息进行查看，收藏，赞踩，评论操作。
图5.6 博主文章信息页面
5.3.2 我的收藏
我的收藏里面可以看到自己收藏过的博主文章信息，可以去点击收藏的信息去取消收藏。
图5.7 我的收藏页面
图5.1 用户管理页面
5.1.2 文章分类管理
管理员可以对文章分类信息进行添加，修改，删除，查询操作。
图5.2 文章分类管理页面
5.1.3 公告信息管理
管理员可以对公告信息进行添加，修改，删除，查询操作。
图5.3 公告信息管理页面
5.1.4 博主信息管理
管理员可以对博主信息信息进行添加，修改，删除，查询操作。
图5.4 博主信息管理页面
5.2 博主功能实现
5.2.1 博主文章管理
博主可以对自己发布过的博主文章信息进行添加，修改，删除，查询操作，还可以查看评论。
图5.5首页页面
5.3 用户功能实现
5.3.1 博主文章信息
用户可以在博主文章里面查看到博主发布的文章信息，可以对博主文章信息进行查看，收藏，赞踩，评论操作。
图5.6 博主文章信息页面
5.3.2 我的收藏
我的收藏里面可以看到自己收藏过的博主文章信息，可以去点击收藏的信息去取消收藏。
图5.7 我的收藏页面
代码实现：
/**
* 登录相关
*/
@RequestMapping("users")
@RestController
public class UserController{
@Autowired
private UserService userService;
@Autowired
private TokenService tokenService;
/**
* 登录
*/
@IgnoreAuth
@PostMapping(value = "/login")
public R login(String username, String password, String role, HttpServletRequest request) {
UserEntity user = userService.selectOne(new EntityWrapper<UserEntity>().eq("username", username));
if(user != null){
if(!user.getRole().equals(role)){
return R.error("权限不正常");
}
if(user==null || !user.getPassword().equals(password)) {
return R.error("账号或密码不正确");
}
String token = tokenService.generateToken(user.getId(),username, "users", user.getRole());
return R.ok().put("token", token);
}else{
return R.error("账号或密码或权限不对");
}
}
/**
* 注册
*/
@IgnoreAuth
@PostMapping(value = "/register")
public R register(@RequestBody UserEntity user){
// ValidatorUtils.validateEntity(user);
if(userService.selectOne(new EntityWrapper<UserEntity>().eq("username", user.getUsername())) !=null) {
return R.error("用户已存在");
}
userService.insert(user);
return R.ok();
}
/**
* 退出
*/
@GetMapping(value = "logout")
public R logout(HttpServletRequest request) {
request.getSession().invalidate();
return R.ok("退出成功");
}
/**
* 密码重置
*/
@IgnoreAuth
@RequestMapping(value = "/resetPass")
public R resetPass(String username, HttpServletRequest request){
UserEntity user = userService.selectOne(new EntityWrapper<UserEntity>().eq("username", username));
if(user==null) {
return R.error("账号不存在");
}
user.setPassword("123456");
userService.update(user,null);
return R.ok("密码已重置为：123456");
}
/**
* 列表
*/
@RequestMapping("/page")
public R page(@RequestParam Map<String, Object> params,UserEntity user){
EntityWrapper<UserEntity> ew = new EntityWrapper<UserEntity>();
PageUtils page = userService.queryPage(params, MPUtil.sort(MPUtil.between(MPUtil.allLike(ew, user), params), params));
return R.ok().put("data", page);
}
/**
* 信息
*/
@RequestMapping("/info/{id}")
public R info(@PathVariable("id") String id){
UserEntity user = userService.selectById(id);
return R.ok().put("data", user);
}
/**
* 获取用户的session用户信息
*/
@RequestMapping("/session")
public R getCurrUser(HttpServletRequest request){
Integer id = (Integer)request.getSession().getAttribute("userId");
UserEntity user = userService.selectById(id);
return R.ok().put("data", user);
}
/**
* 保存
*/
@PostMapping("/save")
public R save(@RequestBody UserEntity user){
// ValidatorUtils.validateEntity(user);
if(userService.selectOne(new EntityWrapper<UserEntity>().eq("username", user.getUsername())) !=null) {
return R.error("用户已存在");
}
userService.insert(user);
return R.ok();
}
/**
* 修改
*/
@RequestMapping("/update")
public R update(@RequestBody UserEntity user){
// ValidatorUtils.validateEntity(user);
userService.updateById(user);//全部更新
return R.ok();
}
/**
* 删除
*/
@RequestMapping("/delete")
public R delete(@RequestBody Integer[] ids){
userService.deleteBatchIds(Arrays.asList(ids));
return R.ok();
}
}论文参考：
源码获取：
大家点赞、收藏、关注、评论啦 、查看👇🏻获取联系方式👇🏻
精彩专栏推荐订阅：在下方专栏👇🏻
前往低代码交流专区
更多推荐
0
0- 0
已为社区贡献431条内容
所有评论(0)