Init

.gitignore

@@ -0,0 +1,29 @@
+### IntelliJ IDEA ###
+out/
+!**/src/main/**/out/
+!**/src/test/**/out/
+.idea
+### Eclipse ###
+.apt_generated
+.classpath
+.factorypath
+.project
+.settings
+.springBeans
+.sts4-cache
+bin/
+!**/src/main/**/bin/
+!**/src/test/**/bin/
+
+### NetBeans ###
+/nbproject/private/
+/nbbuild/
+/dist/
+/nbdist/
+/.nb-gradle/
+
+### VS Code ###
+.vscode/
+
+### Mac OS ###
+.DS_Store

JavaWeb-Login-Register.iml

@@ -0,0 +1,24 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<module type="JAVA_MODULE" version="4">
+  <component name="FacetManager">
+    <facet type="web" name="Web">
+      <configuration>
+        <descriptors>
+          <deploymentDescriptor name="web.xml" url="file://$MODULE_DIR$/web/WEB-INF/web.xml" />
+        </descriptors>
+        <webroots>
+          <root url="file://$MODULE_DIR$/web" relative="/" />
+        </webroots>
+      </configuration>
+    </facet>
+  </component>
+  <component name="NewModuleRootManager" inherit-compiler-output="true">
+    <exclude-output />
+    <content url="file://$MODULE_DIR$">
+      <sourceFolder url="file://$MODULE_DIR$/src" isTestSource="false" />
+    </content>
+    <orderEntry type="inheritedJdk" />
+    <orderEntry type="sourceFolder" forTests="false" />
+    <orderEntry type="library" name="libs" level="project" />
+  </component>
+</module>

src/com/landaiqing/dao/UserDao.java

@@ -0,0 +1,105 @@
+package com.landaiqing.dao;
+
+
+import com.landaiqing.entity.UserEntity;
+import com.landaiqing.entity.UserEntity;
+import com.landaiqing.utils.JdbcUtils;
+
+import java.sql.Connection;
+import java.sql.PreparedStatement;
+import java.sql.ResultSet;
+
+/**
+ * @author 余胜军
+ * @ClassName MayiktDao
+ * @qq 644064779
+ * @addres www.mayikt.com
+ * 微信:yushengjun644
+ */
+public class UserDao {
+ private UserEntity userEntity=new UserEntity();
+    /**
+     * 用户登录成功之后 该方法返回 用户登录成功之后对象
+     */
+    public UserEntity login(String userName, String userPwd) {
+        ResultSet resultSet = null;
+        PreparedStatement preparedStatement = null;
+        Connection connection = null;
+        try {
+            connection = JdbcUtils.getConnection();
+            String loginSql = "select  * from  user where username=? and password=?;";
+            preparedStatement = connection.prepareStatement(loginSql);
+            preparedStatement.setString(1, userName);
+            preparedStatement.setString(2, userPwd);
+            resultSet = preparedStatement.executeQuery();
+            if (!resultSet.next()) {  // 查询不到用户数据
+                return null;
+            }
+            // 将db中数据 返回给客户端 查询到数据
+            Integer id = resultSet.getInt(1);
+            String dbUserName = resultSet.getString(2);
+            String dbUserPwd = resultSet.getString(3);
+            UserEntity mayiktUserEntity = new UserEntity(dbUserName, dbUserPwd);
+            return mayiktUserEntity;
+        } catch (Exception e) {
+            e.printStackTrace();
+            return null;
+        } finally {
+            JdbcUtils.closeConnection(resultSet, preparedStatement, connection);
+        }
+    }
+
+    public static UserEntity findByUserName(String userName) {
+        ResultSet resultSet = null;
+        PreparedStatement preparedStatement = null;
+        Connection connection = null;
+        try {
+            connection = JdbcUtils.getConnection();
+            String loginSql = "select  * from  user where username=?";
+            preparedStatement = connection.prepareStatement(loginSql);
+            preparedStatement.setString(1, userName);
+            resultSet = preparedStatement.executeQuery();
+            if (!resultSet.next()) {  // 查询不到用户数据
+                return null;
+            }
+            // 将db中数据 返回给客户端 查询到数据
+            Integer id = resultSet.getInt(1);
+            String dbUserName = resultSet.getString(2);
+            String dbUserPwd = resultSet.getString(3);
+            UserEntity mayiktUserEntity = new UserEntity(dbUserName, dbUserPwd);
+            return mayiktUserEntity;
+        } catch (Exception e) {
+            e.printStackTrace();
+            return null;
+        } finally {
+            JdbcUtils.closeConnection(resultSet, preparedStatement, connection);
+        }
+    }
+
+    public static int register(String userName, String userPwd) {
+        Connection connection = null;
+        PreparedStatement preparedStatement = null;
+        try {
+            connection = JdbcUtils.getConnection();
+            // sql语句写的操作 ----加上事务
+            JdbcUtils.beginTransaction(connection); // 开启事务
+            String insertSql = "INSERT INTO `testdb`.`user` (`id`, `username`, `password`) VALUES (null, ?, ?);";
+            preparedStatement = connection.prepareStatement(insertSql);
+            preparedStatement.setString(1, userName);
+            preparedStatement.setString(2, userPwd);
+            int result = preparedStatement.executeUpdate();
+            // 代码执行没有问题的情况下 则会提交数据
+            JdbcUtils.commitTransaction(connection); // 提交事务
+            return result;
+        } catch (Exception e) {
+            // 程序代码报错之后 是需要回滚事务
+            e.printStackTrace();
+            JdbcUtils.rollBackTransaction(connection);// 回滚事务
+            return 0;
+        } finally {
+            JdbcUtils.closeConnection(preparedStatement, connection);
+        }
+
+    }
+}
+

src/com/landaiqing/entity/UserEntity.java

@@ -0,0 +1,30 @@
+package com.landaiqing.entity;
+
+public class UserEntity {
+    private String userName;
+    private String userPwd;
+
+    public String getUserName() {
+        return userName;
+    }
+
+    public void setUserName(String userName) {
+        this.userName = userName;
+    }
+
+    public String getUserPwd() {
+        return userPwd;
+    }
+
+    public void setUserPwd(String userPwd) {
+        this.userPwd = userPwd;
+    }
+
+    public UserEntity(String userName, String userPwd) {
+        this.userName = userName;
+        this.userPwd = userPwd;
+    }
+    public  UserEntity(){
+
+    }
+}

src/com/landaiqing/service/UserService.java

@@ -0,0 +1,18 @@
+package com.landaiqing.service;
+
+import com.landaiqing.dao.UserDao;
+import com.landaiqing.entity.UserEntity;
+
+public class UserService {
+    private UserDao userDao=new UserDao();
+    public int register(String userName, String userPwd) {
+        return userDao.register(userName, userPwd);
+    }
+    public UserEntity login(String userName, String userPwd) {
+        return userDao.login(userName,userPwd);
+    }
+
+    public UserEntity findByUserName(String userName) {
+        return userDao.findByUserName(userName);
+    }
+}

src/com/landaiqing/servlet/LoginServlet.java

@@ -0,0 +1,72 @@
+package com.landaiqing.servlet;
+
+
+import com.landaiqing.entity.UserEntity;
+import com.landaiqing.service.UserService;
+import jakarta.servlet.ServletException;
+import jakarta.servlet.annotation.WebServlet;
+import jakarta.servlet.http.*;
+import org.apache.commons.lang3.StringUtils;
+
+import java.io.IOException;
+
+/**
+ * @author 余胜军
+ * @ClassName LoginServlet
+ * @qq 644064779
+ * @addres www.mayikt.com
+ * 微信:yushengjun644
+ */
+@WebServlet("/login")
+public class LoginServlet extends HttpServlet {
+    private UserService UserService = new UserService();
+
+    @Override
+    protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
+        // 转发login页面
+        req.getRequestDispatcher("login.jsp").forward(req, resp);
+    }
+
+    @Override
+    protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
+        // 点击登录的时候 获取到用户的参数
+        String userName = req.getParameter("userName");
+        if (StringUtils.isEmpty(userName)) {
+            //转发到错误页面
+            req.setAttribute("errorMsg", "用户名称不能够是为空!");
+            req.getRequestDispatcher("error.jsp").forward(req, resp);
+            return;
+        }
+        String userPwd = req.getParameter("userPwd");
+        // 参数验证
+        if (StringUtils.isEmpty(userPwd)) {
+            //转发到错误页面
+            req.setAttribute("errorMsg", "userPwd不能够是为空!");
+            req.getRequestDispatcher("login.jsp").forward(req, resp);
+            return;
+        }
+        // 在调用业务逻辑层
+        UserEntity mayiktUserEntity = UserService.login(userName, userPwd);
+        if (mayiktUserEntity == null) {
+            // 用户名称或者密码错误!
+            req.setAttribute("errorMsg", "用户名称或者是密码错误!");
+            req.getRequestDispatcher("login.jsp").forward(req, resp);
+            return;
+        }
+        // 判断用户是否记住密码
+        String rememberPassword = req.getParameter("rememberPassword");
+        if ("on".equals(rememberPassword)) {
+            // 如果有记住密码则 将密码保存在cookie中
+            Cookie userNameCookie = new Cookie("userName", userName);
+            Cookie userPwdCookie = new Cookie("userPwd", userPwd);
+            resp.addCookie(userNameCookie);
+            resp.addCookie(userPwdCookie);
+        }
+        // 能够db中查询到对象 登录成功了  将用户数据存放在session中
+        HttpSession session = req.getSession();
+        session.setAttribute("user", mayiktUserEntity);
+        // 在转发到首页（重定向到首页）
+//        req.getRequestDispatcher("index.jsp").forward(req, resp);
+        resp.sendRedirect("index.jsp");
+    }
+}

src/com/landaiqing/servlet/RegisterServlet.java

@@ -0,0 +1,82 @@
+package com.landaiqing.servlet;
+
+
+import com.landaiqing.entity.UserEntity;
+import com.landaiqing.service.UserService;
+import com.landaiqing.utils.RandomValidateCode;
+import jakarta.servlet.ServletException;
+import jakarta.servlet.annotation.WebServlet;
+import jakarta.servlet.http.HttpServlet;
+import jakarta.servlet.http.HttpServletRequest;
+import jakarta.servlet.http.HttpServletResponse;
+import jakarta.servlet.http.HttpSession;
+import org.apache.commons.lang3.StringUtils;
+
+import java.io.IOException;
+
+/**
+ * @author 余胜军
+ * @ClassName RegisterServlet
+ * @qq 644064779
+ * @addres www.mayikt.com
+ * 微信:yushengjun644
+ */
+@WebServlet("/register")
+public class RegisterServlet extends HttpServlet {
+    private UserService UserService = new UserService();
+
+    @Override
+    protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
+        // 转发到register.jsp
+        req.getRequestDispatcher("register.jsp").forward(req, resp);
+    }
+
+    @Override
+    protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
+        // 转发到注册插入数据
+        // 点击注册的时候 获取到用户的参数
+        String userName = req.getParameter("userName");
+        if (StringUtils.isEmpty(userName)) {
+            //转发到错误页面
+            req.setAttribute("errorMsg", "用户名称不能够是为空!");
+            req.getRequestDispatcher("register.jsp").forward(req, resp);
+            return;
+        }
+        String userPwd = req.getParameter("userPwd");
+        // 参数验证
+        if (StringUtils.isEmpty(userPwd)) {
+            //转发到错误页面
+            req.setAttribute("errorMsg", "userPwd不能够是为空!");
+            req.getRequestDispatcher("register.jsp").forward(req, resp);
+            return;
+        }
+        // 图形验证码  比较 是在 注册之前
+        // 比较图形验证码
+        String userCode = req.getParameter("code"); // 用户输入的图形验证码
+        // 从session中获取图形验证码
+        HttpSession session = req.getSession();
+        String sessionCode = (String) session.getAttribute(RandomValidateCode.RANDOMVALIDATECODE);
+        if (!sessionCode.equalsIgnoreCase(userCode)) {
+            req.setAttribute("errorMsg", "图形验证码不正确，请重新输入!");
+            req.getRequestDispatcher("register.jsp").forward(req, resp);
+            return;
+        }
+        // 用户注册之前根据用户名称查询该用户是否存在如果不存在的情况下才可以注册 如果存在的话就无法注册
+        UserEntity dbMayiktUserEntity = UserService.findByUserName(userName);
+        if (dbMayiktUserEntity != null) {
+            req.setAttribute("errorMsg", "该用户" + userName + ",在数据库中存在无法重复注册！");
+            req.getRequestDispatcher("register.jsp").forward(req, resp);
+            return;
+        }
+        //用户数据注册
+        int register = UserService.register(userName, userPwd);
+        if (register <= 0) {
+            // 注册失败了   //转发到错误页面
+            req.setAttribute("errorMsg", "注册失败!");
+            req.getRequestDispatcher("register.jsp").forward(req, resp);
+            return;
+        }
+        // 注册成功之后就直接重定向到登录请求
+        resp.sendRedirect("login");
+    }
+}

src/com/landaiqing/servlet/VerifycodeServlet.java

@@ -0,0 +1,39 @@
+package com.landaiqing.servlet;
+
+import com.landaiqing.utils.RandomValidateCode;
+import jakarta.servlet.ServletException;
+import jakarta.servlet.annotation.WebServlet;
+import jakarta.servlet.http.HttpServlet;
+import jakarta.servlet.http.HttpServletRequest;
+import jakarta.servlet.http.HttpServletResponse;
+
+import java.io.IOException;
+
+/**
+ * 前台验证码处点击刷新,发送到该servlet的请求,
+ * 该servlet调用生成验证码的工具类返回一个图像验证码
+ */
+@WebServlet(name = "VerifycodeServlet", urlPatterns = "/VerifycodeServlet")
+public class VerifycodeServlet extends HttpServlet {
+    private static final long serialVersionUID = 1L;
+
+    public void doGet(HttpServletRequest request, HttpServletResponse response)
+            throws ServletException, IOException {
+        response.setContentType("image/jpeg");//设置相应类型,告诉浏览器输出的内容为图片
+        response.setHeader("Pragma", "No-cache");//设置响应头信息，告诉浏览器不要缓存此内容
+        //做浏览器兼容
+        response.setHeader("Cache-Control", "no-cache");
+        response.setDateHeader("Expire", 0);
+        RandomValidateCode randomValidateCode = new RandomValidateCode();
+        try {
+            randomValidateCode.getRandcode(request, response);//输出图片方法
+        } catch (Exception e) {
+            e.printStackTrace();
+        }
+    }
+
+    public void doPost(HttpServletRequest request, HttpServletResponse response)
+            throws ServletException, IOException {
+        doGet(request, response);
+    }
+}

src/com/landaiqing/utils/JdbcUtils.java

@@ -0,0 +1,141 @@
+package com.landaiqing.utils;
+
+
+        import java.io.InputStream;
+        import java.sql.*;
+        import java.util.Properties;
+
+/**
+ * @author 余胜军
+ * @ClassName MayiktJdbcUtils
+ * @qq 644064779
+ * @addres www.mayikt.com
+ * 微信:yushengjun644
+ */
+public class JdbcUtils {
+    /**
+     * 1.需要将我们的构造方法私有化 ---工具类 不需要 new出来 是通过类名称.方法名称访问
+     */
+    private JdbcUtils() {
+
+    }
+
+    /**
+     * 2.定义工具类 需要 声明 变量
+     */
+    private static String driverClass;
+    private static String url;
+    private static String user;
+    private static String password;
+
+    /**
+     *3.使用静态代码快 来给我们声明好 jdbc变量赋值（读取config.properties）
+     */
+    static {
+        try {
+            // 1.读取config.properties  IO 路径 相对路径
+            InputStream resourceAsStream = JdbcUtils.class.getClassLoader().
+                    getResourceAsStream("config.properties");
+            // 2.赋值给我们声明好的变量
+            Properties properties = new Properties();
+            properties.load(resourceAsStream);
+            driverClass = properties.getProperty("driverClass");
+            url = properties.getProperty("url");
+            user = properties.getProperty("user");
+            password = properties.getProperty("password");
+            // 3.注册驱动类
+            Class.forName(driverClass);
+        } catch (Exception e) {
+            e.printStackTrace();
+        }
+    }
+
+    /**
+     * 4.封装连接方法
+     */
+    public static Connection getConnection() throws SQLException {
+        Connection connection = DriverManager.getConnection(url, user, password);
+        return connection;
+    }
+
+    /**
+     * 5.封装释放连接方法 (重载)
+     */
+    public static void closeConnection(ResultSet resultSet, Statement statement, Connection connection) {
+        // 1.查询 释放连接 resultSet  statement connection
+        try {
+            if (resultSet != null)
+                resultSet.close();
+            if (statement != null)
+                statement.close();
+            if (connection != null)
+                connection.close();
+        } catch (Exception e) {
+            e.printStackTrace();
+        }
+
+    }
+
+    /**
+     * 增删改---释放jdbc资源
+     *
+     * @param statement
+     * @param connection
+     */
+    public static void closeConnection(Statement statement, Connection connection) {
+        // 1.查询 释放连接 resultSet  statement connection
+        closeConnection(null, statement, connection);
+    }
+
+    /**
+     * 开启事务
+     *
+     * @param connection
+     * @throws SQLException
+     */
+    public static void beginTransaction(Connection connection) throws SQLException {
+        connection.setAutoCommit(false);
+    }
+
+    /**
+     * 提交事务
+     *
+     * @param connection
+     * @throws SQLException
+     */
+    public static void commitTransaction(Connection connection) throws SQLException {
+        connection.commit();
+    }
+
+    /**
+     * 回滚事务
+     *
+     * @param connection
+     */
+    public static void rollBackTransaction(Connection connection) {
+        if (connection != null) {
+            try {
+                connection.rollback();
+            } catch (SQLException e) {
+                e.printStackTrace();
+            }
+        }
+    }
+
+    /**
+     * 关闭事务
+     *
+     * @param connection
+     */
+    public static void endTransaction(Connection connection) {
+        if (connection != null) {
+            try {
+                connection.setAutoCommit(true);
+            } catch (SQLException e) {
+                e.printStackTrace();
+            }
+        }
+    }
+
+}
+

src/com/landaiqing/utils/RandomValidateCode.java

@@ -0,0 +1,107 @@
+package com.landaiqing.utils;
+
+import jakarta.servlet.http.HttpServletRequest;
+import jakarta.servlet.http.HttpServletResponse;
+import jakarta.servlet.http.HttpSession;
+
+import java.awt.Color;
+import java.awt.Font;
+import java.awt.Graphics;
+import java.awt.image.BufferedImage;
+import java.util.Random;
+import javax.imageio.ImageIO;
+
+/**
+ * 工具类,生成随机验证码
+ */
+public class RandomValidateCode {
+    public static final String RANDOMVALIDATECODE = "RandomValidateCode";// 放到session中的key
+    private Random random = new Random();
+    private String randString = "0123456789abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ";//随机产生的字符串
+    private int width = 100;// 图片宽度
+    private int height = 26;// 图片高度
+    private int lineSize = 40;// 干扰线数量
+    private int stringNum = 4;// 随机产生的字符数量
+
+    /*
+     * 获得字体
+     */
+    private Font getFont() {
+        return new Font("Fixedsys", Font.CENTER_BASELINE, 18);
+    }
+
+    /*
+     * 获得颜色
+     */
+    private Color getRandColor(int fc, int bc) {
+        if (fc > 255)
+            fc = 255;
+        if (bc > 255)
+            bc = 255;
+        int r = fc + random.nextInt(bc - fc - 16);
+        int g = fc + random.nextInt(bc - fc - 14);
+        int b = fc + random.nextInt(bc - fc - 18);
+        return new Color(r, g, b);
+    }
+
+    /**
+     * 生成随机图片
+     */
+    public void getRandcode(HttpServletRequest request, HttpServletResponse response) {
+        HttpSession session = request.getSession();
+        // BufferedImage类是具有缓冲区的Image类,Image类是用于描述图像信息的类
+        BufferedImage image = new BufferedImage(width, height, BufferedImage.TYPE_INT_BGR);
+        Graphics g = image.getGraphics();// 产生Image对象的Graphics对象,该对象可以在图像上进行各种绘制操作
+        g.fillRect(0, 0, width, height);
+        g.setFont(new Font("Times New Roman", Font.ROMAN_BASELINE, 18));
+        g.setColor(getRandColor(110, 133));
+        // 绘制干扰线
+        for (int i = 0; i <= lineSize; i++) {
+            drowLine(g);
+        }
+        // 绘制随机字符
+        String randomString = "";
+        for (int i = 1; i <= stringNum; i++) {
+            randomString = drowString(g, randomString, i);
+        }
+        session.removeAttribute(RANDOMVALIDATECODE);
+        session.setAttribute(RANDOMVALIDATECODE, randomString);
+        g.dispose();
+        try {
+            ImageIO.write(image, "JPEG", response.getOutputStream());// 将内存中的图片通过流动形式输出到客户端
+        } catch (Exception e) {
+            e.printStackTrace();
+        }
+    }
+
+    /*
+     * 绘制字符串
+     */
+    private String drowString(Graphics g, String randomString, int i) {
+        g.setFont(getFont());
+        g.setColor(new Color(random.nextInt(101), random.nextInt(111), random.nextInt(121)));
+        String rand = getRandomString(random.nextInt(randString.length()));
+        randomString += rand;
+        g.translate(random.nextInt(3), random.nextInt(3));
+        g.drawString(rand, 13 * i, 16);
+        return randomString;
+    }
+
+    /*
+     * 绘制干扰线
+     */
+    private void drowLine(Graphics g) {
+        int x = random.nextInt(width);
+        int y = random.nextInt(height);
+        int xl = random.nextInt(13);
+        int yl = random.nextInt(15);
+        g.drawLine(x, y, x + xl, y + yl);
+    }
+
+    /*
+     * 获取随机的字符
+     */
+    public String getRandomString(int num) {
+        return String.valueOf(randString.charAt(num));
+    }
+}

src/config.properties

@@ -0,0 +1,4 @@
+driverClass=com.mysql.cj.jdbc.Driver
+url=jdbc:mysql://127.0.0.1:3306/testdb?serverTimezone=GMT%2B8
+user=root
+password=1611

web/WEB-INF/web.xml

@@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<web-app xmlns="http://xmlns.jcp.org/xml/ns/javaee"
+         xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
+         xsi:schemaLocation="http://xmlns.jcp.org/xml/ns/javaee http://xmlns.jcp.org/xml/ns/javaee/web-app_4_0.xsd"
+         version="4.0">
+</web-app>

web/index.jsp

@@ -0,0 +1,16 @@
+<%--
+  Created by IntelliJ IDEA.
+  User: LDQ
+  Date: 2023/6/6
+  Time: 22:11
+  To change this template use File | Settings | File Templates.
+--%>
+<%@ page contentType="text/html;charset=UTF-8" language="java" %>
+<html>
+  <head>
+    <title>$Title$</title>
+  </head>
+  <body>
+  ${user.userName}
+  </body>
+</html>

web/login.jsp

@@ -0,0 +1,22 @@
+<%--
+  Created by IntelliJ IDEA.
+  User: mayikt
+  Date: 2022/6/6
+  Time: 17:12
+  To change this template use File | Settings | File Templates.
+--%>
+<%@ page contentType="text/html;charset=UTF-8" language="java" %>
+<!DOCTYPE html>
+<html>
+<head>
+  <title>登录测试页面</title>
+  <form action="/JavaWeb_Login_Register_war_exploded/login" method="post">
+    <label>用户名: </label><input type="text" name="userName" value="${cookie.userName.value}"/><br>
+    <label>密&nbsp码&nbsp: </label><input type="password" name="userPwd" value="${cookie.userPwd.value}"/><br>
+    <label>记住密码: </label><input type="checkbox" name="rememberPassword"/><br>
+    ${errorMsg}
+    <input type="submit" value="登录 "/>
+  </form>
+
+</head>
+</html>

web/register.jsp

@@ -0,0 +1,41 @@
+<%--
+  Created by IntelliJ IDEA.
+  User: mayikt
+  Date: 2022/6/6
+  Time: 17:12
+  To change this template use File | Settings | File Templates.
+--%>
+<%@ page contentType="text/html;charset=UTF-8" language="java" %>
+<!DOCTYPE html>
+<html>
+<head>
+    <title>注册页面</title>
+    <form action="/JavaWeb_Login_Register_war_exploded/register" method="post">
+        <label>用户名: </label><input type="text" name="userName"/><br>
+        <label>密&nbsp&nbsp&nbsp码: </label><input type="password" name="userPwd"/><br>
+        <label>验证码: </label><input type="text" name="code"/><img id="exchangecode" src="VerifycodeServlet">
+        <a id="ecode" href="#">看不清？换一张图片</a><br>
+        <span style="color: red">${errorMsg}</span>
+        <input type="submit" value="注册"/>
+    </form>
+    <script type="text/javascript">
+        window.onload = function () {
+            //获取img标签的对象
+            img = document.getElementById("exchangecode");
+            img.onclick = function () {
+                //加时间戳,避免浏览器缓存
+                var date = new Date().getTime()
+                img.src = "VerifycodeServlet?" + date;
+            }
+            //获取a标签的对象
+            ec = document.getElementById("ecode");
+            ec.onclick = function () {
+                //加时间戳
+                var date = new Date().getTime()
+                img.src = "VerifycodeServlet?" + date;
+            }
+        }
+
+    </script>
+</head>
+</html>