Java Web实现登录注册(超详细附代码)

news2024/11/18 17:46:27

Java Web实现登录注册(超详细附代码)

文章目录

  • Java Web实现登录注册(超详细附代码)
    • 1.前言
    • 2.登录注册设计流程
    • 3.注册的数据流程
    • 4.登录的数据流程
    • 5.部分代码的展示
      • 5.1注册
      • 5.2登录
    • 6.总结

1.前言

相信刚学Javaweb的小伙伴第一个接触的个人小项目都是从项目的登录注册开始的。
下面一个小项目中的登录注册将会带大家从零开始学习怎么设计登录注册流程.

2.登录注册设计流程

登录注册设计流程

3.注册的数据流程

那么我们的前端数据是怎么传向后端的?
1.首先这里我们是用 表单传递 通过form提交
在这里插入图片描述

2.在这里,我们输入自己的姓名和密码,点击注册按钮。此时输入的这三个数据,我们可以看做成是一个表单的数据,这些数据会提交到服务器上:

3.此时,一个叫Tomcat的东西会处理这个请求,
4.得到请求之后,Tomcat会将这个请求交由Servlet来进行处理
5.Servlet调用Dao层写的各种实现方法,与数据库进行交互(curd调用仔)
那么下面就是注册操作的主要调用流程图

register.jsp
registServlet
UserDB

第一步
在这里插入图片描述

第二步
在这里插入图片描述

第三步
在这里插入图片描述

4.登录的数据流程

登录操作的主要调用流程图

Login.jsp
LoginServlet
UserDB

在这里插入图片描述
第一步
在这里插入图片描述

第二步
在这里插入图片描述

第三步
在这里插入图片描述

第四步
在这里插入图片描述

5.部分代码的展示

5.1注册

register.jsp注册页面
通过表单实现跳转到servlet

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width",initial->
    <link rel="stylesheet" href="style.css">
    <title>world message board of the future</title>
</head>

<body background="pictures/02.jpg">
<div class="form-wrapper">
    <div class="header">
        Register
	</div>
	<form action="RegistServlet" method = "post">
	<!-- 浏览者单击发送按钮发送表单的时候,隐藏域的信息也被一起发送到服务器。 -->
		<input type="hidden" name="action" value="regist">
    <div class="input-wrapper">
    	<div class="border-wrapper">
        	<input type="text" name="username" placeholder="username" class="border-item">
    	</div>
        <div class="border-wrapper">
            <input type="text" name="password" placeholder="password" class="border-item">
		</div>
	<div class="border-wrapper">
		<input type="password" name="password2" placeholder="Confirm password" class="border-item">
	</div>
	<div class="action">
		<input type="submit" name="regist" class="btn" value="Regist" ><br>
	</div>
	</div>
	</form>
	<center>
		<!-- 获取注册是否成功信息 -->
		<p class="col">${message}</p>
	</center>
	</div>
</body>
</html>

RegisterServlet.java
业务层:处理注册业务

package Sevlet;

import java.io.IOException;
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 javaBean.User;
import useBean.UserDB;

@WebServlet("/RegistServlet")
public class RegistServlet extends HttpServlet {
	private static final long serialVersionUID = 1L;
	String message ="";
       
    public RegistServlet() {
        super();
    }

	protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
		request.setCharacterEncoding("utf-8");
		//获取隐藏域的信息
		String action = request.getParameter("action");
		String url ="register.jsp";
		
		if(action.equals("regist")) 
			url = registerUser(request,response);
		getServletContext().getRequestDispatcher(url).forward(request, response);
	}
	//注册函数
	private String registerUser(HttpServletRequest request,HttpServletResponse response) {
		String username = request.getParameter("username"); 
		String password = request.getParameter("password");
		String password2 = request.getParameter("password2");
		String message = "";
		//得到HttpSession类型的对象
		HttpSession session = request.getSession();
		//将数据存储于User对象
		User user = new User();
		user.setusername (username); 
		user.setpassword(password);
		String url = "/login.jsp";
		if(password.equals(password2))
		{
			if( !UserDB.UserExists(username) ) {
				message = "Registration successful! and login in";
				session.setAttribute("message", message);
				//将注册用户信息写入数据库
				UserDB.insert(user);
				return url;
			}
			else
			{
				message = "The user name already exists";
				url = "/register.jsp";
				session.setAttribute("message", message);
				return url;
			}
		}
		else 
		{
			message = "The password is inconsistent";
			session.setAttribute("message", message);
			url = "/register.jsp";
			return url;
		}
	}
}

Dao层实现判断用户名是否存在和插入数据库的方法
UserDB.java

    //注册时判断用户名是否存在
	public static boolean UserExists(String username) {
		//可以建立一个连接池保存一定数量的连接,当有对象需要数据库连接时,直接将这个连接返回给该对象,
		ConnectionPool pool = ConnectionPool.getInstance();
		Connection connection = pool.getConnection();
		PreparedStatement ps = null;
		ResultSet rs = null;
		
		String qr = "SELECT username FROM User "+ "WHERE username = ?";
		try {
			ps = connection.prepareStatement(qr);
			ps.setString(1, username);
			rs = ps.executeQuery();
			return rs.next();
		} catch (SQLException e) {
			System.out.println(e);
			return false;
		} finally {
			DBUtil.closeResultSet(rs);
			DBUtil.closePreparedStatement(ps);
			pool.freeConnection(connection);
		}
		
	}
	//将注册用户信息保存至数据库
	public static int insert(User user) {
		ConnectionPool pool = ConnectionPool.getInstance();
		Connection connection = pool.getConnection();
		PreparedStatement ps = null;
		
		String qr = "INSERT INTO User (username, password)"+"VALUES (?, ?)";
		try { 
			
			ps = connection.prepareStatement(qr);
			ps.setString(1, user.getusername());
			ps.setString(2, user.getpassword());
			
			return ps.executeUpdate();
		} catch (SQLException e) {
			System.out.println(e);
			return 0;
		} finally {
			DBUtil.closePreparedStatement(ps);
			pool.freeConnection(connection);
		} 
		
	}
	

5.2登录

login.jsp登录界面
通过表单实现跳转到servlet

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width",initial->
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <link rel="stylesheet" href="style.css">
    <title>world message board of the future</title>
</head>

<body background="pictures/01.jpg">
<div class="form-wrapper">
    <div class="header">
        login
	</div>
	<form action="LoginServlet" method = "post"><!--form表单,你提交后,会跳转到LoginServlet  -->
		<!-- 浏览者单击发送按钮发送表单的时候,隐藏域的信息也被一起发送到服务器。 -->
		<input type="hidden" name="action" value="login">
    <div class="input-wrapper">
    	<div class="border-wrapper">
        	<input type="text" name="username" placeholder="input username" class="border-item">
    	</div>
        <div class="border-wrapper">
            <input type="password" name="password" placeholder="password" class="border-item">
        </div>
      
    </div>
	<div class="action">
		<input type="submit" name="login" class="btn" value="Sign in" ><br>
		<button type="submit" formaction="register.jsp"  class="btn">register</button>
	</div>
	</form>
	<center>
		<!-- 获取登录是否成功信息 -->
		<p class="col">${message}</p>
	</center>
</div>
</body>
</html>

LoginServlet.java
业务层:处理登录业务

package Sevlet;

import java.io.IOException;
import java.util.List;

import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.Cookie;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import javax.servlet.http.HttpSession;

import javaBean.Message;
import javaBean.User;
import useBean.UserDB;
/**
 * Servlet implementation class Login
 */
@WebServlet("/LoginServlet")//读取/LoginServlet完整路径
public class LoginServlet extends HttpServlet {
	private static final long serialVersionUID = 1L;
	String message="";//定义一个变量
    public LoginServlet() {
        super();
    }

	protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
		String url ="/login.jsp";
		String action = request.getParameter("action");
		System.out.println("action: " + action);//打印测试
		//设置编码
		request.setCharacterEncoding("utf-8");
		//检测页面是否完成提交
		if(action == null)
			url="/login.jsp";
		else if(action.equals("login"))
		//调用login()函数返回一个路径
			url = login(request,response);
		//设置登入是否成功的提示信息
		request.setAttribute("message", message);
		//调用forward()方法,转发请求 
		getServletContext().getRequestDispatcher(url).forward(request, response);
	}
	
	//login()函数
	private String login(HttpServletRequest request, HttpServletResponse response) {
		//获取登入的信息(姓名和密码)
		String username = request.getParameter("username");
		String password = request.getParameter("password");
		//得到HttpSession类型的对象
		HttpSession session = request.getSession();
		String userid="";
		//通过名字得出user的信息
		User user = UserDB.selectUser(username);

		String url = "/register.jsp";
		if(user != null) {
			//用户存在,比较密码
			if(user.getpassword().equals(password)) {
				//用于记录该用户状态
				//cookie加入用户名
				Cookie u = new Cookie("userid",username);
				//设置有效期
				u.setMaxAge(60*60*24*365*2);
				//设置路径
				u.setPath("/");
				//将cookie加入浏览器
				response.addCookie(u);
				
				userid = user.getid();
				session.setAttribute("userid", userid);
				//调用selectU从message表中读出所有数据
				List<Message> mL = UserDB.selectU(); 
				//返回ml信息
				request.setAttribute("MessageList", mL);
				url="/MessageList.jsp";
				
			}
			else {
				message = "Wrong password";
				url="/login.jsp";
			}
		}
		else {
			message = "The user does not exist";
			url = "/login.jsp";
		}
		return url;		
	}	
}

UserDB.java
Dao层实现查找用户的方法DB.java

	
	//登录时根据username读出user
	public static User selectUser(String username) {
		//可以建立一个连接池保存一定数量的连接,当有对象需要数据库连接时,直接将这个连接返回给该对象,
		ConnectionPool pool = ConnectionPool.getInstance();
		Connection connection = pool.getConnection();
		PreparedStatement ps = null;
		ResultSet rs = null;
		//sql语句
		String qr = "SELECT * FROM User "+ "WHERE username = ?";
		try {
			ps = connection.prepareStatement(qr);
			//sql语句中问号的解释
			ps.setString(1, username);
			rs = ps.executeQuery();
			User user = null;
			if (rs.next()) {
				user = new User ();
				//设置userd的id,username,passward
				user.setid(rs.getString("id"));
				user.setusername(rs.getString("username"));
				user.setpassword(rs.getString("password"));
			}
			return user;
		} catch (SQLException e) {
			System.out.println(e);
			return null;
			} finally {
				//关闭PreparedStatement和ResultSet并释放连接池中此次连接
				DBUtil.closeResultSet(rs);
				DBUtil.closePreparedStatement(ps);
				pool.freeConnection(connection);
			}
	}
	

6.总结

以上所有登录注册源代码来自本人的一个项目,感兴趣的小伙伴可以在评论区留言。十分愿意与大家分享共同学习。欢迎批评指正!

Java web实现video播放
在这里插入图片描述

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/409466.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

30个极致实用的谷歌浏览器插件,让你开发事半功倍

浏览器是开发人员最强大的工具。99% 的人不会 100% 地利用他们的浏览器。这里有 30 个浏览器扩展&#xff0c;如果你能合理充分利用将大大提升你的开发效率。1. WhatFont"WhatFont"&#xff0c;是一款帮助用户快速识别网页中字体信息的工具。当你在浏览网页时&#x…

vue|axios发送post请求详解

axios发送Post请求 首先我们要知道发送一个请求体的时候我们要明确发送的类型是什么&#xff0c;常见的类型有三种 form-dataapplication/jsonapplication/x-www-form-urlencoded 以上三种类型是进行数据传输的数据类型&#xff0c;我们知道在js代码中的对象都不是以上的三种…

react实现路由跳转

react通过路由实现页面跳转&#xff1a; ​ 函数式路由(withRouter)使用原生js方法实现路由功能。 ​ eg&#xff1a;export default withRouter(Home) Home是组件名称。 示例&#xff1a;class Home extends Component{<button onClick{this.goForward}>下一级</bu…

猿创征文|【C++游戏引擎Easy2D】炫酷动画来这学,位移动画构造函数让节点执行动画

&#x1f9db;‍♂️iecne个人主页&#xff1a;&#xff1a;iecne的学习日志 &#x1f4a1;每天关注iecne的作品&#xff0c;一起进步 &#x1f4aa;学C必看iecne 本文专栏&#xff1a;【C游戏引擎】. &#x1f433;希望大家多多支持&#x1f970;一起进步呀&#xff01; ✨前…

from origin ‘null‘ has been blocked by CORS policy: Cross origin requests are only supported for ...

跨源资源请求问题解决方案 问题描述&#xff1a;当我们在vsCode中使用 open in brower插件打开html文件文件时&#xff0c;就会报错 xxx已被CORS策略阻止&#xff0c;引入的资源还会失效。 解决办法1 :Live Server插件 在vsCode的插件市场中搜索并安装Live Server插件&#x…

Axios

Axios是Ajax的一个框架&#xff0c;简化Ajax操作 一、基本操作 Axios执行Ajax的操作&#xff1a; 1. 添加axios的js文件 <script language"JavaScript" src"script/axios.min.js"></script> 2.1 客户端向服务端异步发送普通参数值 格式&am…

vue-router报错: uncaught error during route navigation

bug场景&#xff1a; H5项目中,浏览器流程走的通,ios流程走得通,安卓机有的可以有的不行 报错信息&#xff1a; 提示&#xff1a;这里描述项目中遇到的问题&#xff1a; 例如&#xff1a;数据传输过程中数据不时出现丢失的情况&#xff0c;偶尔会丢失一部分数据 APP 中接收数…

尚融宝06-ECMAScript基本介绍和使用

目录 一、ECMAScript 1、ECMA 2、ECMAScript 3、什么是 ECMA-262 4、ECMA-262 历史 5、ECMAScript 和 JavaScript 的关系 二、基本语法 1、let声明变量 2、const声明常量 3、解构赋值 4、模板字符串 5、声明对象简写 6、定义方法简写 7、参数的默认值 8、对象拓…

less变量

Less变量一、Less简介二、Less中的变量三、less外部引入一、Less简介 1.Less是一门css的预处理语言&#xff0c;less是一个css的增强版&#xff0c;通过less可以编写更少的代码实现更强大的样式。 变量名以两条短横线命名 例如&#xff1a; --color&#xff1a;red 2.Less特…

vue的created函数中方法执行的顺序设置方法

1.vue的created钩子函数中&#xff0c;方法的执行顺序 1.1情景&#xff1a;vue框架中通常在created钩子函数里执行访问数据库的方法&#xff0c;然后返回数据给前端&#xff0c;前端data中定义全局变量接收数据 1.2误区&#xff1a;我们可能会思考按照自己设定好的逻辑走&…

使用uni-app的uni.chooseImage获取的图片路径,存储到数据库中,无法在前端展示该路径的图片

html,js,uni-app, 首先我在uni-app中使用如下方法添加图片 uni.chooseImage({count: 1, //count: 6, //默认9sizeType: [original, compressed], //可以指定是原图还是压缩图&#xff0c;默认二者都有sourceType: [album], //从相册选择success: function(res) {console.log(…

【vue2】vue2中的性能优化(持续更新中)

⭐ v-for 遍历避免同时使用 v-if ⭐ v-for 中的key绑定唯一的值 ⭐ v-show与v-if对性能的影响 ⭐ 妙用计算属性 ⭐ 使用防抖与节流控制发送频率 ⭐ 路由守卫处理请求避免重复发送请求 ⭐ 使用第三方UI库的引入方式 【前言】 该系列是博主在使用vue2开发项目中常用上的一…

JavaScript ,18种常用数组方法,快来看看你会吗?

前言 众所周知&#xff0c;向后端请求数据&#xff0c;处理数据是前端工程师必备的技能&#xff0c;从后端请求回来的数据往往是数组的形式返回到前端&#xff0c;因此数组处理方法的重要性可想而知&#xff1b;数组的处理方法在MDN文档上很多&#xff0c;很多朋友在学习时往往…

vue配置代理服务器proxy

一、跨域。 跨域本质是浏览器基于同源策略的一种安全手段 所谓同源&#xff08;即指在同一个域&#xff09;具有以下三个相同点 协议相同&#xff08;protocol&#xff09;主机相同&#xff08;host&#xff09;端口相同&#xff08;port&#xff09; 非同源请求&#xff0c…

vue集成海康h5player实现播放

文章目录前言准备工作视频demo官方文档官方工具开源工具开始开发效果问题点前言 本篇章只针对官方提供个h5player工具&#xff0c;做播放和分屏demo。 当然本篇章也是针对已经接触了海康视频对接的开发者。 准备工作 视频demo 官方文档 API https://open.hikvision.com/d…

Not allowed to load local resource: file:///,浏览器禁止访问浏览器图片,文件解决方法

Not allowed to load local resource: file… 错误出现原因&#xff1a;浏览器出于安全考虑禁止直接读取本机文件(链接以file:///开头)&#xff0c; 解决办法&#xff1a; 创建一个web服务器&#xff0c;将文件放在这个服务器里&#xff0c;让文件有一个在线地址&#xff08…

【小程序项目开发-- 京东商城】uni-app之商品列表页面 (下)

&#x1f935;‍♂️ 个人主页: 计算机魔术师 &#x1f468;‍&#x1f4bb; 作者简介&#xff1a;CSDN内容合伙人&#xff0c;全栈领域优质创作者。 &#x1f310; 推荐一款找工作神器网站: 点击跳转牛客网 |笔试题库|面试经验|实习招聘内推| 还没有账户的小伙伴 速速点击链接…

推荐几个优秀的echarts 图表网站,让你轻松搞定全部报表

1.PPChart - 让图表更简单让图表更简单。PPChart 提供 Echarts 收录、图表制作等服务http://ppchart.com/#/ 2.https://madeapie.com/#/echarts图表制作&#xff0c;Make A Pie&#xff0c;Made A Pie&#xff0c;echarts案例分享&#xff0c;echarts教程分享https://madeapie…

PHP连接数据库MySQL打造xxx管理系统,实现简单的增删改查功能

目录 前言 概述 内容 创建数据库表 实现列表 新增用户 删除用户 编辑用户 前言 最近刚学完PHP和Mysql,历时半个多月时间完成了这样一个简单的算是人员管理系统吧&#xff0c;为了加深印象总结一下&#xff0c;还有很多不足之处&#xff0c;希望大家多多指正&#xff0c;一…

vue点击变色

vue点击一个遍历后元素改变其颜色的方法&#xff0c;有两种情况&#xff0c;第一种是点击单行元素变色&#xff0c;点击另一行元素时&#xff0c;原来变色的元素变回原来的颜色&#xff0c;始终只有一行元素是变色的&#xff0c;第二种情况是点击后永久变色&#xff0c;点击其他…