javaweb案例一

^_^白心火龙果

已于 2022-03-31 19:57:22 修改

阅读量1.2w

点赞数 28

分类专栏： javaWeb 文章标签： http java-ee 服务器

于 2022-03-31 19:54:10 首次发布

本文链接：https://blog.youkuaiyun.com/m0_51064043/article/details/123871695

版权

这篇博客详细介绍了使用JavaWeb实现登录、添加联系人、删除、修改和分页查询等功能，涵盖了前端代码和后端代码的实现，包括验证码刷新、表单验证、数据封装、Service层操作以及分页查询的处理。同时，指出了在开发过程中容易忽视的细节和问题，如防止验证码重复、误删保护、回显信息等。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

一、登录界面

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

1.前端代码

改造验证码

<img src="${pageContext.request.contextPath}/checkCodeServlet" title="看不清点击刷新" id="vcode"/>

点击验证码刷新
加new Date().getTime()的原因在于，时间不重复，因此更新验证就不会重复。

<script type="text/javascript">
        //切换验证码
        function refreshCode(){
     
            //1.获取验证码图片对象
            var vcode = document.getElementById("vcode");

            //2.设置其src属性，加时间戳
            vcode.src = "${pageContext.request.contextPath}/checkCodeServlet?time="+new Date().getTime();
        }
    </script>
<a href="javascript:refreshCode();">

提交表单

<form action="${pageContext.request.contextPath}/loginServlet" method="post">

出错显示的信息框

 <div class="alert alert-warning alert-dismissible" role="alert">
        <button type="button" class="close" data-dismiss="alert" >
            <span>&times;</span>
        </button>
        <strong>${login_msg}</strong>
        <!-- 对应后面的：request.setAttribute("login_msg","用户名或密码错误！"); -->
    </div>

2.后端代码

设置编码

request.setCharacterEncoding("utf-8");

获取用户填写验证码，getParameter()的参数是验证码栏的name字段

<input type="text" name="verifycode" class="form-control" id="verifycode" placeholder="请输入验证码" style="width: 120px;"/>


String verifycode = request.getParameter("verifycode");//得到的是页面获取的验证码

验证码校验
checkCodeServlet里面，将生成的验证码存放在session中。

//将验证码放入HttpSession中
request.getSession().setAttribute("CHECKCODE_SERVER",checkCode);

equalsIgnoreCase()忽略大小写比较。

HttpSession session = request.getSession();
String checkcode_server = (String) session.getAttribute("CHECKCODE_SERVER");//获取了生成的验证码
session.removeAttribute("CHECKCODE_SERVER");//确保验证码一次性
        if(!checkcode_server.equalsIgnoreCase(verifycode)){
   
            //验证码不正确
            //提示信息
            request.setAttribute("login_msg","验证码错误！");
            //跳转登录页面
            request.getRequestDispatcher("/login.jsp").forward(request,response);

            return;
        }

注意：写到这里时，记得先验证是否正确。再进行下一步！！！！！
session.removeAttribute(“CHECKCODE_SERVER”);//确保验证码一次性，注意这一步！！！！

获取所有的数据（只有用户名和密码）

Map<String, String[]> map = request.getParameterMap();

封装User对象（参考request和reponse—常见问题）

  User user = new User();
        try {
   
            BeanUtils.populate(user,map);
        } catch (IllegalAccessException e) {
   
            e.printStackTrace();
        } catch (InvocationTargetException e) {
   
            e.printStackTrace();
        }

调用Service查询

UserService service = new UserServiceImpl();
User loginUser = service.login(user);//查询我用户输入的账户是否存在

判断是否登录成功

		if(loginUser != null){
   
            //登录成功
            //将用户存入session
            session.setAttribute("user",loginUser);
            //跳转页面
            response.sendRedirect(request.getContextPath()+"/index.jsp");
        }else{
   
            //登录失败
            //提示信息
            request.setAttribute("login_msg","用户名或密码错误！");
            //跳转登录页面
            request.getRequestDispatcher("/login.jsp").forward(request,response);

        }

注意：request没有共享数据，因此，登录成功之后，进行重定向！！！
注意：数据库的表需创建，还有配置文件需配置！

二、添加功能

分析图：
在这里插入图片描述

1.前端代码

修改添加联系人的跳转页面路径

<a class="btn btn-primary" href="${pageContext.request.contextPath}/add.jsp">添加联系人</a>

修改头信息

<center><h3>添加联系人页面</h3></center>
    <form action="${pageContext.request.contextPath}/addUserServlet" method="post">

注意要给表单加name，不然后端获取数据时，获取不了，为null！！！！

<input type="text" class="form-contro

最低0.47元/天解锁文章