目录
一.项目简介
基于HTTP协议,Tomcat,Servlet,模板引擎实现的一款类似于csdn的博客系统.
本博客系统的核心功能:
- 支持用户注册,登录及注销功能.
- 博客列表页: 能够展示所有发布的博客(概要)
- 博客编辑页: 能够编辑并且发布博客.
- 博客详情页: 能够展示一篇博客具体的内容及信息.
项目源码链接
:
博客系统项目代码(servlet+模板引擎版本)
项目效果展示及体验
:
博客系统
二.具体实现
1.准备工作
1.1 创建maven项目,并创建好目录结构.
1.2 配置 pom.xml 文件,引入所需依赖.
2.设计数据库
需要把博客信息及用户信息存储到数据库中.
2.1 创建用户表
2.2 创建博客表
3.封装数据库操作
把代码中关于数据库的操作封装起来,实现代码的简洁
3.1封装DBUtil
这是一个单例类,用来获取数据库的连接.
3.2创建实体类
这里需要创建两个实体类(Blog 和 User),每个实体类对象,代表对应的数据库表中的每一条数据.
3.3 创建 Dao类
DAO 全称为 “data access object”, 主要的功能就是对于某个数据库表进行增删改查.
这里需要分别创建UserDao类 和 BlogDao类 来分别封装对于对应表的增删改查的操作.
类中具体的实现请关注本博客的源码链接.
4. 实现页面
这里关于前端的代码的实现就不做过多解释, 主要关注前端与后端如何进行交互.
4.1 初始化模板引擎
让服务器基于模板引擎, 来把从数据库查找到的对应的数据返回到网页上面.
这里封装一个 ThymeleafConfig 类, 用来创建一个引擎实例.(
这个类实现ServletContextListener接口,重写其对应的方法.
目的是当 ServletContext 创建完毕后, 在 contextInitialized 中创建 TemplateEngine 实例和 ServletContextTemplateResolver 实例, 并完成初始化操作.
把创建出来的 TemplateEngine 实例放到 ServletContext 中.
后续 Servlet 如果需要使用 TemplateEngine , 那么直接从 ServletContext 获取到之前创建好的TemplateEngine 实例即可, 不必重新创建
)
4.2 实现博客列表页
(1). 先把博客列表页的模板实现出来(前端要渲染的内容)
(2). 构建博客列表页对应的 servlet
注意: 1.这里渲染博客内容时,只截取博客正文当中的前一部分展示在列表页, 以保证列表页的展示效果. 而这个截取正文的需求就可以在封装好的 BlogDao 类中的获取所有博客中来实现,在查询数据库的时候,就直接在获取正文之后进行判定,如果内容超过列表页中展示的长度就截断.
2. 如果博客列表页里显示的内容过多,会破坏整个页面的结构. 解决方案: 在前端(css) 给显示博客列表的容器中添加
overflow
属性.
3. 一般博客列表页在显示的时候是保证当前最新的博客显示在最上面, 所以此处也需要稍微修改一些查询所有博客的sql.
4.3 实现博客详情页
这里的具体操作步骤与实现博客列表页相同, 先实现网页模板,再构建一个对应的Servlet 生成这个页面.
4.4 实现登录 和注册页面
登录页面与注册页面是不同于上面的页面的. 这两个页面的内容是固定的,不需要模板来动态替换,也就是页面中没有需要动态生成的内容. 所以在前端页面实现完成之后, 主要的目标就是实现对应的 Servlet 来处理登录和注册的请求即可.
实现处理登录请求的Servlet.
- 先从请求中获取出 用户输入的用户名和密码(获取之后要进行合理性判断)
- 从数据库里根据得到的用户名查询用户(若查询不到说明用户名是错误的)
- 比较根据用户名查询到的用户的密码是否和输入密码一致
- 登录成功之后, 把当前用户对象存储到 HttpSession 中(创建会话)
- 重定向到博客列表页
实现处理注册请求的Servlet.
- 先从请求中获取到 用户名,密码和确认密码.(获取之后进行合理性判断)
- 从数据库里根据用户名查询用户 (查询不到说明这个用户名是可以进行注册使用的)
- 判断 获取到的密码和确认密码是否相同
- 注册成功, 将该用户插入数据库中
- 重定向到登录页
4.5 实现博客编辑上传页
-
先修改博客编辑页
- 再实现对应的 Servlet 处理上传博客请求
- 首先要判断当前用户是否登录,未登录状态下不可以发布文章.(如何判断下文介绍)
- 读取请求中的参数, 及文章的标题和内容 (要进行合理性校验)
- 构造一个Blog对象,并插入到数据库中
- 重定向到博客列表页
5.功能补充
以上,博客系统的核心功能已经实现,其次就是一些其他功能的补充,来进一步优化改博客系统.
5.1 登录校验
其实, 在访问博客列表页,博客详情页和博客编辑页之前,我们是需要先进行登录的. 未登录状态下是不可以访问这几个页面的, 所以此处就应该实现对登录状态进行校验的功能.
若当前是处于登录状态就可以访问这几个页面, 若是未登录状态下直接访问的话就直接重定向到登录页面.
如何实现这个功能, 其实这里我们就可以尝试获取在登录成功时我们存入会话(session)的 user 对象. 因为我们在实现登录的逻辑中是创建了一个会话并且将该对象存入其中的.
这里我们单独封装一个 Util 类,来获取当前会话中存入的user对象.
在其他类中就可以直接调用这个方法来进行登录校验,若获取对象不为空则说明登录成功.
5.2 实现注销功能
在前端页面中,是存在一个注销按钮的, 其实就是一个 a标签 我们需要实现一个对应的Servlet 来处理这个 a标签的注销请求.
注销功能的实现其实就是获取到当前会话中的 user 对象, 然后把这个对象从会话中移除即可, 这样的话,后续其他请求在进行登录校验的时候就无法获取到这个对象, 登录校验无法通过也就视为是未登录状态了.
5.3 实现删除博客功能
删除博客功能的实现, 主要是判断这一篇博客是否是当前登录用户所写的博客. 当前用户只能删除自己所写的博客,不能删除其他用户所写的博客. 所以 在博客详情页中需要新增一个”删除” 按钮 (如果当前博客的作者正是登录用户本身,才会显示这个删除按钮), 后端代码中我们可以对当前登录的用户和文章作者进行判断, 然后返回结果到前端, 前端根据结果来判断是否进行渲染即可.
这个删除按钮同样是一个 a标签, 所以我们需要实现一个对应的Servlet 来处理这个 a标签的删除请求. 获取到 url 中的 blogId 然后根据 blogId 删除数据库中对应的博客数据即可.
6. 其他实现
1.导航栏中用户信息的修改.(也是基于模板动态替换的)
2. markdown 编辑器的注入和样式修改
这里主要是涉及到前端的知识,此处就不做过多介绍了, 详细细节可以参考项目源码.
三. 总结
该博客系统项目,主要是基于 Servlet + Http协议 来进行前后端交互, 使用模板引擎对前端页面进行渲染.
实现项目的重点在于理清前后端进行交互的逻辑,进而进行代码的实现. 本项目其实还有非常大的扩充空间,要逐渐进行优化和完善.