JavaWeb简单用户登录注册实例代码(有验证码)

2024-09-27 09:01:25

需求

编写login登录界面(用户名，密码，验证码，登陆按钮，注册按钮)
设计关系数据库(编号，用户名，密码)
编写注册功能，将数据存储在数据库中。（姓名不能重复，设为主键，重复会注册失败）
编写登录功能。首先获取验证码，先判断验证码是否正确，不正确则显示验证码错误。验证码正确后再获取用户名和密码，进行数据库的搜索比对，若正确则重定向到成功的界面，并且将用户名显示。

jar包

技术选型
Servlet + JSP + Mysql + JDBCTemplate + Druid + BeanUtils + Tomcat

效果图

验证码或者用户名和密码错误

Navicat Premium 显示Mysql内容

登录成功

注册功能

源码

登录主界面 login.jsp

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

  <script>
  <%-- 增加时间戳来更换验证码图片 --%>
    window.onload=function(){
      document.getElementById("img").onclick=function(){
        this.src = "/daydayup/checkCodeServlet?time" + new Date().getTime();
      }
    }

<%-- 用于打开注册的窗口--%>
    function reg() {
      window.open("register.jsp");
    }
  </script>
  <style>
    div{
      color: red;
    }
  </style>
</head>
<body>

<form action="/daydayup/loginServlet" method="post">
  <table>
    <tr>
      <td>用户名</td>
      <td><input type="text" name="username"></td>
    </tr>
    <tr>
      <td>密码</td>
      <td><input type="text" name="password"></td>
    </tr>
    <tr>
      <td>验证码</td>
      <td><input type="text" name="checkcode"></td>
    </tr>
    <tr>
      <td colspan="2"><img id="img" src="/daydayup/checkCodeServlet" alt=""></td>
    </tr>
    <tr>
      <td><input type="submit" value="登录"></td>
      <td><input type="button" value="注册" onclick="reg()" ></td>

    </tr>
  </table>
</form>

<div>${requestScope.login_error}</div>
<div>${requestScope.checkcode_error}</div>
</body>
</html>

注册界面 register.jsp

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
  <title>Title</title>
</head>
<body>
<form action="/daydayup/registerServlet" method="post">
  <table>
    <tr>
      <td>用户名</td>
      <td><input type="text" name="username"></td>
    </tr>
    <tr>
      <td>密码</td>
      <td><input type="text" name="password"></td>
    </tr>
    <tr>
      <td><input type="submit" value="确定注册"></td>
    </tr>
  </table>
</form>
<div>${requestScope.register_success}</div>
<div>${requestScope.register_error}</div>
</body>
</html>

成功界面 success.jsp

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
  <title>Title</title>
</head>
<body>
<%--  <h1>${requestScope.user},欢迎您</h1>  --%>
  <h1><%=request.getSession().getAttribute("user")%>,欢迎您</h1>
</body>
</html>

先编辑好JDBCUtils工具类

package cn.code.util;

import com.alibaba.druid.pool.DruidDataSourceFactory;

import javax.sql.DataSource;
import java.io.IOException;
import java.io.InputStream;
import java.sql.Connection;
import java.sql.SQLException;
import java.util.Properties;

/**
 * JDBC工具类 使用Durid连接池
 */
public class JDBCUtils {

  private static DataSource ds;

  static{
    try {
      //加载配置文件
      Properties pro = new Properties();
      //使用ClassLoader加载配置文件，获取字节输入流
      InputStream is = JDBCUtils.class.getClassLoader().getResourceAsStream("druid.properties");
      pro.load(is);

      //初始化连接池对象
      ds = DruidDataSourceFactory.createDataSource(pro);
    } catch (Exception e) {
      e.printStackTrace();
    }

  }

  /**
   * 获取连接池对象
   */
  public static DataSource getDataSource(){
    return ds;
  }
  /**
   * 获取连接connection对象
   */
  public static Connection getConnection() throws SQLException {
    return ds.getConnection();
  }
}

创建我们的用户类实体User

package cn.code.domain;

/*
用户的实体类
 */

public class User {
  private int id ;
  private String username;
  private String password;

  public int getId() {
    return id;
  }

  public void setId(int id) {
    this.id = id;
  }

  public String getUsername() {
    return username;
  }

  public void setUsername(String username) {
    this.username = username;
  }

  public String getPassword() {
    return password;
  }

  public void setPassword(String password) {
    this.password = password;
  }

  @Override
  public String toString() {
    return "User{" +
        "id=" + id +
        ", username='" + username + '\'' +
        ", password='" + password + '\'' +
        '}';
  }
}

编写Dao来操作数据库，里面有login和add两个方法 Userdao

package cn.code.dao;

import cn.code.domain.User;
import cn.code.util.JDBCUtils;
import org.springframework.dao.DataAccessException;
import org.springframework.jdbc.core.BeanPropertyRowMapper;
import org.springframework.jdbc.core.JdbcTemplate;

import java.sql.Connection;
import java.sql.SQLException;
import java.sql.Statement;

/**
 * 操作数据库中User表的类
 */
public class UserDao {

  //声明JDBCTemplate对象，以便方法公用
  private JdbcTemplate template = new JdbcTemplate(JDBCUtils.getDataSource());

  /**
   * 登录方法
   *
   * @param loginUser 目前只有用户名和密码
   * @return user包含用户全部数据
   */
  public User login(User loginUser) {
    //编写SQL
    String sql = "select * from user where username = ? and password = ?";
    //调用query方法
    try {
      User user = template.queryForObject(sql,
          new BeanPropertyRowMapper<User>(User.class),
          loginUser.getUsername(), loginUser.getPassword());
      return user;
    } catch (DataAccessException e) {
      e.printStackTrace();
      return null;
    }
  }

  /**
   * 注册方法
   *
   * @param user 目前只包含用户名和密码
   * @return 是否注册成功
   */
  public boolean add(User user){
    //编写SQL
    String sql = "insert into user (username,password) VALUES('" + user.getUsername() + "','" + user.getPassword() + "')";
    boolean flag = false;
    int num = 0;
    try {
      //创建数据库连接
      Connection conn = JDBCUtils.getConnection();
      Statement state = null;
      flag = false;
      num = 0;

      state = conn.createStatement();
      num = state.executeUpdate(sql);
    } catch (SQLException e) {
      e.printStackTrace();
    }

    if(num >0) flag = true;
    return flag;
  }
}

登录的Servlet

package cn.code.servlet;

import cn.code.dao.UserDao;
import cn.code.domain.User;

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 javax.servlet.http.HttpSession;
import java.io.IOException;

@WebServlet("/loginServlet")
public class LoginServlet extends HttpServlet {
  protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
    //设置字符编码
    request.setCharacterEncoding("utf-8");
    //获取参数
    String username = request.getParameter("username");
    String password = request.getParameter("password");
    String checkcode = request.getParameter("checkcode");
    //获取生成的验证码
    HttpSession session = request.getSession();
    String checkcode_session =(String) session.getAttribute("checkcode_session");
    //防止验证码存储 删除Session中存储的验证码
    session.removeAttribute("checkcode_session");

    //判断验证码是否正确
    if(checkcode_session != null && checkcode_session.equalsIgnoreCase(checkcode)){
      //equalsIgnoreCase忽略大小写的比较
      //验证码正确
      User loginUser = new User();
      loginUser.setUsername(username);
      loginUser.setPassword(password);
      User user = new UserDao().login(loginUser);

      if(user != null){
        //用户名以及密码正确
        //登录成功
        //存储用户信息
        session.setAttribute("user",username); //因为是两次请求，所以用Session
        //重定向到success.jsp
        response.sendRedirect(request.getContextPath()+"/success.jsp");
      }else{
        //用户名及密码错误
        //登录失败
        //存储提示信息到request
        request.setAttribute("login_error","用户名或密码错误");
        //转发到登录页面
        request.getRequestDispatcher("/login.jsp").forward(request,response);
      }
    }else{
      //验证码不正确
      //存储提示信息到request
      request.setAttribute("checkcode_error","验证码错误");
      //转发到登录页面
      request.getRequestDispatcher("/login.jsp").forward(request,response);
    }

  }

  protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
    this.doPost(request, response);
  }
}

注册的Servlet

package cn.code.servlet;

import cn.code.dao.UserDao;
import cn.code.domain.User;

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;

@WebServlet("/registerServlet")
public class RegisterServlet extends HttpServlet {
  protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
    request.setCharacterEncoding("utf-8");

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

    User registerUser = new User();
    registerUser.setUsername(username);
    registerUser.setPassword(password);
    boolean flag = new UserDao().add(registerUser);
    if(flag) {
      request.setAttribute("register_success","注册成功");
      request.getRequestDispatcher("/register.jsp").forward(request,response);
    }else{
      request.setAttribute("register_error","账号以被注册,注册失败");
      request.getRequestDispatcher("/register.jsp").forward(request,response);
    }

  }

  protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
    this.doPost(request,response);
  }
}

在页面中画验证码（可点击更换）Servlet

package cn.code.checkcode;

import javax.imageio.ImageIO;
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.awt.*;
import java.awt.image.BufferedImage;
import java.io.IOException;
import java.util.Random;

//简易验证码
@WebServlet("/checkCodeServlet")
public class CheckCodeServlet extends HttpServlet {
  protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
    int width = 100;
    int height = 50;
    //创建一对象，在内存中代表图片（验证码图片对象）
    BufferedImage image = new BufferedImage(width,height,BufferedImage.TYPE_INT_BGR);

    //美化图片
    //填充背景色
    Graphics g = image.getGraphics();//画笔对象
    g.setColor(Color.ORANGE);
    g.fillRect(0,0,width,height);
    //画边框
    g.setColor(Color.BLUE);
    g.drawRect(0,0,width-1,height-1);

    String str = "QWERTYUIOPASDFGHJKLZXCVBNM1234567890zxcvbnmlkjhgfdsaqwertyuiop";

    //生成随机角标
    StringBuilder sb = new StringBuilder();
    Random ran = new Random();
    for (int i = 1; i <= 4; i++) {
      int index = ran.nextInt(str.length());
      //获取字符
      char ch = str.charAt(index);
      sb.append(ch);
      //写验证码
      g.drawString(ch+"",width/5*i,height/2);
    }
    String checkcode_session = sb.toString();
    //将验证码存入session
    request.getSession().setAttribute("checkcode_session",checkcode_session);

    //画干扰线
    g.setColor(Color.RED);
    //随机生成坐标点
    for (int i = 0 ;i<6;i++) {
      int x1 = ran.nextInt(width);
      int x2 = ran.nextInt(width);
      int y1 = ran.nextInt(height);
      int y2 = ran.nextInt(height);
      g.drawLine(x1,y1,x2,y2);
    }
    //将图片输出到页面展示
    ImageIO.write(image, "jpg", response.getOutputStream());
  }

  protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
    this.doPost(request, response);
  }
}

到此这篇关于JavaWeb简单用户登录注册实例代码(有验证码)的文章就介绍到这了,更多相关JavaWeb 用户登录注册内容请搜索我们以前的文章或继续浏览下面的相关文章希望大家以后多多支持我们！

JavaWeb实现用户登录注册功能实例代码(基于Servlet+JSP+JavaBean模式)

下面通过通过图文并茂的方式给大家介绍JavaWeb实现用户登录注册功能实例代码,一起看看吧. 一.Servlet+JSP+JavaBean开发模式(MVC)介绍 Servlet+JSP+JavaBean模式(MVC)适合开发复杂的web应用,在这种模式下,servlet负责处理用户请求,jsp负责数据显示,javabean负责封装数据. Servlet+JSP+JavaBean模式程序各个模块之间层次清晰,web开发推荐采用此种模式. 这里以一个最常用的用户登录注册程序来讲解Servlet+JS
JavaWeb简单用户登录注册实例代码(有验证码)

需求编写login登录界面(用户名,密码,验证码,登陆按钮,注册按钮) 设计关系数据库(编号,用户名,密码) 编写注册功能,将数据存储在数据库中.(姓名不能重复,设为主键,重复会注册失败) 编写登录功能 .首先获取验证码,先判断验证码是否正确,不正确则显示验证码错误.验证码正确后再获取用户名和密码,进行数据库的搜索比对,若正确则重定向到成功的界面,并且将用户名显示. jar包技术选型 Servlet + JSP + Mysql + JDBCTemplate + Druid + BeanUti
基于IO版的用户登录注册实例(Java)

今天学的是用户登录注册功能. 4个包: itcast.cn.user包 User.java 用户类,描述用户基本信息,包括成员变量,无参构造函数,带参构造(可有可无).get和set方法 package itcast.cn.day22; /* * 用户基本描述包类 */ public class User { private int userName; private int passWord; public User(){ super(); } public User(int userName
Servlet实现简单的用户登录功能实例代码

1.创建html界面 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> <form action="" method="post"> 用户名:<input type=&
Vue学习之路之登录注册实例代码

根据Vue.js + Element UI + MongoDB进行开发 P1 安装Vue-CLI Vue.js文档利用Vue.js提供的一个官方命令行工具 # 全局安装 vue-cli $ npm install --global vue-cli # 创建一个基于 webpack 模板的新项目 $ vue init webpack my-project # 安装依赖,走你 $ cd my-project $ npm install $ npm run dev Vue.js 主要目录结构 . ├
Vue中保存用户登录状态实例代码

首先我们假设,这里的登录组件(register.vue)是App.vue组件的子组件,是通过路由进入登录组件的. 登录组件中用户点击登录后,后台会传过来一个用户名,我的App.vue组件中需要拿到这个用户名,并将上面的"登录注册"字样变为"用户名". 为了保证用户刷新后用户名不会消失,这里我用到了sessionStorage 代码如下: register.vue中用户点击登录触发signIn方法 signIn(){ this.formData = $(".
使用JSP实现简单的用户登录注册页面示例代码解析

实验要求: 将实验2中的系统用户登录和注册页面改为JSP页面,并部署自己的Web应用于Tomcat服务器中具体要求: 完成登录JSP页面设计和注册页面设计在登录页面表单中使用request对象获取用户信息,建立新的JSP页面完成登录验证(用户名和密码自己指定即可). 验证结果显示(如登录成功/用户名密码错误,可以使用JavaScript,也可以使用新的JSP页面). 在注册页面表单中使用request对象获取用户注册信息(注册项目由自己指定),在新的JSP页面显示用户注册信息,并提示注册成功
JavaWeb实现用户登录与注册功能

本文实例为大家分享了JavaWeb实现用户登录与注册的具体代码,供大家参考,具体内容如下所用知识客户端:HTML CSS JS (JQuery) 服务器:JAVA基础 JSP Servlet JDBC Tomcat 数据库:MySQL 用到的Jar包 druid数据库连接池 dbutils JDBC数据库操作工具 MySQL jar包实现效果基本为注册用户,注册成功将数据写入数据库,登录过程查看数据库中是的用户名,密码是否匹配,匹配跳转到登录成功页面,失败返回登录页面. 思路
JavaWeb实现用户登录与注册功能（服务器）

本文实例为大家分享了JavaWeb实现用户登录与注册功能的具体代码,供大家参考,具体内容如下用到的知识客户端:HTML CSS JS (JQuery) 服务器:JAVA基础 JSP Servlet JDBC Tomcat 数据库:MySQL 用到的Jar包 druid数据库连接池 dbutils JDBC数据库操作工具 MySQL jar包总体结构: 客户端数据库部分网址思路: 服务器部分采用JavaEE三层架构 (1).表现层:通俗讲就是展现给用户的界面,即用户在使用一个
JavaWeb实现用户登录与注册功能(服务器)

本文实例为大家分享了JavaWeb实现用户登录与注册功能的具体代码,供大家参考,具体内容如下用到的知识客户端:HTML CSS JS (JQuery) 服务器:JAVA基础 JSP Servlet JDBC Tomcat 数据库:MySQL 用到的Jar包 druid数据库连接池 dbutils JDBC数据库操作工具 MySQL jar包总体结构: 客户端数据库部分网址思路: 服务器部分采用JavaEE三层架构 (1).表现层:通俗讲就是展现给用户的界面,即用户在使用一个

JavaWeb简单用户登录注册实例代码(有验证码)

相关推荐

随机推荐