前后端分离实现博客系统

news/2024/5/19 19:18:54

文章目录

  • 博客系统
    • 前言
    • 1. 前端
      • 1.1 登陆页面
      • 1.2 博客列表页面
      • 1.3 博客详情页面
      • 1.4 博客编辑页面
    • 2. 后端
    • 2.1 项目部署
        • 2.1.1 创建maven项目
        • 2.1.2 引入依赖
        • 2.1.3 创建目录结构
        • 2.1.4 部署程序
    • 2.2 逻辑设计
      • 2.2.1 数据库设计
      • 2.2.2 实体类设计
      • 2.2.3 Dao层设计
        • 2.2.3.1 BlogDao
      • 2.2.4 Dao层设计
      • 2.2.3 接口设计
        • 2.2.3.1 登录接口
        • 2.2.3.2 注销接口
        • 2.2.3.3 作者查询接口
        • 2.2.3.4 博客接口
        • 2.2.3.4 删除博客接口
    • 3. 小结

博客系统

前言

基于servlet+jdbc进行后端开发,设计了一个可以发布博客,查看博客详情,删除博客,登录注销功能的简易博客系统。

1. 前端

1.1 登陆页面

在这里插入图片描述

1.2 博客列表页面

在这里插入图片描述

1.3 博客详情页面

在这里插入图片描述

1.4 博客编辑页面

在这里插入图片描述

2. 后端

2.1 项目部署

2.1.1 创建maven项目

我们在idea里面点击new project创建一个maven项目,然后一路next选择好项目位置以及命名即可。
在这里插入图片描述
在这里插入图片描述

2.1.2 引入依赖

在创建完maven项目之后我们需要加载依赖,部分同学可能由于网络问题难以加载,可以多试几遍,实在不行可以更换国内的镜像下载此处不作多介绍。以下需要引入的依赖主要有:java.servlet-api、mysql-connector-java,以及后续发送json格式的数据需要的jackson依赖(jackson-databind)

我们通过maven仓库官网https://mvnrepository.com/ 即可获取。

如图:复制链接黏贴到我们项目的pom.xml文件
在这里插入图片描述

代码 : 以下是我部署的依赖可以直接复制黏贴

 <dependencies>
<!--        servlet依赖--><!-- https://mvnrepository.com/artifact/javax.servlet/javax.servlet-api --><dependency><groupId>javax.servlet</groupId><artifactId>javax.servlet-api</artifactId><version>3.1.0</version><scope>provided</scope></dependency>
<!--        jackson依赖--><!-- https://mvnrepository.com/artifact/com.fasterxml.jackson.core/jackson-databind --><dependency><groupId>com.fasterxml.jackson.core</groupId><artifactId>jackson-databind</artifactId><version>2.14.2</version></dependency>
<!--        数据库依赖--><!-- https://mvnrepository.com/artifact/mysql/mysql-connector-java --><dependency><groupId>mysql</groupId><artifactId>mysql-connector-java</artifactId><version>5.1.47</version></dependency></dependencies>

2.1.3 创建目录结构

在我们的webapp目录下面创建一个WEB-INF包并创建一个web.xml,此处结构以及名字不能改动。
在这里插入图片描述
web.xml内容:

<!DOCTYPE web-app PUBLIC"-//Sun Microsystems, Inc.//DTD Web Application 2.3//EN""http://java.sun.com/dtd/web-app_2_3.dtd" >
<web-app><display-name>Archetype Created Web Application</display-name>
</web-app>

2.1.4 部署程序

我们在插件市场搜索 Smart Tomcat 插件,将Tomcat集成到idea就不用我们手动打包,之后点击即可运行。
在这里插入图片描述
然后点击新增运行配置,将Smart Tomcat加入,此处选择Tomcat路径,如果还没有下载Tomcat,可以通过官网下载。博主使用的是 3.1版本的servlet+tomcat 8

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

然后就可以点击运行:出现以下结果就是部署成功了。之后我们就可以通过127.0.0.1:8080/MessageWall/xx.html(html页面)访问,其中MessageWall是Context path,一般默认是项目名。

在这里插入图片描述

2.2 逻辑设计

2.2.1 数据库设计

我们博客系统主要有用户登录以及编写博客的功能,基于此需求在当前博客系统中主要涉及两个实体,博客和用户,所以我们需要创建两张表用于存储博客和用户信息

注意:用户与博客之间是一对多的关系;以下设计blog表和user表

  1. blog表包含blogId,title,content,postTime,userId属性;
  2. user表包含userId,userName,password;
  3. 通过userId建立关系,描述用户有哪些博客。

sql代码写到文本文件中用于记录,以便后续在别的机器上部署;
编写封装数据库的连接操作,代码如下:

import com.mysql.jdbc.Connection;
import com.mysql.jdbc.jdbc2.optional.MysqlDataSource;import javax.sql.DataSource;
import java.sql.PreparedStatement;
import java.sql.ResultSet;
import java.sql.SQLException;/*** @author zq*/
public class DBUtil {private static DataSource dataSource = new MysqlDataSource();static {((MysqlDataSource) dataSource).setUrl("jdbc:mysql://127.0.0.1:3306/blog_system?characterEncoding=utf8&useSSL=false");((MysqlDataSource) dataSource).setUser("root");((MysqlDataSource) dataSource).setPassword("123456");}public static Connection getConnection() throws SQLException {return (Connection) dataSource.getConnection();}public static void close(Connection connection, PreparedStatement preparedStatement, ResultSet resultSet){if (resultSet!=null){try {resultSet.close();} catch (SQLException e) {e.printStackTrace();}}if (preparedStatement!=null){try {preparedStatement.close();} catch (SQLException e) {e.printStackTrace();}}if (connection!=null){try {connection.close();} catch (SQLException e) {e.printStackTrace();}}}
}

2.2.2 实体类设计

根据我们用户表和博客表设计两个对应的实体类如下:

user类:

package model;/*** @author zq*/
public class User {private String username;private String password;private int userId;public String getUsername() {return username;}public void setUsername(String username) {this.username = username;}public String getPassword() {return password;}public void setPassword(String password) {this.password = password;}public int getUserId() {return userId;}public void setUserId(int userId) {this.userId = userId;}
}

blog类:

package model;import java.sql.Timestamp;
import java.text.SimpleDateFormat;/*** @author zq*/
public class Blog {private int blogId;private String title;private String content;private Timestamp postTime;private int userId;public int getBlogId() {return blogId;}public void setBlogId(int blogId) {this.blogId = blogId;}public String getTitle() {return title;}public void setTitle(String title) {this.title = title;}public String getContent() {return content;}public void setContent(String content) {this.content = content;}public String getPostTime() {SimpleDateFormat simpleDateFormat = new SimpleDateFormat("yyyy-MM-dd hh:mm:ss");return simpleDateFormat.format(postTime);}public Timestamp getPostTimestamp(){return postTime;}public void setPostTime(Timestamp postTime) {this.postTime = postTime;}public int getUserId() {return userId;}public void setUserId(int userId) {this.userId = userId;}
}

2.2.3 Dao层设计

封装数据库的增删改查,针对博客表创建BlogDao,针对用户表创建UserDao并且提供对应的增删改查方法。

2.2.3.1 BlogDao

针对本项目我们需要的功能有发布博客,也就是在博客表新增一条数据;显示博客详情即根据博客id查询博客内容;删除博客即根据博客id删除博客;博客列表页即查询该用户发布的所有博客;
具体实现如下:

package model;import com.mysql.jdbc.Connection;
import model.Blog;
import model.DBUtil;import java.sql.PreparedStatement;
import java.sql.ResultSet;
import java.sql.SQLException;
import java.util.ArrayList;
import java.util.List;/*** @author zq*/
//针对博客表提供的基本操作,此处暂时不考虑修改
public class BlogDao {//1。新增一个博客public void add(Blog blog)  {//1.先于数据库建立连接、Connection connection = null;PreparedStatement preparedStatement = null;try {connection = DBUtil.getConnection();//2.构造sql1语句String sql = "insert into blog values(null,?,?,now(),?)";preparedStatement = connection.prepareStatement(sql);preparedStatement.setString(1, blog.getTitle());preparedStatement.setString(2, blog.getContent());// preparedStatement.setTimestamp(3,blog.getPostTimestamp());preparedStatement.setInt(3,blog.getUserId());//3.执行sqlpreparedStatement.executeUpdate();} catch (SQLException e) {e.printStackTrace();}finally {DBUtil.close(connection,preparedStatement,null);}}//2.根据博客id查询指定博客,也就是页面的显示全文public Blog selectById(int blogId){Connection connection =null;PreparedStatement statement = null;ResultSet resultSet = null;try {//1.建立连接connection = DBUtil.getConnection();//2.构造sql语句String sql = "select * from blog where blogId = ?";statement = connection.prepareStatement(sql);statement.setInt(1,blogId);//3.执行sql语句resultSet = statement.executeQuery();//由于主键具有唯一性所以如果查到数据那么就只有一条//所以不需要用while遍历所有结果,判断是否有一条就行if (resultSet.next()){Blog blog = new Blog();blog.setBlogId(resultSet.getInt("blogId"));blog.setContent(resultSet.getString("content"));blog.setTitle(resultSet.getString("title"));blog.setUserId(resultSet.getInt("userId"));blog.setPostTime(resultSet.getTimestamp("postTime"));return blog;}}catch (SQLException throwables){throwables.printStackTrace();}finally {DBUtil.close(connection,statement,resultSet);}return null;}//3.直接查询数据库所有的博客列表(博客列表页)public List<Blog> selectAll(){Connection connection = null;PreparedStatement statement = null;ResultSet resultSet = null;List<Blog> blogs = new ArrayList<>();try{//建立链接connection = DBUtil.getConnection();//构造sql语句String sql = "select * from blog order by postTime desc";statement = connection.prepareStatement(sql);//执行sqlresultSet = statement.executeQuery();while (resultSet.next()){Blog blog = new Blog();blog.setBlogId(resultSet.getInt("blogId"));//注意这里的正文内容在博客列表页,不需要全部显示出来String content = resultSet.getString("content");if (content.length()>=100){content = content.substring(0,100)+"....";}blog.setContent(content);blog.setTitle(resultSet.getString("title"));blog.setUserId(resultSet.getInt("userId"));blog.setPostTime(resultSet.getTimestamp("postTime"));blogs.add(blog);}}catch (SQLException throwables){throwables.printStackTrace();}finally {DBUtil.close(connection,statement,resultSet);}return blogs;}//4.实现删除指定博客public void delete(int blogId){Connection connection = null;PreparedStatement statement = null;try{//建立链接connection = DBUtil.getConnection();//构造sql语句String sql = "delete from blog where blogId =?";statement = connection.prepareStatement(sql);statement.setInt(1,blogId);//执行sqlstatement.executeUpdate();}catch (SQLException throwables){throwables.printStackTrace();}finally {DBUtil.close(connection,statement,null);}}
}

2.2.4 Dao层设计

本项目在设计用户表的主要功能,登录需要验证用户名与密码即根据用户名查询用户信息;主页右侧显示的用户信息即根据用户id查询用户信息;

具体实现:

package model;import com.mysql.jdbc.Connection;
import model.DBUtil;import java.sql.PreparedStatement;
import java.sql.ResultSet;
import java.sql.SQLException;/*** @author zq*/
//针对用户表提供的基本操作,由于没有写注册功能所以就不写add,
// 也没有注销功能,所以也不写delete
public class UserDao {//1.根据userID查询用户信息public User selecetById(int userId){Connection connection = null;PreparedStatement statement = null;ResultSet resultSet = null;try{connection = DBUtil.getConnection();String sql = "select * from user where userId = ?";statement = connection.prepareStatement(sql);statement.setInt(1,userId);resultSet = statement.executeQuery();if (resultSet.next()){User user = new User();user.setUserId(resultSet.getInt("userId"));user.setUsername(resultSet.getString("username"));user.setPassword(resultSet.getString("password"));return user;}}catch (SQLException throwables){throwables.printStackTrace();}finally {DBUtil.close(connection,statement,resultSet);}return null;}//2.根据用户名查询用户信息public User selectByUsername(String username){Connection connection = null;PreparedStatement statement = null;ResultSet resultSet = null;try{connection = DBUtil.getConnection();String sql = "select * from user where username = ?";statement = connection.prepareStatement(sql);statement.setString(1,username);resultSet = statement.executeQuery();if (resultSet.next()){User user = new User();user.setUserId(resultSet.getInt("userId"));user.setUsername(resultSet.getString("username"));user.setPassword(resultSet.getString("password"));return user;}}catch (SQLException throwables){throwables.printStackTrace();}finally {DBUtil.close(connection,statement,resultSet);}return null;}}

2.2.3 接口设计

在前后端进行数据交互时我们约定以json格式进行数据传输,前端通过ajax向后端发送请求。

2.2.3.1 登录接口

创建一个LoginServlet类继承HttpServlet类,重写doPost()方法实现对用户密码的校验,重写doGet()方法进行用户是否登录校验,只有登录了的用户才能进行博客编辑。
具体实现如下:

package api;import com.fasterxml.jackson.databind.ObjectMapper;
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 javax.servlet.http.HttpSession;
import java.io.IOException;/*** @author zq*/@WebServlet("/login")
public class LoginServlet extends HttpServlet {private ObjectMapper objectMapper = new ObjectMapper();@Overrideprotected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {//1.读取用户名和密码,由于是form表单格式所以不用jackson的类进行读取//注意如果此处的用户名密码如果包含中文会乱码,所以要设置字符集req.setCharacterEncoding("utf8");resp.setContentType("text/html; charset=utf8");String username = req.getParameter("username");String password = req.getParameter("password");if (username==null||"".equals(username)||password==null||"".equals(password)){//登录失败String html = "<h3> 登陆失败username或者password错误 </h3>" ;resp.getWriter().write(html);return;}//2.读取数据库看用户名是否存在,密码是否匹配UserDao userDao = new UserDao();User user = userDao.selectByUsername(username);if (user==null){//用户不存在String html = "<h3> 用户名或密码错误 </h3>" ;resp.getWriter().write(html);return;}if (!password.equals(user.getPassword())){String html = "<h3> 用户名或密码错误 </h3>" ;resp.getWriter().write(html);return;}//3.验证通过,接下来创建会话,使用会话保存用户信息HttpSession session = req.getSession(true);session.setAttribute("user",user);//4.进行重定向到博客列表页resp.sendRedirect("blog_list.html");}@Overrideprotected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {resp.setContentType("application/json;charset=utf8");//获取用户的登录状态,如果用户未登录当前会话就拿不到HttpSession session = req.getSession(false);if (session==null){//未登录,返回一个user对象User user = new User();String respJson = objectMapper.writeValueAsString(user);resp.getWriter().write(respJson);return;}//登录了取出user对象User user = (User) session.getAttribute("user");if (user==null){//一般不会为空user = new User();String respJson = objectMapper.writeValueAsString(user);resp.getWriter().write(respJson);return;}//成功取出user对象,直接返回String respjson = objectMapper.writeValueAsString(user);resp.getWriter().write(respjson);}
}

2.2.3.2 注销接口

创建一个LogoutServlet类继承HttpServlet类,重写doGet()方法直接将session中的该用户移除,去除该用户缓存如何自动跳转到登录页面。
具体实现如下:

package api;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.io.IOException;/*** @author zq*/
@WebServlet("/logout")
public class LogoutServlet extends HttpServlet {@Overrideprotected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {HttpSession httpSession = req.getSession(false);if (httpSession==null){//未登录状态,直接提示出错resp.setContentType("text/html;charset=utf8");resp.getWriter().write("当前未登录");}//然后直接romovehttpSession.removeAttribute("user");//然后跳转到登录页面resp.sendRedirect("blog_login.html");}
}

2.2.3.3 作者查询接口

创建一个AuthorServlet类继承HttpServlet类,重写doGet()方法实现通过前端传输的用户id获取用户信息。
具体实现如下:

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;/*** @author zq*/
@WebServlet("/author")
public class AuthorServlet extends HttpServlet {private ObjectMapper objectMapper;@Overrideprotected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {//博客详情页根据博客id获取用户,由于是queryString所以getParameter就能拿到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);}UserDao userDao = new UserDao();User author = userDao.selecetById(blog.getUserId());String respJson = objectMapper.writeValueAsString(author);resp.setContentType("application/json;charset=utf8");resp.getWriter().write(respJson);}
}

2.2.3.4 博客接口

创建一个BlogServlet类继承HttpServlet类,重写doGet()方法实现通过判断博客id是否存在确定获取所有博客还是博客详情,重写Post()方法实现博客发布功能。
具体实现如下:

package api;import com.fasterxml.jackson.databind.ObjectMapper;
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.io.IOException;
import java.util.List;/*** @author zq*/
//实现前后端交互的代码@WebServlet("/blog")
public class BlogServlet extends HttpServlet {private ObjectMapper objectMapper = new ObjectMapper();//加载页面时显示所有博客查询数据库@Overrideprotected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {BlogDao blogDao = new BlogDao();//尝试获取一下queryString中的blogId字段String blogId = req.getParameter("blogId");if (blogId==null){//说明本次获取的是列表页List<Blog> blogs =  blogDao.selectAll();//将blogs转成符合要求的json格式字符串String respJson = objectMapper.writeValueAsString(blogs);resp.setContentType("application/json;charset=utf8");resp.getWriter().write(respJson);}else {//存在,说明此处获取的是博客内容页//根据id查询博客Blog blog = blogDao.selectById(Integer.parseInt(blogId));//可能存在博客Id不存在的情况if(blog==null){System.out.println("当前blogId=" +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 {//读取请求,构造blog对象,插入数据库1即可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;}//在登录状态时,就拿到作者//获取博客正文和标题,此时需要指定字符集,然后通过指定的字符集插入数据库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 blog = new Blog();blog.setContent(content);blog.setTitle(title);blog.setUserId(user.getUserId());BlogDao blogDao = new BlogDao();blogDao.add(blog);//blog里面的新增博客方法//跳转到博客列表页resp.sendRedirect("blog_list.html");}
}

2.2.3.4 删除博客接口

创建一个delBlogServlet类继承HttpServlet类,重写doGet()方法实现通过判断用户是否是登录并且用户是否是博客作者,确定是否能够删除博客。
具体实现如下:

package api;import com.fasterxml.jackson.databind.ObjectMapper;
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.io.IOException;
import java.util.List;/*** @author zq*/
@WebServlet("/delBlog")
public class delBlogServlet extends HttpServlet {//private ObjectMapper objectMapper;@Overrideprotected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {//1.首先判断是否登录HttpSession session = req.getSession(false);if (session==null){resp.setStatus(403);resp.setContentType("text/html;charset=utf-8");resp.getWriter().write("当前未登录请登录");return;}//获取到当前用户User user = (User) session.getAttribute("user");//2.判断用户是否为空if (user==null){resp.setStatus(403);resp.setContentType("text/html;charset=utf-8");resp.getWriter().write("当前未登录请登录");return;}BlogDao blogDao = new BlogDao();//3.尝试获取一下queryString中的blogId字段,判断博客是否存在String blogId = req.getParameter("blogId");//查询到博客对象Blog blog = blogDao.selectById(Integer.parseInt(blogId));if (blogId==null){resp.setStatus(404);resp.setContentType("text/html;charset=utf8");resp.getWriter().write("博客数据不存在");return;}//4.判断登录用户是否是作者if (blog.getUserId()!= user.getUserId()){resp.setStatus(403);resp.setContentType("text/html;charset=utf-8");resp.getWriter().write("当前不能删除别人的博客");return;}//根据博客Id删除博客blogDao.delete(Integer.parseInt(blogId));resp.sendRedirect("blog_list.html");}
}

3. 小结

本项目可以在我的gitee上查看源码,后续会通过SSM框架重新实现并完善博客系统功能。https://gitee.com/zxxqqa/blog_system


http://www.mrgr.cn/p/36882516

相关文章

为公网SSH远程Ubuntu配置固定的公网TCP端口地址主图

文章目录 为公网SSH远程Ubuntu配置固定的公网TCP端口地址 为公网SSH远程Ubuntu配置固定的公网TCP端口地址 在上篇文章中&#xff0c;我们通过cpolar建立的临时TCP数据隧道&#xff0c;成功连接了位于其他局域网下的Ubuntu系统&#xff0c;实现了不同操作系统、不同网络下的系统…

【MIPI协议 D-PHY基础介绍】

MIPI协议 D-PHY基础介绍 前言一、MIPI介绍1.1 D-PHY MIPI 简单介绍1.2 C-PHY MIPI 简单介绍1.3 M-PHY MIPI 简单介绍 二、D-PHY具体介绍2.1 DSI分层结构2.2 D-PHY电气特性介绍2.3 D-PHY 工作模 三、LINE线上的模式3.1 line线上 state code3.2 high speed data line传输3.3 Low …

性能优化 - 前端性能监控和性能指标计算方式

性能优化 - 前端性能监控和性能指标计算方式 前言一. 性能指标介绍1.1 单一指标介绍1.2 指标计算① Redirect(重定向耗时)② AppCache(应用程序缓存的DNS解析)③ DNS(DNS解析耗时)④ TCP(TCP连接耗时)⑤ TTFB(请求响应耗时)⑥ Trans(内容传输耗时)⑦ DOM(DOM解析耗时) 1.3 FP(f…

React之生命周期

React之生命周期 旧版本&#xff0c;函数组件是没有生命周期的。新版本中通过useEffect触发函数的生命周期 一、基于类组件的生命周期 React的组件生命周期分为挂载阶段、更新阶段和销毁阶段。因为React的state不具有Vue的响应式&#xff0c;所以并没有create阶段 1、挂载阶段&…

小研究 - 一种复杂微服务系统异常行为分析与定位算法(一)

针对极端学生化偏差&#xff08;&#xff25;&#xff58;&#xff54;&#xff52;&#xff45;&#xff4d;&#xff45; &#xff33;&#xff54;&#xff55;&#xff44;&#xff45;&#xff4e;&#xff54;&#xff49;&#xff5a;&#xff45;&#xff44; &#…

stable diffusion

一&#xff1a;安装。 stable diffusion 安装和使用全教程 - 知乎 Stable Diffusion安装 - 知乎 环境安装&#xff1a; 1&#xff1a;python 3.10安装。 Download Python | Python.org 切记要安装3.10版本&#xff0c;因为Stable diffusion是用3.10版本编写的&#xff0c;所…

【使用时空RBF-NN进行非线性系统识别】实现了 RBF、分数 RBF 和时空 RBF 神经网络,用于非线性系统识别研究(Matlab代码实现)

&#x1f4a5;&#x1f4a5;&#x1f49e;&#x1f49e;欢迎来到本博客❤️❤️&#x1f4a5;&#x1f4a5; &#x1f3c6;博主优势&#xff1a;&#x1f31e;&#x1f31e;&#x1f31e;博客内容尽量做到思维缜密&#xff0c;逻辑清晰&#xff0c;为了方便读者。 ⛳️座右铭&a…

TDesign中后台管理系统-访问后端服务

目录 1 修改后端服务地址2 解决跨域问题3 动态获取菜单4 测试后端接口5 前后端联调总结 目前我们已经搭建了TDesign的前端和express的后端&#xff0c;目前是两个独立的应用。通常我们需要把前后端集成在一起&#xff0c;TDesign已经配置了相关的信息&#xff0c;只需要修改后端…

c++ | 动态链接库 | 小结

//环境 linux c //生成动态链接库 //然后调用动态链接库中的函数//出现的问题以及解决//注意在win和在linux中调用动态链接库的函数是不一样的//在要生成链接库的cpp文件中比如以后要调用本文件中的某个函数&#xff0c;需要extern "c" 把你定的函数“再封装”避免重…

入门Linux基本指令(2)

这篇文章主要提供一些对文件操作的Linux基本指令&#xff0c;希望对大家有所帮助&#xff0c;三连支持&#xff01; 目录 cp指令(复制) mv指令(剪切) nano指令 cat指令(打印文件内容) > 输出重定向 >> 追加重定向 < 输入重定向 more指令 less指令(推荐) …

弗洛伊德(Floyd)算法详解

Floyd 算法是解决图论问题的比较经典的算法&#xff0c;用来求解赋权图中每对顶点间的最短距离。当然&#xff0c;在求距离的过程中也可以得到最短距离的路径。这个算法与迪杰斯特拉&#xff08;Dijkstra)算法相似&#xff0c;他们两个都属于最短路算法&#xff0c;只是Dijkstr…

RS485/RS232自由转ETHERNET/IP网关profinet和ethernet区别

你是否曾经遇到过这样的问题&#xff1a;如何将ETHERNET/IP网络和RS485/RS232总线连接起来呢&#xff1f;捷米的JM-EIP-RS485/232通讯网关&#xff0c;自主研发的ETHERNET/IP从站功能&#xff0c;完美解决了这个难题。这款网关不仅可以将ETHERNET/IP网络和RS485/RS232总线连接起…

Docker中的网络

文章目录 网络网桥&#xff08;bridge&#xff09;创建网桥接口hostnonecontaineroverlayoverlay底层原理 网络 网桥&#xff08;bridge&#xff09; 在Docker中&#xff0c;网桥&#xff08;Bridge&#xff09;是一种网络驱动&#xff0c;用于实现Docker容器之间和容器与宿主…

[Java] 单例设计模式详解

模式定义&#xff1a;保证一个类只有一个实例&#xff0c;并且提供一个全局访问点&#xff0c;时一种创建型模式 使用场景&#xff1a;重量级的对象&#xff0c;不需要多个实例&#xff0c;如线程池&#xff0c;数据库连接池 单例设计模式的实现 1.懒汉模式&#xff1a;延迟…

基于Docker-compose创建LNMP环境并运行Wordpress网站平台

基于Docker-compose创建LNMP环境并运行Wordpress网站平台 1.Docker-Compose概述2.YAML文件格式及编写注意事项3.Docker-Compose配置常用字段4.Docker Compose常用命令5.使用Docker-compose创建LNMP环境&#xff0c;并运行Wordpress网站平台1. Docker Compose 环境安装下载安装查…

React井字棋游戏官方示例

在本篇技术博客中&#xff0c;我们将介绍一个React官方示例&#xff1a;井字棋游戏。我们将逐步讲解代码实现&#xff0c;包括游戏的组件结构、状态管理、胜者判定以及历史记录功能。让我们一起开始吧&#xff01; 项目概览 在这个井字棋游戏中&#xff0c;我们有以下组件&am…

三十三章 uboot使用(universal boot loader)

Linux 系统要启动就必须需要一个 bootloader 程序&#xff0c;也就说芯片上电以后先运行一段bootloader 程序。这段bootloader程序会先初始化DDR等外设&#xff0c;然后将Linux内核从flash(NAND&#xff0c;NORFLASH&#xff0c;SD&#xff0c; MMC 等)拷贝到 DDR 中&#xff0…

【蓝图】p40-p43对象引用、变量有效性、实现键盘控制物体自转、简单点名系统

p40-p43对象引用、变量有效性、实现键盘控制物体自转、简单点名系统 p40对象引用、变量有效性p41实现键盘控制物体自转创建bool值控制旋转实现通过键盘控制自转 p42p43简单点名系统Get All Actors Of Class&#xff08;获得场景中所有该类的actor演员&#xff09;getFor Each L…

linux网络编程--select多路IO转接模型

学习目录 熟练掌握TCP状态转换图熟练掌握端口复用的方法了解半关闭的概念和实现方式了解多路IO转接模型熟练掌握select函数的使用熟练使用fd_set相关函数的使用能够编写select多路IO转接模型的代码 1.TCP状态转换图 了解TCP状态转换图可以帮助开发人员查找问题. 说明: 上图中…

接口自动化测试平台

下载了大神的EasyTest项目demo修改了下<https://testerhome.com/topics/12648 原地址>。也有看另一位大神的HttpRunnerManager<https://github.com/HttpRunner/HttpRunnerManager 原地址>&#xff0c;由于水平有限&#xff0c;感觉有点复杂~~~ 【整整200集】超超超…