《Java EE与中间件》实验一基于MyBatis的留言本

目录

一、实验目的和要求

1、实验目的

2、实验要求

（1）建立javaee-project数据库

一、实验目的和要求

1、实验目的

熟练掌握Mybatis框架基本用法，web项目中集成Mybatis。

2、实验要求

实现简单留言本的发贴和回复功能，效果图如下：

二、实验实现思路及步骤

1、实验思路

（1）设计一个包括留言ID（主键，自增），留言者姓名，留言内容，留言时间等属性的数据库来存储留言信息。

（2）在Java中创建一个实体类，该类对应数据库中的表，有一系列的getter和setter方法用于访问和修改这些属性。

（3）Mapper层包含了所有与数据库操作相关的接口，这些接口定义了如何执行数据库操作。这些接口是MyBatis框架的主要部分，它们定义了如何将Java对象映射到数据库中的记录，以及如何从数据库中检索记录并映射回Java对象。

（4）对于每个Mapper接口，创建一个XML文件来定义如何将接口的方法映射到数据库中的SQL语句。这些XML文件包含了要执行的SQL语句、参数如何映射到SQL语句中等的详细信息。

（5）创建一个名为mybatis-config.xml的配置文件来完成Mapper接口的路径和XML映射文件的路径配置。

（6）Service层包含了业务逻辑的实现，通常会调用Mapper层的方法来操作数据库，并根据业务需求进行数据的处理。Service实现类（Impl）是Service层的具体实现，它们实现了Service层的接口并实现了相关的业务逻辑。

（7）创建Controller层：Controller层负责处理用户请求并调用服务层的业务逻辑，处理HTTP请求，将请求参数转化为entity对象，并调用service层的方法。

2、实验步骤

（1）确定留言本需要存储的数据，包括留言者的姓名、留言的内容、留言的时间等，可以考虑使用关系型数据库，如MySQL来存储这些数据。

（2）定义数据模型实体类，反映数据库中的表结构，每个属性对应一个字段。使用Java的类来表示这些实体，利用IDE的ORM工具IntelliJ IDEA来自动生成这些类和它们对应的数据访问接口。

（3）定义数据访问接口Mapper层，包含对数据库进行各种操作的方法，并为每个接口创建一个XML映射文件，该文件包含如何将接口的方法映射到SQL语句的详细信息。

（4）定义业务逻辑层Service层，该层包含判断留言是否已经存在、统计留言数量等一系列业务逻辑的实现，调用Mapper层的方法来访问数据库，并根据业务需求处理数据。

（5）设计用户界面Controller层，该层处理添加留言、查看留言等一系列用户请求，接收用户的输入并将其转换为程序可以理解的命令，然后调用Service层的方法来执行这些命令。

（6）配置数据源、Mapper接口和XML映射文件的路径等一系列事务管理器以确保事务的一致性。

3、实验方案

（1）使用MySQL建立基于MyBatis的留言本需要使用的数据库（javaee-project）以及数据表（message、user），通过MyBatis配置文件连接对应的数据库，并通过调用数据库中的留言信息数据进行相关留言信息的发布、删除、查看、回复等操作。

（2）根据课本、PPT和老师课堂中讲解的内容，使用IDEA-Java编译软件制作基于MyBatis的留言本。

（3）将代码编写过程中遇到的问题及时的进行记录并在课后向老师进行提问，将遇到的问题进行及时的处理和解答，并将所有的问题和解决方法进行汇总归纳。

（4）完成最终的项目以及基于MyBatis留言本的实验报告，最后进行实验报告排版的检查并提交。

三、主要开发工具

IDEA-Java开发工具、Navicat-MySQL开发工具

四、实验效果及实现代码

1、留言本数据库构建实现

（1）建立javaee-project数据库

打开SQLYog进行数据库的创建，数据库创建完毕以后再在数据库中添加留言信息数据表（message）和用户信息数据表（user），对应的数据库构建界面如图1-1所示：

图1-1 数据库构建界面

核心代码：

sql 复制代码

CREATE DATABASE javaee-project;

USE javaee-project;

（2）建立message数据表

a、message数据表属性设置

留言信息数据表（message）包括昵称（nickname）、QQ号码（qq）、电子邮件地址（email）、留言内容（msg）、回复ID（reply_id）、创建时间（create_time）、更新时间（update_time）以及留言类型（type），对应的message属性设置界面如图1-2所示：

图1-2 message属性设置界面

核心代码：

sql 复制代码

CREATE TABLE `message` (
    `id` int NOT NULL AUTO_INCREMENT,
    `nickname` varchar(255) DEFAULT NULL,
    `qq` varchar(255) DEFAULT NULL,
    `email` varchar(255) DEFAULT NULL,
    `msg` varchar(255) DEFAULT NULL,
    `reply_id` int DEFAULT NULL,
    `create_time` datetime DEFAULT CURRENT_TIMESTAMP,
    `update_time` datetime DEFAULT CURRENT_ON UPDATE CURRENT_TIMESTAMP,
    `type` tinyint DEFAULT NULL,
    PRIMARY KEY (`id`)
) ENGINE=InnoDB AUTO_INCREMENT=108 DEFAULT CHARSET=utf8mb4 COLLATE=utf8mb4_0900_ai_ci

b、message数据表信息

通过Sql语句进行留言信息数据表（message）的创建并在数据表中添加一部分留言数据信息记录，对应的message数据信息界面如图1-3所示：

图1-3 message数据表信息界面

（3）建立user数据表

a、user数据表属性设置

用户信息数据表（user）包括用户名（name）、密码（password）、角色（role）和生日（birthday），对应的user属性设置界面如图1-4所示：

图1-4 user属性设置界面

核心代码：

sql 复制代码

CREATE TABLE `user` (
    `id` int NOT NULL AUTO_INCREMENT,
    `name` varchar(255) DEFAULT NULL,
    `password` varchar(255) DEFAULT NULL,
    `role` varchar(255) DEFAULT NULL,
    `birthday` varchar(255) DEFAULT NULL,
    PRIMARY KEY (`id`)
) ENGINE=InnoDB AUTO_INCREMENT=3 DEFAULT CHARSET=utf8mb4 COLLATE=utf8mb4_0900_ai_ci

b、user数据表信息

通过Sql语句进行用户信息数据表（user）的创建并在数据表中添加一部分用户数据信息记录，对应的user数据信息界面如图1-5所示：

图1-5 user数据表信息界面

2、留言本首页模块功能实现

（1）留言本留言信息呈现

项目创建完毕后启动项目，在留言本的首页可以看到所有用户发布的留言以及对留言作出的回复信息，并会将留言数据按5条为一段进行分页划分处理操作，整个页面采用动画流动设计，为留言本添加了色彩渲染，对应的留言本信息呈现界面如图2-1所示：

图2-1 留言本信息呈现界面

核心代码：

html 复制代码

<video autoplay="autoplay" loop class="fillWidth" muted="muted" style="position: absolute">

    <source src="./image/background.mp4">

</video>

<footer class="main-footer" style="background: #f7ecb5">

    <div class="container">

        <div class="pull-right hidden-xs">

        </div>

        <div align="center">

            <strong>

    <b>

        <b style="color: #0d6aad; margin-left: 30px">设计者：</b>于立伟

        <b style="color: #720e9e; margin-left: 30px">QQ邮箱：<a href= "https://mail.qq.com/">3443531275@qq.com</a></b>

        <b style="color: #720e9e; margin-left: 30px">手机号：13830758370</b>

        <b style="color: rgba(12,32,150,0.29); margin-left: 30px">CO：启 <img src="./image/logoYW.jpg" style="border-radius: 50%" width="20px" height="20px"/> 航</b>

        <b style="color: #720e9e; margin-left: 30px">B站视频号：<a href="https://www.bilibili.com/video/BV1mh4y1M7id/">尾鲤鱼</a></b>

    </b>

            </strong>

        </div>

    </div>

</footer>

（2）留言本留言记录查询

a、键入查询信息

当需要查看指定用户的留言信息时，可以在留言本最上方的搜索框中输入自己想要查询的数据记录，此处采用了模糊查询的方式，对应的键入查询界面如图2-2所示：

图2-2 键入查询界面

核心代码：

java 复制代码

@RequestMapping("/replyByNickname.do")

public void replyByNickname(HttpServletRequest request, HttpServletResponse response) {

    try {

    request.setCharacterEncoding("UTF-8");

    String id = request.getParameter("id");

    String msg = request.getParameter("replyMsg");

    Message message = new Message();

        message.setReplyId(Integer.parseInt(id));

        message.setMsg(msg);

        message.setType(false);

        messageService.insert(message);

        JSONUtil.printByJSON(response, Result.success());

    } catch (Exception e) {

        e.printStackTrace();

    }

}

@Override

public List<Message> list() {

    SqlSession sqlSession = MybatisUtils.getSqlsession();

    MessageMapper mapper = sqlSession.getMapper(MessageMapper.class);

    List<Message> messages = mapper.selectMsg();

    sqlSession.commit();

    sqlSession.close();

    return messages;

}

b、查看查询结果

在搜索框中输入自己想要查询的内容后点击回车键即可完成查询操作，对应的查询结果会显示输出到页面中，对应的查询结果界面如图2-3所示：

图2-3 查询结果界面

核心代码：

html 复制代码

<c:forEach items="${messages}" var="msg">
    <div class="box box-default" style="background: rgba(255, 255, 255, 0.5)">
        <div class="box-header with-border">
            <h2 class="box-title">
    <b>${msg.nickname}在<fmt:formatDate value="${msg.createTime}" pattern="yyyy年MM月dd日HH:mm:ss"/>发布留言：</b>
            </h2></div>
        <div class="box-body" align="center">
            <b style="color: #00b3ee; font-size: 18px">${msg.msg}</b>
        </div>
        <c:if test="${msg.replyMessages != []}">
            <c:forEach items="${msg.replyMessages}" var="reply">
        <div class="box-footer">
            <b style="font-family: 黑体"><fmt:formatDate value="${reply.createTime}" pattern="yyyy年MM月dd日🚀🚀HH:mm:ss"/>回复：${reply.msg}</b>
        </div>
            </c:forEach>
        </c:if>
        <c:if test="${user != null}">
            <div class="box-footer" style="text-align: center">
        <button type="button" class="btn btn-danger" data-dismiss="modal" onclick="deletemsg('${msg.id}')">删除</button>
        <button type="button" class="btn btn-primary" onclick="reply('${msg.id}')">回复</button>
</div></c:if>
        </div>
    </c:forEach>

（3）留言本链接跳转

a、B站课程录播

在页面的最下方添加了B站的链接键入模块，可以通过点击进入到该留言本的设计实现录播视频中，对应的B站课程录播界面如图2-4所示：

图2-4 B站课程录播界面

核心代码：

html 复制代码

<div align="center">

    <strong>

        <b>

            <b style="color: #0d6aad; margin-left: 30px">设计者：</b>于立伟

            <b style="color: #720e9e; margin-left: 30px">QQ邮箱：<a href="https://mail.qq.com/">3443531275@qq.com</a></b>

            <b style="color: #720e9e; margin-left: 30px">手机号：13830758370</b>

            <b style="color: rgba(12,32,150,0.29); margin-left: 30px">CO：启 <img src="./image/logoYW.jpg" style="border-radius: 50%" width="20px" height="20px"/> 航</b>

            <b style="color: #720e9e; margin-left: 30px">B站视频号：<a href="https://www.bilibili.com/video/BV1mh4y1M7id/">尾鲤鱼</a></b>

        </b>

    </strong>

</div>

b、QQ邮箱发布

在页面的最下方添加了QQ邮箱的链接键入模块，可以通过点击进入到QQ邮箱进行相关信息内容的上传发布操作，对应的QQ邮箱发布界面如图2-5所示：

图2-5 QQ邮箱发布界面

核心代码：

html 复制代码

<div align="center">

    <strong>

        <b>

            <b style="color: #0d6aad; margin-left: 30px">设计者：</b>于立伟

            <b style="color: #720e9e; margin-left: 30px">QQ邮箱：<a href="https://mail.qq.com/">3443531275@qq.com</a></b>

            <b style="color: #720e9e; margin-left: 30px">手机号：13830758370</b>

            <b style="color: rgba(12,32,150,0.29); margin-left: 30px">CO：启 <img src="./image/logoYW.jpg" style="border-radius: 50%" width="20px" height="20px"/> 航</b>

            <b style="color: #720e9e; margin-left: 30px">B站视频号：<a href="https://www.bilibili.com/video/BV1mh4y1M7id/">尾鲤鱼</a></b>

        </b>

    </strong>

</div>

3、留言本登录模块功能实现

（1）留言本登录验证

a、账号密码验证失败

在用户进行留言本登录的时候，通过用户在输入框中输入的信息进行对应的输入内容校验，并将不符合的信息进行输出提示，对应的账号密码验证失败界面如图3-1所示：

图3-1 账号密码验证失败界面

核心代码：

javascript 复制代码

$('#login_form').bootstrapValidator({

    excluded: [':disabled', ':hidden', ':not(:visible)'],//默认指定不验证的情况

    message : 'This value is not valid',

    feedbackIcons : {

        valid : 'glyphicon glyphicon-ok',

        invalid : 'glyphicon glyphicon-remove',

        validating : 'glyphicon glyphicon-refresh'

    },

    fields : {

        name: {  /*键名username和input name值对应*/

message: '用户名不能为空',

validators: {

        notEmpty: { /*非空提示*/

        message: '用户名必填不能为空'

    },

        stringLength: { /*长度提示*/

        min: 3,

        max: 30,

        message: '用户名长度不能小于3位或超过30位'

        },

        regexp: { /*正则校验*/

            regexp: /^[a-zA-Z0-9_\.]+$/,

            message: '用户名只能由字母、数字、点和下划线组成。'

        },

    }

            },

            password: {

    message:'密码无效',

    validators: {

        notEmpty: {

            message: '密码不能为空'

        },

        stringLength: {

            min: 3,

            max: 15,

            message: '密码长度必须在3到15之间'

        }

    }

            },

        }

});

b、账号密码验证成功

用户将登录信息全部按照登录提示修改后会在每个文本框的最后出现绿色的小勾，从而表示输入信息均已正确，对应的账号密码验证成功界面如图3-2所示：

图3-2 账号密码验证成功界面

核心代码：

javascript 复制代码

name: {  /*键名username和input name值对应*/

message: '用户名不能为空',

validators: {

    notEmpty: { /*非空提示*/

        message: '用户名必填不能为空'

    },

    stringLength: { /*长度提示*/

        min: 3,

        max: 30,

        message: '用户名长度不能小于3位或超过30位'

    },

        regexp: { /*正则校验*/

        regexp: /^[a-zA-Z0-9_\.]+$/,

        message: '用户名只能由字母、数字、点和下划线组成。'

    },

}

        },

        password: {

        message:'密码无效',

        validators: {

            notEmpty: {

            message: '密码不能为空'

        },

        stringLength: {

            min: 3,

            max: 15,

            message: '密码长度必须在3到15之间'

        }

    }

}

（2）留言本登录成功

登录内容全部输入成功后即可进行对应账号的登录操作，对应的留言本登录成功界面如图3-3所示：

图3-3 留言本登录成功界面

核心代码：

java 复制代码

@RequestMapping("/login.do")

public void login(HttpServletRequest request, HttpServletResponse response) {

    try {

        request.setCharacterEncoding("UTF-8");

        String name = request.getParameter("name");

        String password = request.getParameter("password");

        User user = userService.login(name, password);

        request.getSession().setAttribute("user", user);

        if (Objects.nonNull(user)) {

            JSONUtil.printByJSON(response, Result.success());

        }

        JSONUtil.printByJSON(response, Result.fail());

    } catch (UnsupportedEncodingException e) {

        e.printStackTrace();

    }

}

（3）留言本登录退出

用户发布完毕自己的留言信息后可以点击页面右上角自己的用户名进行登录退出的操作，对应的留言本登录退出界面如图3-4所示：

图3-4 留言本登录退出界面

核心代码：

java 复制代码

@RequestMapping("/out.do")

public void out(HttpServletRequest request, HttpServletResponse response) {

    request.getSession().removeAttribute("user");

    JSONUtil.printByJSON(response, Result.success());

}

$('#login_form').bootstrapValidator({

    excluded: [':disabled', ':hidden', ':not(:visible)'],//默认指定不验证的情况

    message : 'This value is not valid',

    feedbackIcons : {

        valid : 'glyphicon glyphicon-ok',

        invalid : 'glyphicon glyphicon-remove',

        validating : 'glyphicon glyphicon-refresh'

}

4、留言本发布留言模块功能实现

（1）留言本发布留言内容验证

a、昵称验证失败

用户点击发布留言后会弹出对应的发布留言信息弹窗，在对应的输入框中按照提示信息填入自己的信息和留言内容即可，如果自己的昵称输入有问题则会提示"输入内容必须为字母、数字、点和下划线"，对应的昵称验证失败界面如图4-1所示：

图4-1 昵称验证失败界面

核心代码：

javascript 复制代码

fields : {

     nickname: {  /*键名username和input name值对应*/

        validators: {

            notEmpty: { /*非空提示*/

            message: '用户名必填不能为空'

        },

        StringLength: { /*长度提示*/

            min: 3,

            max: 30,

            message: '用户名长度不能小于3位或超过30位'

        },

         regexp: { /*正则校验*/

            regexp: /^[a-zA-Z0-9_\.]+$/,

            message: '用户名只能由字母、数字、点和下划线组成。'

        },

    }

}

b、邮箱验证失败

如果自己的邮箱输入框中没有填写邮箱号的话会提示"邮箱不能为空"，对应的邮箱验证失败界面如图4-2所示：

图4-2 邮箱验证失败界面

核心代码：

javascript 复制代码

qq: {

    validators: {

        notEmpty: {

            message: 'qq不能为空'

        },

        digits:{ // 纯数字验证

            message: 'qq只能是数字'

        },

        stringLength: {

            min: 3,

            max: 15,

            message: 'qq长度必须在3到15之间'

        }

    }

},

    email: {

        validators: {

            notEmpty: {

                message: '邮箱不能为空'

            },

            emailAddress:{ // 邮箱验证

                message: '请输入正确的邮箱'

            },

            stringLength: {

                min: 3,

                max: 15,

                 message: 'qq长度必须在3到15之间'

            }

      }

}

b、发布留言内容验证成功

用户将留言信息全部按照留言信息提示修改后会在每个文本框的最后出现绿色的小勾，从而表示输入信息均已正确，对应的发布留言内容验证成功界面如图4-3所示：

图4-3 发布留言内容验证成功界面

核心代码：

javascript 复制代码

msg : {

     validators : {

         notEmpty : {

             message : '留言内容必填'

         },

         stringLength : {

             min : 2,

             max : 200,

             message : '留言长度必须2-200字符'

         }

     }

}

（2）留言本留言发布

a、留言本留言信息

将必须要填写的个人信息填写无误后即可进行留言内容的填写，将对应的留言内容填写到留言内容输入框中即可，对应的留言本留言信息界面如图4-4所示：

图4-4 留言本留言信息界面

核心代码：

java 复制代码

@RequestMapping("/insert.do")

public void insert(HttpServletRequest request, HttpServletResponse response) {

    try {

        request.setCharacterEncoding("UTF-8");

        String nickname = request.getParameter("nickname");

        String qq = request.getParameter("qq");

        String email = request.getParameter("email");

        String msg = request.getParameter("msg");

        Message message = new Message();

        message.setEmail(email);

        message.setMsg(msg);

        message.setNickname(nickname);

        message.setQq(qq);

        message.setType(true);

        messageService.insert(message);

        JSONUtil.printByJSON(response, Result.success());

    } catch (UnsupportedEncodingException e) {

        e.printStackTrace();

    }

}

@Override

    public void insert(Message message) {

    SqlSession sqlSession = MybatisUtils.getSqlsession();

    MessageMapper mapper = sqlSession.getMapper(MessageMapper.class);

    mapper.insert(message);

    sqlSession.commit();

    sqlSession.close();

}

b、留言本留言发布成功

留言信息填写完毕后即可点击弹窗中的提交留言按钮进行留言信息的发布操作，对应的留言本留言发布成功界面如图4-5所示：

图4-5 留言本留言发布成功界面

核心代码：

html 复制代码

<div class="modal fade" id="exampleModal" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">

    <div class="modal-dialog">

        <div class="modal-content" style="background-image: url('../image/background.png')">

            <div class="modal-header">

                <h2 class="modal-title" id="exampleModalLabel" align="center" style="color: #720e9e">发布留言</h2>

            </div>

            <div class="modal-body">

                <form id="msg_form">

                    <div class="form-group">

                        <label for="nickname">昵称</label>

                        <input style="background-color: #d3dcda" type="text" class="form-control" placeholder="请输入您的昵称" id="nickname" name="nickname" aria-describedby="emailHelp">

                    </div>

                    <div class="form-group">

                        <label for="QQ">QQ</label>

                        <input style="background-color: #d3dcda" type="text" class="form-control" placeholder="请输入您的QQ号" id="qq" name="qq">

                    </div>

                    <div class="form-group">

                        <label for="email">邮箱</label>

                        <input style="background-color: #d3dcda" type="text" class="form-control" placeholder="请输入您的邮箱号" id="email" name="email">

                    </div>

                <div class="form-group">

                    <label for="msg">内容</label>

                        <textarea style="background-color: #d3dcda" class="form-control" id="msg" placeholder="请输入发表的内容信息" name="msg" rows="3"></textarea>

                </div>

            </form>

         </div>

         <div class="modal-footer" style="text-align: center">

              <button type="button" class="btn btn-secondary" data-dismiss="modal">关闭</button>

                  <button type="button" class="btn btn-primary" id="send_btn">发布留言</button>

         </div>

        </div>

     </div>

</div>

5、留言本留言回复模块功能实现

（1）留言本留言回复信息

用户登录留言本后可以对所有的留言信息进行回复评论操作，点击留言框中的回复按钮即可进行回复内容的填写，对应的留言本留言回复信息界面如图5-1所示：

图5-1 留言本留言回复信息界面

核心代码：

java 复制代码

@RequestMapping("/reply.do")

public void reply(HttpServletRequest request, HttpServletResponse response) {

    try {

        request.setCharacterEncoding("UTF-8");

        String id = request.getParameter("id");

        String msg = request.getParameter("replyMsg");

        Message message = new Message();

        message.setReplyId(Integer.parseInt(id));

        message.setMsg(msg);

        message.setType(false);

        messageService.insert(message);

        JSONUtil.printByJSON(response, Result.success());

    } catch (Exception e) {

        e.printStackTrace();

    }

}

@Override

public void insert(Message message) {

    SqlSession sqlSession = MybatisUtils.getSqlsession();

    MessageMapper mapper = sqlSession.getMapper(MessageMapper.class);

    mapper.insert(message);

    sqlSession.commit();

    sqlSession.close();

}

（2）留言本留言回复发布成功

回复内容填写完毕后即可点击回复弹窗中的发布按钮进行回复信息的发布，对应的留言本留言回复发布成功界面如图5-2所示：

图5-2 留言本留言回复发布成功界面

核心代码：

javascript 复制代码

$("#reply_btn").click(function () {

    let txt = $("#reply_form").serialize()

    let id = $("#id").val()

    let data = txt + '&id=' + id

    fetch("/message/reply.do", {

        method:"post",

        headers:{

            'Content-type':'application/x-www-form-urlencoded'

        },

        body:data

    }).then(res => {

        return res.json()

    }).then(data => {

        if (data.success) {

        location.reload()

            $('#replyModal').modal('hide')

        }

    })

})

6、留言本删除留言模块功能实现

（1）留言本留言删除验证

如果自己的留言发布后感觉有问题需要删除只需要点击留言框中的删除按钮进行留言删除即可，但是为了确保无误删除时需要进行删除验证操作，对应的留言本留言删除验证界面如图6-1所示：

图6-1 留言本留言删除验证界面

核心代码：

java 复制代码

@RequestMapping("/delete.do")

public void delete(HttpServletRequest request, HttpServletResponse response) throws UnsupportedEncodingException {

    request.setCharacterEncoding("UTF-8");

    String id = request.getParameter("id");

    messageService.deleteById(Integer.parseInt(id));

JSONUtil.printByJSON(response,Result.success());

}

@Override

public void deleteById(int parseInt) {

    SqlSession sqlSession = MybatisUtils.getSqlSession();

    MessageMapper mapper = sqlSession.getMapper(MessageMapper.class);

    mapper.deleteByPrimaryKey(parseInt);

    mapper.deleteByReplyId(parseInt);

    sqlSession.commit();

    sqlSession.close();

}

（2）留言本留言删除成功

如果确认要删除该条留言的话在二次确认的窗口中点击确认按钮即可进行该条记录的删除操作，对应的留言本留言删除成功界面如图6-2所示：

图6-2 留言本留言删除成功界面

核心代码：

javascript 复制代码

function deleteModal(id) {

        mid = id;

        $("#deleteModal").modal('show')

    }

    $("#delete_btn").click(function () {

        let data = 'id='+mid

        fetch("/message/delete.do",{

        method:"post",

        headers:{

                'Content-type':'application/x-www-form-urlencoded'

        },

            body:data

        }).then(res=>{

            return res.json()

        }).then(data =>{

            if (data.success) {

                location.reload()

                $('#deleteModal').modal('hide')

            }

        })

    });

五、遇到的问题和解决方法

1、运行问题：启动Tomcat的过程中，出现端口被占用的情况。

解决方法：对服务器进行配置，将服务器运行的端口号改为别的端口即可（找到Tomcat安装目录下的文件"/conf/server.xml"->使用记事本或写字板打开文件，在文件中找到"Connector port=8080"->将"8080"改为"8888"，然后保存配置文件->重启Tomcat服务器）。

2、运行问题：代码编写完成后进行运行发现网页无法进行页面加载，显示页面请求失败。

解决方法：由于没有在Tomcat服务器上进行运行所导致，先运行服务器然后再运行代码后页面可以正常加载。

3、项目问题：JSP页面中遇到编码问题。

解决方法：可以先检查JSP页面、JavaBean以及数据库的编码设置是否一致，可以手动在代码中设置编码格式，也可以在web.xml文件中配置全局的编码过滤器。

4、项目问题：JSP页面无法正确地显示数据。

解决方法：检查JSP页面中是否包含错误的HTML标签、CSS样式或JavaScript代码，这些代码可能会干扰数据的显示，也可以检查JavaBean中的数据是否被正确地存储、处理和输出。

5、项目问题：JSP页面无法获取到JavaBean中的数据。

解决方法：确保JavaBean中需要获取的数据已经被正确地赋值，可以在JSP页面中使用EL表达式或者使用Java代码片段的方式获取数据。

6、项目问题：JSP页面中的表单无法提交。

解决方法：检查表单中的请求方法是否正确，是否存在未填写的必填项，是否存在重复的表单参数等错误，同时也可以检查网络连接是否正常。

7、项目问题：页面跳转异常。

解决方法：检查代码实现，确保页面跳转的 URL 是否正确，是否遗漏了必要的转发或者重定向操作；另外还可以通过在浏览器中查看控制台日志来定位问题。

8、项目问题：请求参数获取失败。

解决方法：检查代码实现，确保请求参数的名称、类型和格式都与服务器端代码中一致，还可以通过在浏览器中查看网络请求信息来定位问题。

9、项目问题：项目运行后页面出现了404错误。

解决方法：由于在连接数据库的配置文件中数据库名错误导致的，将数据库的名字修改为自己的数据库名称后再次启动错误消息。

10、项目问题：项目运行后页面出现了500错误。

解决方法：由于没有把类名写到配置文件的中，所以Tomcat就找不该类，此时我们把类名加入进去就可以正常访问了。

六、心得体会

1、基于MyBatis的留言本项目为我提供了宝贵的软件开发和数据库操作经验，通过这个项目我深入了解了MyBatis这一优秀的持久层框架，并在实践中获得了一些独特的见解。MyBatis的灵活性和强大性给我留下了深刻的印象，它支持定制化SQL、存储过程以及高级映射，这使得开发者可以更加便捷地操作数据库。

2、利用MyBatis的映射特性，将数据库表中的字段与Java对象进行了对应，通过使用MyBatis提供的映射文件，我可以轻松地实现对数据库的增、删、改、查等操作。此外MyBatis还支持动态SQL，可以在运行时根据参数动态生成SQL语句，使得操作数据库更加灵活。

3、在开发过程中，由于留言本项目的数据量较大，如果直接使用MyBatis的默认查询方式，可能会影响性能。为了解决这个问题我研究了MyBatis提供的分页查询功能，通过在SQL语句中加入分页参数，MyBatis可以自动生成对应的分页SQL语句，大大提高了查询效率。

4、由于数据库表结构经常变化，我需要频繁地更新MyBatis的映射文件，为了解决这个问题我深入研究了MyBatis的动态映射特性。通过在映射文件中使用动态SQL语句，我可以根据数据库表的实际结构自动生成对应的映射文件，避免了因表结构变化而导致的错误。

5、制作基于MyBatis留言本的项目让我深入了解了MyBatis框架的使用和原理，同时也在实践中获得了宝贵的经验。在这个过程中我不仅学会了如何使用MyBatis进行数据库操作，还学会了如何解决实际开发中遇到的问题。通过这个项目我深刻体会到了MyBatis在持久层框架中的优势以及在项目开发中的重要性。

《Java EE与中间件》实验一 基于MyBatis的留言本

一、实验目的和要求

1、实验目的

2、实验要求

二、实验实现 思路 及 步骤

1、实验思路

2、 实验步骤

3、实验方案

三、主要开 发 工具

四、实验效果 及 实现 代码

1、 留言本数据库构建实现

（1）建立javaee-project数据库

（2）建立message数据表

（3）建立user数据表

2、留言本首页模块功能实现

（1）留言本留言信息呈现

（2）留言本留言记录查询

（3）留言本链接跳转

3、留言本登录模块功能实现

（1）留言本登录验证

（2）留言本登录成功

（3）留言本登录退出

4、留言本发布留言模块功能实现

（1）留言本发布留言内容验证

（2） 留言本留言发布

5、留言本留言回复模块功能实现

（1）留言本留言回复信息

（2）留言本留言回复发布成功

6、留言本删除留言模块功能实现

（1）留言本留言删除验证

（2）留言本留言删除成功

五、遇到的问题和解决方法

六、心得体会

《Java EE与中间件》实验一基于MyBatis的留言本

二、实验实现思路及步骤

2、实验步骤

三、主要开发工具

四、实验效果及实现代码

1、留言本数据库构建实现

（2）留言本留言发布