一、项目简介

基于servlet，采用前后端分离的方式，实现个人博客系统，功能包括：登录、注销、编辑、删除博客、发布博客等.

二、项目开发流程

准备工作包括，创建maven项目，引入依赖servlet，jackson，mysql，
说明：

将前端页面拷贝到webapp目录下
因为在后续打包部署时，也要讲前端页面一起打包
在这里插入图片描述

Model层主要工作是实现数据库相关的代码

（1）设计数据库，也就是创建数据库和设计表结构
根据需求设计数据库，我们的需求包括博客列表页的展示，查看全文，登录，柏编辑页，需求中主要涉及到两个实体——博客和用户，因此我们要创建博客表和用户信息表

博客表：存储所有的博客数据
用户表：存储所有的用户信息

将建库建表的sql语句存储到db.sql中

博客表中的字段：博客id(自增主键)，标题，正文，作者id，发布时间
用户表中的字段：用户id(自增主键)，用户名，密码

（2）封装数据库操作

针对四个页面(登录页，列表页，详情页，编辑页)，分别约定前后端交互接口，然后编写后端和前端代码

（1）博客列表页：在这个页面中需要展示出数据库中所有的博客

在这里插入图片描述

（2）博客详情页：在博客详情页的页面加载的过程，触发ajax请求来访问服务器，获取到博客内容，然后填充到博客详情页中

在这里插入图片描述

实现服务器端代码，同样通过BlogServlet类中的doGet方法处理前端发来的请求，先尝试获取请求中的blogId参数，如果blogId不存在说明该请求是用来获取博客列表，如果blogId存在，说明请求是用来获取某篇博客的详情
实现前端代码，加载博客详情页时，发送ajax请求给服务器，获取博客详情并显示到页面上

（3）登录页：用户输入用户名和密码进行登录

约定前后端接口
请求：POST方法 url：/login
数据格式：application/x-www-form-urlencoded ，使用form表单提交用户名和密码给后端
响应：状态码 302，因为登录成功后需要进行跳转
Location:blog_list.html
实现服务器端，通过LoginServlet类处理前端发来的登录请求
获取请求中的参数，然后和数据库中的内容进行比较，比较通过则创建会话

（4）实现验证登录的功能：也就是在访问博客列表页或详情页时，需要检查用户的登录状态，如果此时用户未登录需要强制跳转到登录页
实现的方式是，在访问博客列表页和详情页时通过ajax发送请求，获取用户的登录状态，如果没有获取到则跳转到登录页

（5）正确显示用户信息：在博客列表页显示当前登录的用户，在博客详情页显示当前文章的作者信息
在这里插入图片描述

对于博客列表页来说：

对于博客详情页来说：

（6）实现注销功能：退出当前登录的状态
在这里插入图片描述

约定前后端接口：GET方法 url：logout
实现后端代码：通过LogoutServlet类处理前端发来的注销请求，获取当前登录用户的session对象，将session中的user属性删除，并返回一个重定向地址，因为我们在验证用户登录的时候需要同时具备session对象和user属性
实现前端代码：在注销按钮的 a标签中的herf属性添加logout，这样在点击注销按钮的时候，同时发送一个请求给后端

（7）发布博客的功能：在博客编辑页，点击发布博客后，能后将该博客存储到数据库中，并且能在博客列表页中显示出来
在这里插入图片描述

（8）删除博客的功能：只有当前登录的用户能删除其自己写的博客而不能删除别人的博客，例如当前的登录用户为张三，那么张三只能删除文章作者为张三的文章，而不能删除其他作者的文章
在这里插入图片描述

页面上的处理：
因此我们需要在博客详情页进行判断，当前文章作者和登录用户是否是同一个人，如果是就在导航栏中添加一个删除按钮，如果不是就不显示

服务器端的处理：
用户点击删除按钮，触发一个HTTP请求，HTTP请求就会让服务器删除指定的博客

判断登录用户和文章作者的关系:

约定前后端接口：GET方法 url：userInfo?blogId=?
实现后端代码：在User类中添加字段yourblog，当前字段非0表示该文章是当前登录用户写的，反之不是，在UserInfoServlet类中，判断当前登录用户和当前温行作者是否是同一个人，如果是将yourblog设置为1并返回，如果不是则设置为0
实现前端代码：访问详情页时，通过ajax发送请求，从服务器获取作者信息，判断yourblog字段，如果非0，则在当前页面添加删除按钮，否则不添加

实现删除功能：