博客管理系统--显示、退出、发布功能

news2024/10/6 16:27:26

    • 6:显示用户信息
    • 7:退出登录
    • 总结博客管理系统

6:显示用户信息

这部分;希望是根据用户来显示;如果是博客列表页则显示登录用户的信息;如果是博客详情页则显示作者的信息。
在这里插入图片描述
1:前后端交互接口约定
GET /login

响应
HTTP/1.1 200 OK
{
userId :1,
username:‘zhangsan’,
password:‘123’

}

拿到后端响应的数据对着构造就好了
在这里插入图片描述
在这里插入图片描述
后端代码:就是刚才的判断是否登录;登录了返回这个对象
在这里插入图片描述
博客详情页;这里的用户名就应该换成作者名;我们应该把当前的博客id发送过去才能知道这篇文章关联的是哪个用户。数据库可以根据博客id查找用户;返回这个对象;然后我们把用户名取出来添加到这个h3标题里
在这里插入图片描述
前端:
在这里插入图片描述

package api;

import com.fasterxml.jackson.databind.ObjectMapper;
import model.Blog;
import model.BlogDao;
import model.User;
import model.UserDao;

import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;

@WebServlet("/author")
public class BLog_AuthorServlet extends HttpServlet {
    private ObjectMapper objectMapper = new ObjectMapper();
    @Override
    protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
        String blogId = req.getParameter("blogId");
        if (blogId == null) {
            resp.setContentType("text/html; charset=utf8");
            resp.getWriter().write("参数非法, 缺少 blogId");
            return;
        }
        // 根据 blogId 查询 Blog 对象
        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;
        }
        // 根据 blog 中的 userId 找到对应的用户信息
        UserDao userDao = new UserDao();
        User author = userDao.selectById(blog.getUserId());
        System.out.println("查到了吗"+author.getUsername());
        String respJson = objectMapper.writeValueAsString(author);
        resp.setContentType("application/json; charset=utf8");
        resp.getWriter().write(respJson);
        System.out.println("请求发送了吗");
    }
}

在这里插入图片描述
这里就注意一下;因为刚开始是添加三篇文章;它的userId是1、2、3.但是只有两个用户;所以第三篇文章当前是查询不到的。

7:退出登录

这个功能就得回到博客列表页的右上角;退出登录;跳转到登录页面。还有你的把HttpSession干掉或者把user干掉。这样才不会说用户退出登录后跳转到登录页;它不登录也能直接通过输入URL访问博客列表、博客详情页、博客编辑页。HttpSession还不容易干掉;只有获取/创建会话的getSession方法;没有删除会话的方法;user比较容易删除;使用removeeAtteibute。(因为我们在后端代码两个判定都存在才是登录状态;所以删除一个就能解决问题)
在这里插入图片描述
在这里插入图片描述

在这个注销的a标签超链接上实现就好了;跳转一个路径;我们可以利用这个路径发送一个GET请求
a标签也是和form一样;可以触发跳转页面的。可以搭配302使用。
GET logout

HTTP/1.1 302
Location:blog_login3.html

在这里插入图片描述
在这里插入图片描述

8:发布博客
现在到操作最后一个页面:把强制登录的逻辑粘贴过去先;列表页的写博客a标签跳转到博客编辑页;

在这里插入图片描述
发布博客这个按钮:就是添加数据到数据库的操作;

在这里插入图片描述

1:约定前后端交互接口
POST /blog

title=这是标题&conten=这是正文。搞个form标签就能把这两个数据传过去(使用ajax也可以;但是form表单可以更简单一点。)
一篇博客我们设置有5部分;blogId(自增主键;数据库自己生成);title content就是我们要传的两部分;userId 作者信息;可以从会话拿到;就看提交的是谁。postTime 当前时刻。

响应:
HTTP/1.1 302
Location:blog_list1.html

2:后端代码

package api;

import model.Blog;
import model.BlogDao;
import model.User;

import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import javax.servlet.http.HttpSession;
import java.sql.Timestamp;
import java.io.IOException;

@WebServlet("/writerblog")
public class Blog_writerServlet extends HttpServlet {
    @Override
    protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
       //先获取到这些东西;然后初始化到一个blog对象;然后再存入数据库。
        // 因为我们要BlogDao的add方法;里面逻辑可以把一个对象里面东西存数据库里
        Blog blog=new Blog();
        HttpSession httpSession = req.getSession(false);
        if (httpSession == null) {
            resp.setContentType("text/html; charset=utf8");
            resp.getWriter().write("当前未登录, 无法发布博客!");
            return;
        }
        User user = (User) httpSession.getAttribute("user");
        if (user == null) {
            resp.setContentType("text/html; charset=utf8");
            resp.getWriter().write("当前未登录, 无法发布博客!");
            return;
        }
        // 确保登录之后, 就可以把作者给拿到了.
//     获取博客标题、正文 ;这个名字和form表单的name属性对应
        req.setCharacterEncoding("utf8");
        String title=req.getParameter("title");
        String content=req.getParameter("content");
        if (title == null || "".equals(title) || content == null || "".equals(content)) {
            resp.setContentType("text/html; charset=utf8");
            resp.getWriter().write("当前提交数据有误! 标题或者正文为空!");
            return;
        }

        //现在就构造这个blog对象
        blog.setTitle(title);
        blog.setContent(content);
        blog.setUserId(user.getUserId());
        // 发布时间, 在 java 中生成 / 数据库中生成 都行
        blog.setPostTime(new Timestamp(System.currentTimeMillis()));
        // 插入数据库
        BlogDao blogDao = new BlogDao();
        blogDao.add(blog);

        // 跳转到博客列表页
        resp.sendRedirect("blog_list.html");

    }
}

3:前端代码
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

查看结果框怎么这么小去了;前端出问题就开开发者工具;代码能对应到显示。编辑器设置的高度是相对父元素的百分比。现在插入个from表单;是父元素变了。现在编辑框的100%是以from为基准了。给form表单也设置一个相对父元素100%就好了。
在这里插入图片描述

在这里插入图片描述

这些页面按标签按钮都修改成对应跳转的页面:将a标签的内容路径换成要跳转的页面即可
编辑页的这三个按钮:
在这里插入图片描述

还有登录页的这两个按钮:点击后让它们出现返回这个登录页;因为没有登录
在这里插入图片描述
注意:如果@WebServlet(“writerblog”)的斜杠没有写;整个tomcat启动都会异常;wbapp下的其它资源都是无法被访问到的。
在这里插入图片描述

总结博客管理系统

可扩展功能:
1:保存草稿功能;有时候博客写一半可能遇到别的事情要处理;没写完又不想发布;就迫切的需要一个保存草稿的功能。

2:这个小图标可以修改的美观一些;网上找一个favour文件;放tomcat目录里。但是目前无伤大雅。
在这里插入图片描述
3:上传头像

4:注册功能

5:博客评论

6:分类功能

7:修改博客

编写过程:
1:前端先所有的效果实现;通过固定的代码展现效果。

2:数据库操作的封装;这个是和前端页面中想要什么样的功能是相关联的。比如查看全文;我们就需要一个能根据博客id查询这篇文章的数据库操作;我们把这个操作封装;让我们以调用这个方法就能实现改功能。

3:建库建表;属性是和文章、用户的属性相关联。创建实体类;作为存数据和发送数据的载体。实体类和数据库的表是完全想关联对应的。

4:编写前后端交互接口;比如前端的输入URL或者点击查看全文这样的操作;我们要发送请求;做出响应。最后把这些动态的响应结果(每个用户的响应结果可能不一样)替换掉之前写死的页面内容。

部署云服务器上:修改代码中的数据库密码要和云服务器的一样;打war包;pom.mxl配置文件修改打war包形式;将sql文件的数据库操作再去云服务器的数据库执行一遍。复制war包粘贴到tomcat的webapps目录下。部署云服务器具体操作查看前面部署表白墙程序。

用户名:zhangsan 密码:123

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/515703.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

如何压缩pdf文件大小?四种方法随意选择

如何压缩pdf文件大小?PDF文件格式由于其跨平台性,易于浏览、打印和传输等特点,在现代社会中广泛应用于各个领域。然而,随着PDF文件越来越大,传输及存储所需的时间也会变得越来越长,从而降低了工作效率。在这…

简单记忆clarke和park坐标变换

简单记忆clarke和park坐标变换 简介 想用简单的办法把这些变换矩阵写出来,需要的时候可以使用,不用再去翻书(当然完全记住还是更快一些)。只是自己用来记忆这些变换的方法。 具体可以参考:手撕系列(2&am…

【Redis】实现及优化分布式锁:实现、解决误删锁问题以及lua脚本确保redis操作原子性

目录 一、概念及不同分布式锁实现的对比 1、概念 2、特征 3、不同分布式锁实现的对比 二、Redis实现分布式锁的思路 1、获取锁思路 2、释放锁思路 三、代码实现分布式锁 1、准备 2、获取锁 2、释放锁 四、分布式锁的误删锁问题 1、问题 2、原因 五、误删锁的解决…

分布式配置中心

一、Config概述 Spring Cloud Config 解决了在分布式场景下多环境配置文件的管理和维护 好处: 集中管理配置文件 不同环境不同配置,动态化的配置更新 配置信息改变时,不需要重启即可更新配置信息到服务 二、Config 快速入门 1、使用git…

5.10-5.11总结

我教的课中 课程双击事件,跳转到课程界面 输入学生姓名和学号,添加学生 加载学生名单,双击学生,弹出学生资料,并且可以删除学生 但删除学生还有bug。

LeetCode - 1552 两球之间的磁力

目录 题目来源 题目描述 示例 提示 题目解析 算法源码 题目来源 1552. 两球之间的磁力 - 力扣(LeetCode) 题目描述 在代号为 C-137 的地球上,Rick 发现如果他将两个球放在他新发明的篮子里,它们之间会形成特殊形式的磁力。…

二维各向同性介质弹性波数值模拟(交错网格有限差分法)

一、一阶速度-应力弹性波方程 在二维各向同介质xoz平面内,假定体力为0。 从上面方程当中,我们为了得到各点的应力和速度值,就需要得到关于对时间t和空间x,z的偏导。 二、时间上的2M阶差分 由Taylor公式得 三、空间2N阶近似差分…

知识推理——CNN模型总结(持续更新)

记录一下我看过的利用CNN实现知识推理的论文。 最后修改时间:2023.05.10 目录 1.ConvE 1.1.解决的问题 1.2.优势 1.3.贡献与创新点 1.4.方法 1.4.1 为什么用二维卷积,而不是一维卷积? 1.4.2.ConvE具体实现 1.4.3.1-N scoring 1.5.…

RK3568平台开发系列讲解(驱动基础篇)GPIO控制方式

🚀返回专栏总目录 文章目录 一、使用GPIO sysfs接口控制IO二、使用libgpiod控制IO沉淀、分享、成长,让自己和他人都能有所收获!😄 📢GPIO是 General Purpose I/O 的缩写,即通用输入输出端口,简单来说就是MCU/CPU可控制的引脚, 这些引脚通常有多种功能,最基本的是高…

3D点云在线查看利器【LasViewer】

LasViewer是一个免费的3D点云在线查看工具,支持LAS/LAZ格式的3D点云文件在浏览器中的直接渲染。访问地址:LasViewer。 推荐:用 NSDT设计器 快速搭建可编程3D场景。 1、LasViewer快速上手 和BimAnt的其他在线工具一样,LasViewer的…

Windows11使用Cpython 编译文件 报错 error: Unable to find vcvarsall.bat 完美解决方法

开发环境说明: python 3.6.2Vs studio 2017 (已经安装C桌面开发) 我的 vcvarsall.bat 路径为: "D:\vsstudio\VC\Auxiliary\Build\vcvarsall.bat" 一般在Vs studio 的此安装路径下 修改python源代码 修改文件为 python3.6.2\Li…

shell脚本练习题

名为lianxi.txt的文件内容如下: Steve Blenheim:238-923-7366:95 Latham Lane, Easton, PA 83755:11/12/56:20300 Betty Boop:245-836-8357:635 Cutesy Lane, Hollywood, CA 91464:6/23/23:14500 Igor Chevsky:385-375-8395:3567 Populus Place, Caldwell, NJ 2387…

[230516] TPO71 | 2022年托福阅读真题第4/36篇 | Electrical Energy from the Ocean | 11:50

目录 7101 Electrical Energy from the Ocean Paragraph 1 问题1 Paragraph 2 问题2 Paragraph 3 问题3 Paragraph 4 问题4 做错 Paragraph 5 问题5 做错 Paragraph 6 问题6 Paragraph 7 问题7 Paragaph 8 问题8 做错 Paragraph 2 问题9 问题10 7101…

GateWay源码解析

前言 一、GateWay的自动配置 springboot 在引入一个新的组件时&#xff0c;一般都会有对应的XxxAutoConfiguration类来对该组件进行配置&#xff0c;GateWay也不例外&#xff0c;在引入了以下配置后&#xff0c;就会生成对应的GatewayAutoConfiguration自动配置类 <!-- gat…

15.Python Package目录及打包并发布到PyPI

欢迎访问个人网络日志&#x1f339;&#x1f339;知行空间&#x1f339;&#x1f339; 文章目录 0.基本介绍1.__init__.py文件1.1 Regular Package1.2 namespace package 2.Python Package工程2.1 安装及打包并发布到pypi2.2 将Python文件编译成.so 3.包的搜索路径参考资料 0.基…

go test coverage 单测覆盖率

单元测试的最终统计标准就是单测覆盖率&#xff0c;统计单测总体覆盖了多少行代码。一般来说&#xff0c;我们只需要关注增量代码的覆盖率&#xff0c;而非全量代码。增量代码就是本次迭代改动的代码&#xff0c;比如本次迭代改动了100行代码&#xff0c;我们保证单测能覆盖到这…

【Vue工程】007-Scss

【Vue工程】007-Scss 文章目录 【Vue工程】007-Scss一、概述1、CSS 问题三大缺点CSS 预处理器 2、简介3、中文网4、Slogan 二、基本使用1、安装2、配置全局 scss 样式文件3、在 vite.config.ts 配置4、组件中使用5、访问 http://localhost:5173/home 一、概述 1、CSS 问题 参考…

【OJ比赛日历】快周末了,不来一场比赛吗? #05.13-05.19 #14场

CompHub 实时聚合多平台的数据类(Kaggle、天池…)和OJ类(Leetcode、牛客…&#xff09;比赛。本账号同时会推送最新的比赛消息&#xff0c;欢迎关注&#xff01; 更多比赛信息见 CompHub主页 或 点击文末阅读原文 以下信息仅供参考&#xff0c;以比赛官网为准 目录 2023-05-…

AC AP简单组网

AC AP简单组网 1、LSW1交换机配置2、AC1控制器配置3、初步效果查看3.1、查看PC1获取地址情况3.2、查看AP获取地址情况 4、AC1控制器配置组网5、组网成功验收5.1、查看AP的物理地址&#xff08;dis arp)5.2、ensp模拟的拓扑结果5.3、STA链接到AP网络5.3、查看STA地址及连通性 vl…

ChatGPT:讯飞星火认知大模型-科大讯飞

讯飞星火认知大模型 科大讯飞推出的新一代认知智能大模型&#xff0c;拥有跨领域的知识和语言理解能力&#xff0c;能够基于自然对话方式理解与执行任务。从海量数据和大规模知识中持续进化&#xff0c;实现从提出、规划到解决问题的全流程闭环。 进入科大讯飞官网点击注册 …