《尚硅谷》JavaWeb课程书城项目笔记——第三阶段：用户注册和登陆页面的优化

最新推荐文章于 2023-03-26 16:46:54 发布

少年游Mr.yu

最新推荐文章于 2023-03-26 16:46:54 发布

阅读量389

点赞数

分类专栏：项目书城项目文章标签： java 开发语言后端

本文链接：https://blog.csdn.net/qq_44703020/article/details/122504183

版权

项目同时被 2 个专栏收录

8 篇文章 1 订阅

订阅专栏

书城项目

8 篇文章 1 订阅

订阅专栏

1、页面Jsp动态化

2、抽取页面中的相同内容封装到单独的jsp页面

3、修改base标签获取服务器地址为动态获取

4、错误信息提示及表单回显

5、代码优化

6、数据的封装及BeanUtils工具类的使用

1、页面Jsp动态化

在所有的html页面首行添加指令

<%@ page contentType="text/html;charset=UTF-8" language="java" %>

将所有的.html页面文件后缀名改为.jsp

2、抽取页面中的相同内容封装到单独的jsp页面

用户页面的菜单

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<div>
    <span>欢迎<span class="um_span">韩总</span>光临尚硅谷书城</span>
    <a href="../order/order.jsp">我的订单</a>
    <a href="../../index.jsp">注销</a>&nbsp;&nbsp;
    <a href="../../index.jsp">返回</a>
</div>

管理页面的菜单

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<div>
    <a href="book_manager.jsp">图书管理</a>
    <a href="order_manager.jsp">订单管理</a>
    <a href="../../index.jsp">返回商城</a>
</div>

页面的base标签、css样式、jQuery引用

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<base href="http://localhost:8080/book/">
<link type="text/css" rel="stylesheet" href="static/css/style.css" >
<script type="text/javascript" src="static/script/jquery-1.7.2.js"></script>

页脚信息

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<div id="bottom">
		<span>
			尚硅谷书城.Copyright &copy;2015
		</span>
</div>

3、修改base标签获取服务器地址为动态获取

<%
    String basePath = request.getScheme()
            + "://" + request.getServerName()
            + ":" + request.getServerPort()
            + request.getContextPath()
            + "/";
%>

<base href="<%=basePath%>">

4、错误信息提示及表单回显

登陆页面错误信息回写

if(userService.login(username,password) == null) {
            // 返回值为null，登陆失败
            //回写错误信息和用户名
            req.setAttribute("msg","用户名或密码错误!");
            req.setAttribute("username",username);
            // 跳转回登录页面
            req.getRequestDispatcher("/pages/user/login.jsp").forward(req,resp);
        } else {
            // 返回值不为null，登陆成功
            // 跳转到登陆成功页面
            req.getRequestDispatcher("/pages/user/login_success.jsp").forward(req,resp);
        }

登陆信息错误页面表单回显

<div class="msg_cont">
	<b></b>
	<span class="errorMsg">
		<%=request.getAttribute("msg")==null?"请输入用户名和密码":request.getAttribute("msg")%>
	</span>
</div>

<div class="form">
	<form action="loginServlet" method="post">
		<label>用户名称：</label>
		<input class="itxt" type="text" placeholder="请输入用户名"
				autocomplete="off" tabindex="1" name="username"
				value="<%=request.getAttribute("username")==null?"":request.getAttribute("username")%>" />
		<br />
		<br />
		<label>用户密码：</label>
		<input class="itxt" type="password" placeholder="请输入密码" autocomplete="off" tabindex="1" name="password" />
		<br />
		<br />
		<input type="submit" value="登录" id="sub_btn" />
	</form>
</div>

注册页面错误信息回写

//        2 校验验证码
        if("abcd".equalsIgnoreCase(code)) {
//        验证码正确
//            3 验证用户名是否存在
            if(userService.existsUsername(username)) {
//                用户名不可用
                System.out.println("用户名不可用");
                //回写错误信息
                req.setAttribute("msg","用户名已存在");
                req.setAttribute("username",username);
                req.setAttribute("email",email);
//                跳转回注册页面
                req.getRequestDispatcher("/pages/user/regist.jsp").forward(req,resp);
            } else {
//                用户名可用
//                保存注册信息
                userService.registUser(new User(null,username,password,email));
//                跳转到注册成功页面
                req.getRequestDispatcher("/pages/user/regist_success.jsp").forward(req,resp);
            }
        } else {
            //验证码错误
            System.out.println("验证码错误");
            //回写错误信息
            req.setAttribute("msg","验证码错误");
            req.setAttribute("username",username);
            req.setAttribute("email",email);
//            跳回注册页面
            req.getRequestDispatcher("/pages/user/regist.jsp").forward(req,resp);
        }

注册信息错误页面表单回显

<div class="tit">
	<h1>注册尚硅谷会员</h1>
	<span class="errorMsg">
        <%=request.getAttribute("msg")==null?"":request.getAttribute("msg")%>
	</span>
</div>

<label>用户名称：</label>
<input class="itxt" type="text" placeholder="请输入用户名"
	   autocomplete="off" tabindex="1" name="username" id="username"
	   value="<%=request.getAttribute("username")==null?"":request.getAttribute("username")%>" />
<br />

<label>电子邮件：</label>
<input class="itxt" type="text" placeholder="请输入邮箱地址"
	   autocomplete="off" tabindex="1" name="email" id="email"
	   value="<%=request.getAttribute("email")==null?"":request.getAttribute("email")%>" />
<br />

5、代码优化

将RegistServlet和LoginServlet合并为UserServlet

合并代码

package web;

import pojo.User;
import service.UserService;
import service.impl.UserServiceImpl;

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

public class UserServlet extends HttpServlet{

    private UserService userService = new UserServiceImpl();

    /**
     * 登陆功能
     * @param req
     * @param resp
     * @throws ServletException
     * @throws IOException
     */
    protected void login(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
        // 1 获取请求的参数
        String username = req.getParameter("username");
        String password = req.getParameter("password");

        // 2 调用UserService业务查询
        if(userService.login(username,password) == null) {
            // 返回值为null，登陆失败
            //回写错误信息和用户名
            req.setAttribute("msg","用户名或密码错误!");
            req.setAttribute("username",username);
            // 跳转回登录页面
            req.getRequestDispatcher("/pages/user/login.jsp").forward(req,resp);
        } else {
            // 返回值不为null，登陆成功
            // 跳转到登陆成功页面
            req.getRequestDispatcher("/pages/user/login_success.jsp").forward(req,resp);
        }
    }

    /**
     * 注册功能
     * @param req
     * @param resp
     * @throws ServletException
     * @throws IOException
     */
    protected void regist(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
//        1 获取参数
        String username = req.getParameter("username");
        String password = req.getParameter("password");
        String email = req.getParameter("email");
        String code = req.getParameter("code");

//        2 校验验证码
        if("abcd".equalsIgnoreCase(code)) {
//        验证码正确
//            3 验证用户名是否存在
            if(userService.existsUsername(username)) {
//                用户名不可用
                System.out.println("用户名不可用");
                //回写错误信息
                req.setAttribute("msg","用户名已存在");
                req.setAttribute("username",username);
                req.setAttribute("email",email);
//                跳转回注册页面
                req.getRequestDispatcher("/pages/user/regist.jsp").forward(req,resp);
            } else {
//                用户名可用
//                保存注册信息
                userService.registUser(new User(null,username,password,email));
//                跳转到注册成功页面
                req.getRequestDispatcher("/pages/user/regist_success.jsp").forward(req,resp);
            }
        } else {
            //验证码错误
            System.out.println("验证码错误");
            //回写错误信息
            req.setAttribute("msg","验证码错误");
            req.setAttribute("username",username);
            req.setAttribute("email",email);
//            跳回注册页面
            req.getRequestDispatcher("/pages/user/regist.jsp").forward(req,resp);
        }
    }

    @Override
    protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
        String action = req.getParameter("action");
        if("login".equals(action)) {
            // 执行登陆请求
            login(req,resp);
        } else {
            // 执行注册请求
            regist(req,resp);
        }
    }
}

在用户页面表单中添加隐藏域，便于UserServlet区分注册请求与登录请求，修改表单的提交网址

使用反射替代if/else，获取请求的调用的业务


    @Override
    protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
        String action = req.getParameter("action");
        try {
            Method method = this.getClass().getDeclaredMethod(action, HttpServletRequest.class, HttpServletResponse.class);
            method.invoke(this,req,resp);
        } catch (Exception e) {
            e.printStackTrace();
        }

    }

将获取请求的功能抽出来单独封装，以便复用（用户模块、图书模块等都可以使用）

package web;

import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;
import java.lang.reflect.Method;

public abstract class BaseServlet extends HttpServlet{
    @Override
    protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
        String action = req.getParameter("action");
        try {
            Method method = this.getClass().getDeclaredMethod(action, HttpServletRequest.class, HttpServletResponse.class);
            method.invoke(this,req,resp);
        } catch (Exception e) {
            e.printStackTrace();
        }
    }
}

public class UserServlet extends BaseServlet

6、数据的封装及BeanUtils工具类的使用

导入相关Jar包

编写WebUtils

package utils;

import org.apache.commons.beanutils.BeanUtils;

import java.lang.reflect.InvocationTargetException;
import java.util.Map;

public class WebUtils {
    /**
     * 把 Map 中的值注入到对应的 JavaBean 属性中。
     * @param value
     * @param bean
     * @param <T>
     * @return
     */
    public static <T> T copyParamToBean(Map value,T bean) {

        try {
            System.out.println("注入之前：" + bean);
            /**
             * 把所有请求的参数都注入到对象当中
             */
            BeanUtils.populate(bean,value);

            System.out.println("注入之后：" + bean);
        } catch (Exception e) {
            e.printStackTrace();
        }
        return bean;
    }
}

        User user = new User();
        WebUtils.copyParamToBean(req.getParameterMap(),user);

注：本文章所含内容来源于尚硅谷教育，仅供学习参考使用。

少年游Mr.yu

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
《尚硅谷》JavaWeb课程书城项目笔记——第三阶段：用户注册和登陆页面的优化

目录1、页面Jsp动态化2、抽取页面中的相同内容封装到单独的jsp页面3、修改base标签获取服务器地址为动态获取4、错误信息提示及表单回显5、代码优化6、数据的封装及BeanUtils工具类的使用1、页面Jsp动态化在所有的html页面首行添加指令<%@ page contentType="text/html;charset=UTF-8" language="java" %> 将所有的.html页面文件后缀名改为.jsp 2、抽取页面中的相同内
复制链接

扫一扫

专栏目录