表白墙（服务器）

news2024/11/20 3:23:48

目录

0.需求

1.创建Maven项目

2.给pom.xml内引入三个依赖

3.完善目录，并补充web.xml中的内容

4.编写代码

后端代码

​编辑前端代码

5.引入数据库

创建message表

创建工具类 

往MessageServlet类中添加方法

0.需求

前面写好了表白墙页面，但存在问题：

1.刷新/重开页面，之前输入的数据会消失

2.只能在本机输入和看见，其他机器看不见

解决思路：让服务器存储用户提交的数据，由服务器保存。有新的浏览器打开页面的时候，从服务器获取数据（服务器存档和读档）

前后端交互：

1.点击提交，浏览器把表白信息发到服务器

2.页面加载，浏览器从服务器获取到表白信息

存档和读档：

存档：每次点击提交按钮，触发一次存档操作，把用户输入的内容存储到服务器（存一条）

读档：每次加载页面/刷新页面，触发一次读档操作，把之前服务器上存储的所有记录展示到当前页面中（读所有）

1.创建Maven项目

2.给pom.xml内引入三个依赖

<dependencies>
        <!-- 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>

        <!-- https://mvnrepository.com/artifact/com.fasterxml.jackson.core/jackson-databind -->
        <dependency>
            <groupId>com.fasterxml.jackson.core</groupId>
            <artifactId>jackson-databind</artifactId>
            <version>2.14.3</version>
        </dependency>

        <!-- https://mvnrepository.com/artifact/mysql/mysql-connector-java -->
        <dependency>
            <groupId>mysql</groupId>
            <artifactId>mysql-connector-java</artifactId>
            <version>5.1.49</version>
        </dependency>


    </dependencies>

3.完善目录，并补充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>

4.编写代码

读取的数据和响应的数据都是json格式，对应着：

objectMapper.readValue和objectMapper.writeValue方法完成转换

Post方法把message存到List中，Get方法把L响应到服务器中。

objectMapper.readValue把Json格式的message转换成Java对象，objectMapper.writeValue把List中的Java对象转换成Json格式的字符串。

这是一个演示json的转换的代码

import com.fasterxml.jackson.core.JsonProcessingException;
import com.fasterxml.jackson.databind.ObjectMapper;

class Student{
    public int classId;
    public int studentId;
}
//对Json的使用的举例
public class TestJackson {
    public static void main(String[] args) throws JsonProcessingException {
        ObjectMapper objectMapper=new ObjectMapper();
        //readValue是把Jackson对象转换成Java对象
        String s="{\"classId\":10,\"studentId\":20}";
        //readValue的第一个参数可以直接填一个String，也可以写InputStream
        Student student=objectMapper.readValue(s,Student.class);
        System.out.println(student.studentId);
        System.out.println(student.classId);

        System.out.println();

        //writeValue/writeValueAsString是把Java对象转换成json字符串
        Student student1 = new Student();
        student1.classId=10;
        student1.studentId=20;
        String s1=objectMapper.writeValueAsString(student1);
        System.out.println(s1);
    }
}

后端代码

在表白墙后端中所对应的代码：

import com.fasterxml.jackson.databind.ObjectMapper;

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;
import java.util.ArrayList;
import java.util.List;

class Message{
    public String from;
    public String to;
    public String message;
}

@WebServlet("/message")
public class MessageServlet extends HttpServlet {
    //使用list变量保存所有消息
    private List<Message> messageList=new ArrayList<>();
    private ObjectMapper objectMapper=new ObjectMapper();

    //向服务器提交数据
    @Override
    protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
        //把body里的内容解析出来，成为一个message对象
        Message message=objectMapper.readValue(req.getInputStream(),Message.class);
        //保存
        messageList.add(message);
        //状态码可以省略，默认是200
        resp.setStatus(200);
    }
    //从服务器获取数据
    @Override
    protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
        //告诉浏览器，数据是json格式，字符集是utf8
        resp.setContentType("application/json;charset=utf8");
        //把Java对象转成json字符串和把字符串写到响应对象中
        objectMapper.writeValue(resp.getWriter(),messageList);
    }
}

用postman进行post和get进行操作查看上述代码实现：

前端代码

Post是点击提交按钮的时候发起的，Get是页面加载的时候发起的。

对之前写好的前端页面代码进行补充

1.引入jQuery

2.对提交按钮中添加：给服务器发起post请求，把上述数据提交到服务器

通过Ajax构造：

上述存档流程：

读档

让浏览器ajax发送get请求

读档前后端交互过程

当前数据是在内存中保存的，重启服务器就没有了，要想持久化保存，就要写入到文件中（硬盘）

1.直接使用流对象写入文本文件

2.借助数据库

创建数据表

此处只有一个表 message（from，to,message)

5.引入数据库

创建message表

在MySQL中创建表message(from,to,message)

在创建时，由于from和to是MySQL中的关键字，需要加上反引号 (`)（键盘上Tab键上方）

创建工具类 

对数据库连接和关闭资源的工具类

import com.mysql.jdbc.jdbc2.optional.MysqlDataSource;

import javax.sql.DataSource;
import java.sql.Connection;
import java.sql.PreparedStatement;
import java.sql.ResultSet;
import java.sql.SQLException;

//通过这个类把数据库连接过程封装
//把这个类作为一个工具类，提供static方法供其他代码调用
public class DBUtil {
    //静态成员跟随类对象，类对象在整个进程中只有一份
    //静态成员也相当于唯一的实例（单例模式，饿汉模式）
    private static DataSource dataSource =new MysqlDataSource();

    static {
        //使用静态代码块，针对dataSource进行初始化操作
        ((MysqlDataSource)dataSource).setUrl("jdbc://127.0.0.1:3306/java106?characterEncoding=utf8&useSSL=false");
        ((MysqlDataSource)dataSource).setUser("root");
        ((MysqlDataSource)dataSource).setPassword("318318");
    }
    //通过这个方法来建立连接
    public static Connection getConnection() throws SQLException {
      return dataSource.getConnection();
    }
    //通过这个方法断开连接，释放资源
    public static void close(Connection connection, PreparedStatement statement, ResultSet resultSet){
        if(resultSet!=null){
            try {
                resultSet.close();
            }catch (SQLException e){
                e.printStackTrace();
            }
        }
        if(statement!=null){
            try {
                statement.close();
            } catch (SQLException e) {
                e.printStackTrace();
            }
        }
        if(connection!=null){
            try {
                connection.close();
            } catch (SQLException e) {
                e.printStackTrace();
            }
        }
    }
}

往MessageServlet类中添加方法

save（）：往数据库中存一条消息

load（）：从数据库获取所有消息

 //往数据库中存一条消息
    private void save(Message message){
        //JDBC操作
        Connection connection=null;
        PreparedStatement statement= null;
        //1.建立连接
        try {

            //2.构造SQL语句
            String sql="insert into message values(?,?,?)";

            statement.setString(1,message.from);
            statement.setString(2,message.to);
            statement.setString(3,message.message);
            //3.执行sql
            statement.executeUpdate();
        } catch (SQLException e) {
            e.printStackTrace();
        }finally {
            //4.关闭连接
            DBUtil.close(connection,statement,null);
        }
    }

    //从数据库获取所有消息
    private List<Message> load(){
        List<Message> messageList=new ArrayList<>();
        Connection connection=null;
        PreparedStatement statement=null;
        ResultSet resultSet=null;
       try {
           //1.和数据库建立连接
           connection=DBUtil.getConnection();
           //2.构造SQL
           String sql="select * from message";
           statement= connection.prepareStatement(sql);
           //3.执行sql
           resultSet=statement.executeQuery();
           //4.遍历结果集合
           while(resultSet.next()){
               Message message=new Message();
               message.from=resultSet.getNString("from");
               message.to= resultSet.getNString("to");
               message.message=resultSet.getNString("message");
               messageList.add(message);
           }
           return messageList;
       }catch (SQLException e){
          e.printStackTrace();
       }finally {
           //5.释放资源，断开连接
           DBUtil.close(connection,statement,resultSet);
       }
       return messageList;
    }
}

此时在页面输入的数据将会保存在数据库中。

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

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

相关文章

视阅口译有何特点，哪里提供视阅口译翻译？

视阅口译有何特点，哪里提供视阅口译翻译？

据了解&#xff0c;视阅口译是一种涉及视听和口头表达的翻译方式&#xff0c;它在跨文化交流等领域中起到了非常重要的作用。那么&#xff0c;视阅口译有何特点&#xff0c;哪里提供专业的视阅口译服务&#xff1f; 我们知道&#xff0c;视阅口译就是基于事先准备好的讲稿或文…
阅读更多...
“构建高效的Java Web开发环境及前后端分离后台接口部署“

“构建高效的Java Web开发环境及前后端分离后台接口部署“

目录 引言一、安装环境&#xff1a;JDK和Tomcat1. 安装JDK下载jdk配置环境变量2. 安装Tomcat 二、安装MySQL三、部署前后端分离后台接口总结 引言 在现代软件开发中&#xff0c;构建高效的开发环境和部署稳定的后台接口是至关重要的。本文将介绍如何安装和配置Java开发环境&am…
阅读更多...
一文2000字使用JMeter进行接口测试教程！（建议收藏）

一文2000字使用JMeter进行接口测试教程！（建议收藏）

安装 使用JMeter的前提需要安装JDK&#xff0c;需要JDK1.7以上版本目前在用的是JMeter5.2版本&#xff0c;大家可自行下载解压使用 运行 进入解压路径如E: \apache-jmeter-5.2\bin&#xff0c;双击jmeter.bat启动运行 启动后默认为英文版本&#xff0c;可通过Options – Cho…
阅读更多...
Day10 驱动

Day10 驱动

阅读更多...
【王道代码】【3 栈和队列】

【王道代码】【3 栈和队列】

结构体定义&#xff1a; 队列操作&#xff1a;
阅读更多...
DevExpress(GridControl基础样式)

DevExpress(GridControl基础样式)

1.设置GridControl底部导航器可见 this.gridControl1.UseEmbeddedNavigator true; 2.隐藏嵌入式导航器的追加按钮&#xff0c;所有导航器的操作可以自行查阅API this.gridControl1.EmbeddedNavigator.Buttons.Append.Visible false; 3.去掉第一列前的空白列&#xff0c;去掉…
阅读更多...
学历不好，背景不强？想进入互联网行业难道真的没希望？

学历不好，背景不强？想进入互联网行业难道真的没希望？

随着互联网的大环境越来越好&#xff0c;各个企业又有了新一轮的招聘需求&#xff0c;但是大家会发现企业招人要求出奇的一致&#xff1a;学信网可查、本科及以上学历&#xff01;虽然越来越多的人希望能够进入这个行业&#xff0c;但是有些人可能会因为学历不好或者背景不强而…
阅读更多...
C++基础算法④——排序算法(快速、归并附完整代码)

C++基础算法④——排序算法(快速、归并附完整代码)

快速排序 快速排序是对冒泡排序的一种改进。 它的基本思想是:通过一趟排序将待排记录分割成独立的两部分&#xff0c;其中一部分记录的关键字均比另一部分记录的关键字小&#xff0c;则可分别对这两部分记录继续进行快速排序&#xff0c;以达到整个序列有序。 假设我们现在对 …
阅读更多...
JVM 类加载的过程

JVM 类加载的过程

JVM 类加载的过程 加载验证准备解析初始化 加载 “加载”&#xff08;Loading&#xff09;阶段是整个“类加载”&#xff08;Class Loading&#xff09;过程中的一个阶段&#xff0c;它和类加载 Class Loading 是不同的&#xff0c;一个是加载 Loading 另一个是类加载 Class L…
阅读更多...
重磅消息！优维发布全新产品“应急管理”

重磅消息！优维发布全新产品“应急管理”

近日&#xff0c;蚂蚁集团旗下的在线文档编辑与协同工具语雀平台发生了一次严重的宕机事件&#xff0c;导致用户无法正常使用其各项功能。从故障发生到完全恢复正常&#xff0c;语雀整个宕机时间将近 8 小时&#xff0c;如此长时间的宕机已经达到了 P0 级事故&#xff0c;并在网…
阅读更多...
PCL setCameraPosition 参数讲解

PCL setCameraPosition 参数讲解

setCameraPosition 的原型如下void setCameraPosition (double pos_x, double pos_y, double pos_z,double view_x, double view_y, double view_z,double up_x, double up_y, double up_z, int viewport 0);pos_x pos_y pos_z为相机所在的位置view_x view_y view_z 是焦点所…
阅读更多...
如何通过会员营销数字化推动精准营销与用户忠诚度培养？

如何通过会员营销数字化推动精准营销与用户忠诚度培养？

营销策略的制定和实施对于企业的成功至关重要&#xff0c;而会员数字化营销系统将通过用户画像、会员标签等重要功能&#xff0c;推动企业提高用户忠诚度培养。目前市面上有哪些热门的会员营销功能&#xff1f; 一、用户画像&#xff1a;让营销更精准 用户画像是一种通过收集和…
阅读更多...
TensorFlow案例学习：简单的音频识别

TensorFlow案例学习：简单的音频识别

前言 以下内容均来源于官方教程&#xff1a;简单的音频识别&#xff1a;识别关键字 音频识别 下载数据集 下载地址&#xff1a;http://storage.googleapis.com/download.tensorflow.org/data/mini_speech_commands.zip 可以直接浏览器访问下载。 下载完成后将其解压到项目…
阅读更多...
uniapp使用z-paging插件下拉刷新

uniapp使用z-paging插件下拉刷新

z-paging插件地址传送门 z-paging官网说明传送门 一、uniapp使用z-paging插件下拉刷新 1.导入插件 2.粘贴ui结构 <z-paging ref="paging" v-model="dataList"
阅读更多...
【嵌入式】【GIT】如何迁移老的GIF到新的仓库时使用LFS功能并保持LOG不变

【嵌入式】【GIT】如何迁移老的GIF到新的仓库时使用LFS功能并保持LOG不变

一、正常迁移流程 假设有仓库 ssh://old/buildroot-201902 需要迁移到新的仓库 ssh://old/buildroot-201902时，我们可以使用以下命令来完成： # 下载老的仓库 git clone ssh://old/buildroot-201902 # 向新的仓库上传所有的tags git push ssh://new/buildroot-201902 --tag…
阅读更多...
三款公认简单好用的文字转语音工具

三款公认简单好用的文字转语音工具

分享3款好用的文字转语音软件&#xff0c;操作简单&#xff0c;主播声音丰富&#xff0c;转换出来的语音能够接近于人声&#xff0c;非常自然&#xff01; 1、TTSMAKER 一款文字转语音在线工具&#xff0c;不需要注册登录&#xff0c;打开就能使用&#xff0c;支持多种语言的语…
阅读更多...
【OpenVAS】一个快速、简洁的 OpenVAS 扫描解决方案

【OpenVAS】一个快速、简洁的 OpenVAS 扫描解决方案

一. OpenVAS简介&#xff1a; 官网&#xff1a;http://www.openvas.org/ OpenVas是一个功能齐全的开源的漏洞扫描工具。它具有无身份验证和身份验证测试的功能&#xff0c;支持各种高级和低级互联网和工业协议&#xff0c;能够进行大规模扫描的性能调优&#xff0c;还提供强大…
阅读更多...
vue2：路由前置守卫无法获取到this.$store.state.xxx

vue2：路由前置守卫无法获取到this.$store.state.xxx

在获取到vuex的数据时候&#xff0c;想在router目录下的index.js文件去获取到vuex仓库中声明的全局变量&#xff0c;但是通过this.$store.stote.xxx去获取的时候&#xff0c;报错提示&#xff1a;$store未定义 一、store/index.js const store new Vuex.Store({state: {// 属…
阅读更多...
VScode clangd 插件浏览 linux 源码

VScode clangd 插件浏览 linux 源码

文章目录 VScode clangd 插件浏览 linux 源码clangd 安装与配置VScode 插件安装clangd 安装方法一方法二 clangd 配置 cmake 生成bear 生成 compile_commands.json触发 clangd linux 内核脚本生成 compile_commands.json 文件三种方式对比 VScode clangd 插件浏览 linux 源码 …
阅读更多...
外汇天眼：稳定盈利公式揭秘，想明白这个道理少走很多弯路！

外汇天眼：稳定盈利公式揭秘，想明白这个道理少走很多弯路！

所谓资金管理&#xff0c;简单的理解就是如何管好交易账户里的钱&#xff0c;或者说如何用好里面的钱&#xff0c;会更加贴切实际。 实践过程&#xff0c;资金管理最重要的环节应该是&#xff1a;不同行情下仓位的调节和止损的设置。 但据我所知&#xff0c;大多数人在资金管理…
阅读更多...
推荐文章
最新文章

Copyright @ 2022~2023