- @WebServlet("/register")
- public class RegisterServlet extends HttpServlet {
- @Override
- protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
- //设置编码,告诉 Servlet 按照什么格式来理解请求
- req.setCharacterEncoding("utf8");
- //设置响应的编码,告诉 Servlet 按照什么格式来构造请求
- resp.setContentType("text/html;charset=utf8");
- //1、读取参数中的用户名和密码
- String username = req.getParameter("username");
- String password = req.getParameter("password");
- if (username == null || "".equals(username) || password == null || "".equals(password)){
- //注册失败
- String html = "
注册失败!缺少 username 或者 password 字段!
"; - resp.getWriter().write(html);
- return;
- }
- //2、读数据库,看看数据库中是否存在 username
- UserDao userDao = new UserDao();
- User user = userDao.selectByUsername(username);
- if (user != null){
- //用户已经存在
- String html = "
注册失败!该用户已经存在,请重新注册用户!"
; - resp.getWriter().write(html);
- return;
- }
- //用户不存在,注册用户
- userDao.add(username,password);
- //注册完自动跳转到登录页面
- resp.sendRedirect("login.html");
- }
- }
为了添加一个注册的功能,我重新编写了一个专门用于注册的页面,该页面与登录页面类似
并且在登录页面中新添加了一个注册的按钮,当用户点击到注册按钮之后,就会自动跳转到注册页面进行注册
当设计好注册功能后,我新注册了一个账户,并登录该账户,发现该账户虽然并没有发布任何的博客,但是仍然可以查询到别的用户发布的博客内容,于是我对 BlogDao 中的方法和 博客列表页的 doGet 进行了一些修改
在 selectAll 方法中,不再是查询全部的博客信息,而是只查询对应 userId 的博客,也就是登录的用户自己发布的博客内容而查询的所需要的 userId 的信息,则是从 session 中获取,这样就可以将两个账户发表的博客进行一个有效的分开
点击编辑按钮跳转到编辑页面时,使用 GET
编辑文章后提交新的文章,使用 POST
- @WebServlet("/update")
- public class updateServlet extends HttpServlet {
- private ObjectMapper objectMapper = new ObjectMapper();
- private int BlogId = 0;
- protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
- // 1. 检查当前用户是否登录
- resp.setContentType("application/json;charset=utf-8");
- HttpSession session = req.getSession(false);
- if (session == null) {
- resp.setContentType("text/html; charset=utf8");
- resp.getWriter().write("当前尚未登录, 不能修改!");
- return;
- }
- User user = (User) session.getAttribute("user");
- if (user == null) {
- resp.setContentType("text/html; charset=utf8");
- resp.getWriter().write("当前尚未登录, 不能修改!");
- return;
- }
-
- // 2. 获取到参数中的 blogId
- String blogId = req.getParameter("blogId");
- if (blogId == null || "".equals(blogId)) {
- resp.setContentType("text/html; charset=utf8");
- resp.getWriter().write("当前 blogId 参数不对!");
- return;
- }
-
- // 3. 获取要修改的博客信息.
- BlogDao blogDao = new BlogDao();
- BlogId = Integer.parseInt(blogId);
- Blog blog = blogDao.selectById(Integer.parseInt(blogId));
- if (blog == null) {
- resp.setContentType("text/html; charset=utf8");
- resp.getWriter().write("当前要修改的博客不存在!");
- return;
- }else{
- resp.setContentType("application/json;charset=utf-8");
- resp.getWriter().write(objectMapper.writeValueAsString(blog));
- }
- }
-
- protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
- // 1. 检查当前用户是否登录
- req.setCharacterEncoding("utf-8");
- resp.setContentType("application/json;charset=utf8");
- HttpSession session = req.getSession(false);
- if (session == null) {
- resp.setContentType("text/html; charset=utf8");
- resp.getWriter().write("当前尚未登录, 不能修改!");
- return;
- }
- User user = (User) session.getAttribute("user");
- if (user == null) {
- resp.setContentType("text/html; charset=utf8");
- resp.getWriter().write("当前尚未登录, 不能修改!");
- return;
- }
-
- String title = req.getParameter("title");
- String content = req.getParameter("content");
- if(title == null || "".equals(title) || content == null || "".equals(content)){
- resp.getWriter().write("");
- return;
- }
- int blogId = BlogId;
-
- BlogDao blogDao = new BlogDao();
- Blog blog = new Blog();
- blog.setTitle(title);
- blog.setContent(content);
- blog.setBlogId(blogId);
- blogDao.update(blog);
- resp.sendRedirect("blog_list.html");
- }
- }
此外,为了能够实现更新功能,在 BlogDao 中新增加了一个 update 方法
- public void update(Blog blog) {
- Connection connection = null;
- PreparedStatement statement = null;
- try {
- // 1. 建立连接
- connection = DBUtil.getConnection();
- // 2. 拼装 SQL 语句
- String sql = "update blog set content = ? ,title = ? where blogId = ?";
- statement = connection.prepareStatement(sql);
- statement.setString(1, blog.getContent());
- statement.setString(2, blog.getTitle());
-
- statement.setInt(3, blog.getBlogId());
- // 3. 执行 SQL 语句
- int ret = statement.executeUpdate();
- if (ret == 1) {
- System.out.println("编辑成功");
- } else {
- System.out.println("编辑失败");
- }
- } catch (SQLException e) {
- e.printStackTrace();
- } finally {
- DBUtil.close(connection, statement, null);
- }
- }
重新编写了一个长的和发布文章类似的页面来实现编辑文章,同时在博客详情页中增加了一个 编辑的按钮
- html>
- <html lang="en">
- <head>
- <meta charset="UTF-8">
- <meta http-equiv="X-UA-Compatible" content="IE=edge">
- <meta name="viewport" content="width=device-width, initial-scale=1.0">
- <title>博客编辑页title>
- <link rel="stylesheet" href="CSS/common.css">
- <link rel="stylesheet" href="CSS/blog_edit.css">
-
-
- <link rel="stylesheet" href="editor.md/css/editormd.min.css" />
- <script src="js/jquery.mini.js">script>
- <script src="editor.md/lib/marked.min.js">script>
- <script src="editor.md/lib/prettify.min.js">script>
- <script src="editor.md/editormd.js">script>
- head>
- <body>
- <div class="nav">
- <img src="image/logo2.png" alt="">
- <span>我的博客系统span>
-
- <div class="spacer">div>
- <a href="blog_list.html">主页a>
- <a href="blog_edit.html">写博客a>
- <a href="logout">注销a>
- div>
- <div class="blog-edit-container">
- <form action="update" method="post" style="height: 100%">
- <div class="title">
- <input type="text" placeholder="在此处输入标题" name="title" id="title">
-
- <input type="submit" value="提交修改" id="submit">
- div>
-
-
- <div id="editor">
-
-
- <textarea class="content" name="content" style="display: none">textarea>
- div>
- form>
-
- div>
-
- <script>
- function getEditUpdate(){
- $.ajax({
- type: 'get',
- url: 'update' + location.search,
- success: function(body){
- let title = document.querySelector(".title>#title")
- title.innerHTML = body.title;
- let content = document.querySelector('.content')
- content.innerHTML = body.content;
- }
-
- });
- }
- getEditUpdate();
-
-
- script>
-
- <script>
- //初始化编辑器
- let editor = editormd("editor",{
- //这里的尺寸必须在这里设置,设置样式会被editormd 自动覆盖掉
- width: "100%",
- //设定编辑器高度
- height: "calc(100% - 50px)",
- //编辑器中的初始内容
- markdown: "# 在这里写下一篇博客",
- //指定 editor.md 依赖的插件路径
- path: "editor.md/lib/",
- // 此处要加上一个重要的选项,然后 editor.md 就会自动把用户在编辑器输入的内容同步保存到 隐藏的 textarea 中了!
- saveHTMLToTextarea: true,
- });
- script>
- body>
- html>
在最初代码编写的时候,我直接复用了之前发布文章的页面来实现对文章内容的修改功能,后来发现这样容易使发布功能和编辑功能混淆,最后将两个功能页面分开,重新编写了一个博客编辑的页面
在目前的代码中,我们的博客总数是固定的,无法实时显示该用户的博客总数,于是我们加一个接口来实现这个功能
- @WebServlet("/num")
- public class totalServlet extends HttpServlet {
- @Override
- protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
- HttpSession session = req.getSession(false);
- if (session == null){
- resp.setContentType("text/html;charset=utf8");
- resp.getWriter().write("当前用户未登录!");
- return;
- }
- User user = (User) session.getAttribute("user");
- if (user == null){
- resp.setContentType("text/html;charset=utf8");
- resp.getWriter().write("当前用户未登录!");
- return;
- }
- //确保了登录之后
- resp.setContentType("text/html;charset=utf8");
- String blogId = req.getParameter("blogId");
- BlogDao blogDao = new BlogDao();
- if (blogId ==null){
- resp.getWriter().write(blogDao.selectTotal(user.getUserId())+"");
- }else{
- Blog blog = blogDao.selectById(Integer.parseInt(blogId));
- UserDao userDao = new UserDao();
- User author = userDao.selectById(blog.getUserId());
- resp.getWriter().write(blogDao.selectTotal(author.getUserId()) + "");
- }
- }
- }
此外,还在 BlogDao 中新增了一个计算个人文章总数的方法
- //6. 计算个人文章的总数
- public static Integer selectTotal(int userId){
- Connection connection = null;
- PreparedStatement statement = null;
- ResultSet resultSet = null;
- try {
- connection = DBUtil.getConnection();
- String sql = "select count(userId) from blog where userId = ?";
- statement = connection.prepareStatement(sql);
- statement.setInt(1,userId);
- resultSet = statement.executeQuery();
- return resultSet.getInt(1);
-
- } catch (SQLException throwables) {
- throwables.printStackTrace();
- }finally {
- DBUtil.close(connection,statement,resultSet);
- }
- return null;
- }
在博客详情页和博客列表页中都加入这段代码:
在 BlogDao 中新增一个删除的方法
- public void delete(int blogId){
- Connection connection = null;
- PreparedStatement statement = null;
- try{
- //1、和数据库建立连接
- connection = DBUtil.getConnection();
- //2、构造 sql 语句
- String sql = "delete from blog where blogId = ?";
- statement = connection.prepareStatement(sql);
- statement.setInt(1,blogId);
- //3、执行 sql
- statement.executeUpdate();
- } catch (SQLException e) {
- throw new RuntimeException(e);
- }finally {
- //进行关闭
- DBUtil.close(connection,statement,null);
- }
- }
- @WebServlet("/delete")
- public class DeleteServlet extends HttpServlet {
- @Override
- protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
- HttpSession session = req.getSession(false);
- if (session == null){
- resp.setContentType("text/html;charset=utf8");
- resp.getWriter().write("当前未登录,不能进行删除操作!");
- return;
- }
- User user = (User) session.getAttribute("user");
- if (user == null){
- resp.setContentType("text/html;charset=utf8");
- resp.getWriter().write("当前未登录,不能进行删除操作!");
- return;
- }
-
- //获取 BlogId
- String blogId = req.getParameter("blogId");
- if (blogId == null || "".equals(blogId)){
- resp.setContentType("text/html;charset=utf8");
- resp.getWriter().write("当前 blogId 参数不对!");
- return;
- }
-
- //获取要删除的博客信息
- BlogDao blogDao = new BlogDao();
- Blog blog = blogDao.selectById(Integer.parseInt(blogId));
- if (blog == null){
- resp.setContentType("text/html;charset=utf8");
- resp.getWriter().write("当前要删除的博客不存在,blogId = " + blogId);
- return;
- }
-
- //删除博客内容
- blogDao.delete(Integer.parseInt(blogId));
- //回到博客列表页
- resp.sendRedirect("blog_list.html");
- }
- }
前端代码与前面的同理
在写完代码之后,对页面进行了测试,发现:虽然可以修改代码,但是无法将原先的文章内容进行回显,于是我对前端代码进行了微调,实现回显功能
1、在 title 和 content 中加入 value 属性
2、在函数中修改 title 和 content 的赋值方式,使用 value 进行赋值
在博客详情页点击编辑博客之后,自动跳转到编辑页面,同时将原先的博客内容回显到 markdown 编辑器上,然后对原文进行编辑之后,再次提交修改即可
- @WebServlet("/update")
- public class updateServlet extends HttpServlet {
- private ObjectMapper objectMapper = new ObjectMapper();
- private int BlogId = 0;
- protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
- // 1. 检查当前用户是否登录
- resp.setContentType("application/json;charset=utf-8");
- HttpSession session = req.getSession(false);
- if (session == null) {
- resp.setContentType("text/html; charset=utf8");
- resp.getWriter().write("当前尚未登录, 不能修改!");
- return;
- }
- User user = (User) session.getAttribute("user");
- if (user == null) {
- resp.setContentType("text/html; charset=utf8");
- resp.getWriter().write("当前尚未登录, 不能修改!");
- return;
- }
-
- // 2. 获取到参数中的 blogId
- String blogId = req.getParameter("blogId");
- if (blogId == null || "".equals(blogId)) {
- resp.setContentType("text/html; charset=utf8");
- resp.getWriter().write("当前 blogId 参数不对!");
- return;
- }
-
- // 3. 获取要修改的博客信息.
- BlogDao blogDao = new BlogDao();
- BlogId = Integer.parseInt(blogId);
- Blog blog = blogDao.selectById(Integer.parseInt(blogId));
- if (blog == null) {
- resp.setContentType("text/html; charset=utf8");
- resp.getWriter().write("当前要修改的博客不存在!");
- return;
- }else{
- resp.setContentType("application/json;charset=utf-8");
- resp.getWriter().write(objectMapper.writeValueAsString(blog));
- }
- }
-
- protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
- // 1. 检查当前用户是否登录
- req.setCharacterEncoding("utf-8");
- resp.setContentType("application/json;charset=utf8");
- HttpSession session = req.getSession(false);
- if (session == null) {
- resp.setContentType("text/html; charset=utf8");
- resp.getWriter().write("当前尚未登录, 不能修改!");
- return;
- }
- User user = (User) session.getAttribute("user");
- if (user == null) {
- resp.setContentType("text/html; charset=utf8");
- resp.getWriter().write("当前尚未登录, 不能修改!");
- return;
- }
-
- String title = req.getParameter("title");
- String content = req.getParameter("content");
- if(title == null || "".equals(title) || content == null || "".equals(content)){
- resp.getWriter().write("");
- return;
- }
- int blogId = BlogId;
-
- BlogDao blogDao = new BlogDao();
- Blog blog = new Blog();
- blog.setTitle(title);
- blog.setContent(content);
- blog.setBlogId(blogId);
- blogDao.update(blog);
- resp.sendRedirect("blog_list.html");
- }
- }
- @WebServlet("/admin")
- public class adminServlet extends HttpServlet {
- @Override
- protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
- HttpSession session = req.getSession(false);
- if (session == null){
- resp.setContentType("text/html;charset=utf8");
- resp.getWriter().write("当前未登录,无法进行审核");
- return;
- }
- User user = (User) session.getAttribute("user");
- if (user == null){
- resp.setContentType("text/html;charset=utf8");
- resp.getWriter().write("当前未登录,无法进行审核");
- return;
- }
- String blogId = req.getParameter("blogId");
- BlogDao blogDao = new BlogDao();
- ObjectMapper objectMapper = new ObjectMapper();
- if (blogId == null){
- //query string 不存在,则是审核详情页列表页
- List
blogs = blogDao.selectAudit(); - String respJson = objectMapper.writeValueAsString(blogs);
- resp.setContentType("application/json;charset=utf8");
- resp.getWriter().write(respJson);
- }else {
- //query string 存在,则是审核详情页
- Blog blog = blogDao.selectById(Integer.parseInt(blogId));
- String respJson = objectMapper.writeValueAsString(blog);
- resp.setContentType("application/json;charset=utf8");
- resp.getWriter().write(respJson);
- }
- }
-
- @Override
- protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
- //审核通过的 post 请求
- HttpSession session = req.getSession(false);
- if (session == null){
- resp.setContentType("text/html;charset=utf8");
- resp.getWriter().write("当前未登录,无法进行审核");
- return;
- }
- User user = (User) session.getAttribute("user");
- if (user == null){
- resp.setContentType("text/html;charset=utf8");
- resp.getWriter().write("当前未登录,无法进行审核");
- return;
- }
- Blog blog = new Blog();
- String blogId = req.getParameter("blogId");
- BlogDao blogDao = new BlogDao();
- blogDao.changeStatus(Integer.parseInt(blogId),1);
- resp.sendRedirect("admin_list.html");
- }
- }
- @WebServlet("/false")
- public class falseServlet extends HttpServlet {
- @Override
- protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
- //审核不通过的 post 请求
- HttpSession session = req.getSession(false);
- if (session == null){
- resp.setContentType("text/html;charset=utf8");
- resp.getWriter().write("当前未登录,无法进行审核");
- return;
- }
- User user = (User) session.getAttribute("user");
- if (user == null){
- resp.setContentType("text/html;charset=utf8");
- resp.getWriter().write("当前未登录,无法进行审核");
- return;
- }
- Blog blog = new Blog();
- String blogId = req.getParameter("blogId");
- BlogDao blogDao = new BlogDao();
- blogDao.changeStatus(Integer.parseInt(blogId),-1);
- resp.sendRedirect("admin_list.html");
- }
-
- @Override
- protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
- //统计审核通过了的文章总数并返回
- HttpSession session = req.getSession(false);
- if (session == null) {
- resp.setContentType("text/html;charset=utf8");
- resp.getWriter().write("当前用户未登录!");
- return;
- }
- User user = (User) session.getAttribute("user");
- if (user == null) {
- resp.setContentType("text/html;charset=utf8");
- resp.getWriter().write("当前用户未登录!");
- return;
- }
- //确保了登录之后
- resp.setContentType("text/html;charset=utf8");
- String blogId = req.getParameter("blogId");
- BlogDao blogDao = new BlogDao();
- int num = blogDao.countSuccess();
- resp.getWriter().write(num + "");
- }
- }
前端代码与之前的差不多,这里就只展示一部分
- @WebServlet("/comments")
- public class commentsServlet extends HttpServlet {
- public int blogId;
- @Override
- protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
- ObjectMapper objectMapper = new ObjectMapper();
- HttpSession session = req.getSession(false);
- if (session == null){
- resp.setContentType("text/html;charset=utf8");
- resp.getWriter().write("当前用户未登录!");
- return;
- }
- User user = (User) session.getAttribute("user");
- if (user == null){
- resp.setContentType("text/html;charset=utf8");
- resp.getWriter().write("当前用户未登录!");
- return;
- }
- CommentsDao commentsDao = new CommentsDao();
- blogId = Integer.parseInt(req.getParameter("blogId"));
- List
commentsList = commentsDao.selectAll(blogId); - //把 数据 转换成 json 格式
- String respJson = objectMapper.writeValueAsString(commentsList);
- resp.setContentType("application/json;charset=utf8");
- resp.getWriter().write(respJson);
- }
- @Override
- protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
- HttpSession session = req.getSession(false);
- if (session == null){
- resp.setContentType("text/html;charset=utf8");
- resp.getWriter().write("当前用户未登录,不能发表评论!");
- return;
- }
- User user = (User) session.getAttribute("user");
- if (user == null){
- resp.setContentType("text/html;charset=utf8");
- resp.getWriter().write("当前用户未登录,不能发表评论!");
- return;
- }
-
- //获取评论信息
- req.setCharacterEncoding("utf8");
- String content = req.getParameter("content");
- if (content == null || "".equals(content)){
- resp.setContentType("text/html;charset=utf8");
- resp.getWriter().write("当前提交数据为空!");
- return;
- }//在博客详情页,对
- //构造 comments 对象
- String blogId = req.getParameter("blogId");
-
- Comments comments = new Comments();
- comments.setContent(content);
- comments.setPostTime(new Timestamp(System.currentTimeMillis()));
- comments.setBlogId(Integer.parseInt(blogId));
- //插入数据
- CommentsDao commentsDao = new CommentsDao();
- commentsDao.add(comments);
- //跳转到博客列表页
- resp.sendRedirect("blog_list.html");
- }
- }
在博客详情页添加了一个小方块来放置评论,同时在详情页的最底下增加提交评论的功能
在普通用户页面计算通过审核的文章和未通过审核的文章,在管理员页面计算待审核的文章和审核成功的文章个数
主要通过 status 列来进行统计,这里就不再展示代码了