Ajax登陆注册

最新推荐文章于 2022-05-21 22:51:08 发布
最新推荐文章于 2022-05-21 22:51:08 发布
阅读量270 收藏
点赞数
分类专栏： Ajax登陆注册
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_41020103/article/details/108127902
版权

RegisterServlet

package servlets;

import java.io.IOException;
import java.sql.Connection;
import java.sql.DriverManager;
import java.sql.PreparedStatement;
import java.sql.ResultSet;
import java.sql.SQLException;
import java.sql.Statement;

import javax.servlet.RequestDispatcher;
import javax.servlet.ServletContext;
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

/**
 * Servlet implementation class Register
 */
public class RegisterServlet extends HttpServlet {
	private static final long serialVersionUID = 1L;
	public void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
		String registerSatate="Fail";
		String targetUrl="/registerFail.jsp";
		PreparedStatement ps=null;
		Connection conn=null;
			String account=request.getParameter("account");
			String pwd=request.getParameter("password");
			String  cname=request.getParameter("cname");
			try {
				  Class.forName("com.mysql.jdbc.Driver");
				 conn = DriverManager.getConnection("jdbc:mysql://localhost:3306/aoligei","root","");
			Statement stat=conn.createStatement();
	   		String	sql="select * from T_CUSTOMER  where account=?";
	   		ps=conn.prepareStatement(sql);
			ps.setString(1, account);
			ResultSet rs=ps.executeQuery();
			if(!rs.next()){
				String	sql2="insert into T_CUSTOMER(account,password,cname)values(?,?,?)";
				 ps=conn.prepareStatement(sql2);
				 ps.setString(1, account);
				 ps.setString(2, pwd);
				 ps.setString(3, cname);
				 int i=ps.executeUpdate();	
				 if(i>0){
					 registerSatate="Success";
					 targetUrl="/registerSuccess.jsp";
				 }	 
			}
			request.setAttribute("registerSatate", registerSatate);
			ServletContext application=this.getServletContext();
			RequestDispatcher rd=application.getRequestDispatcher(targetUrl);
			rd.forward(request, response);
			ps.close();
			conn.close();
			} catch (Exception e) {
				// TODO Auto-generated catch block
				e.printStackTrace();
			}
			
		}

}

LoginServlet

package servlets;

import java.io.IOException;
import java.sql.Connection;
import java.sql.DriverManager;
import java.sql.PreparedStatement;
import java.sql.ResultSet;
import java.sql.SQLException;
import java.sql.Statement;

import javax.servlet.RequestDispatcher;
import javax.servlet.ServletContext;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import javax.servlet.http.HttpSession;


public class LoginServlet extends HttpServlet {

	/**
	 * 
	 */
	private static final long serialVersionUID = 1L;

	public void doPost(HttpServletRequest request, HttpServletResponse response)
			throws ServletException, IOException {
		String account = request.getParameter("account");
		String password = request.getParameter("password");
		PreparedStatement ps=null;
		Connection conn=null;
		String loginState = "Fail";
		String targetUrl = "/loginFail.jsp";
		try {
			  Class.forName("com.mysql.jdbc.Driver");
			 conn = DriverManager.getConnection("jdbc:mysql://localhost:3306/aoligei","root","");
			Statement stat=conn.createStatement();
			String	sql="select * from t_customer  where account=? and password=?";
			ps=conn.prepareStatement(sql);
			ps.setString(1, account);
			ps.setString(2, password);
			ResultSet rs=ps.executeQuery();
			if(rs.next()){
				loginState = "Success";
				targetUrl = "/loginSuccess.jsp";
				HttpSession session = request.getSession();
				session.setAttribute("account", account);
				 	 
			}
		} catch (ClassNotFoundException e) {
			// TODO Auto-generated catch block
			e.printStackTrace();
		} catch (SQLException e) {
			// TODO Auto-generated catch block
			e.printStackTrace();
		}
		
		request.setAttribute("loginState", loginState);
		ServletContext application = this.getServletContext();
		RequestDispatcher rd = 
			application.getRequestDispatcher(targetUrl);
		rd.forward(request, response);
	}
}

register.jsp

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <base href="<%=basePath%>">
    
    <title>My JSP 'register.jsp' starting page</title>
    
	<meta http-equiv="pragma" content="no-cache">
	<meta http-equiv="cache-control" content="no-cache">
	<meta http-equiv="expires" content="0">    
	<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
	<meta http-equiv="description" content="This is my page">
	<!--
	<link rel="stylesheet" type="text/css" href="styles.css">
	-->

  </head>
  
  <body>
  <script type="text/javascript">
  function register(){
  	var id=document.registerForm.id.value;
  	var pwd=document.registerForm.password.value;
  	var pwds=document.registerForm.passwords.value;
  	var cname=document.registerForm.cname.value;
  	if(id==""||pwd==""||pwds==""||cname==""){
  		alert("请填写完整的信息");
  	}else{
  		if(pwd!=pwds){
  			alert("两次密码输入不一致");
 	 	}else{
  		 var xmlHttp=new XMLHttpRequest();
  		 var url="servlets/RegisterServlet?account="+id+"&password="+pwd+"&cname="+cname;
  		 url=encodeURI(url);
  		 xmlHttp.open("post", url, true);
  		 xmlHttp.onreadystatechange=function(){
  		 if(xmlHttp.readyState==4){
  		 	resultDiv.innerHTML=xmlHttp.responseText;
  		 		}
  		 else{
  		 		resultDiv.innerHTML+="正在注册，请稍后......"
  		 		}
  		 	}
  		 	xmlHttp.send();
  		}
  	}
  }
  </script>
   欢迎注册学生管理系统<br><br/>
   <div id="resultDiv">
    <form name="registerForm">
    请输入账号：<input name="account" type="text" ><br><br>
    请输入密码：<input name="password" type="password" ><br><br>
    请确认密码：<input name="passwords" type="password" ><br><br>
    请输入姓名：<input name="cname" type="text" ><br><br>
    <input type="button" value="注册" onclick="register()">
    </form>
    </div>
  </body>
</html>

注意！type不能是submit

registerFail

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <base href="<%=basePath%>">
    
    <title>My JSP 'REgisterFail.jsp' starting page</title>
    
	<meta http-equiv="pragma" content="no-cache">
	<meta http-equiv="cache-control" content="no-cache">
	<meta http-equiv="expires" content="0">    
	<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
	<meta http-equiv="description" content="This is my page">
	<!--
	<link rel="stylesheet" type="text/css" href="styles.css">
	-->

  </head>
  
  <body>
    <h3>注册失败，可能是两次密码不一致，信息填写不完全，账号已被使用等原因</h3>s <br>
  </body>
</html>

registerSuccess.jsp

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <base href="<%=basePath%>">
    
    <title>My JSP 'registerSuccess.jsp' starting page</title>
    
	<meta http-equiv="pragma" content="no-cache">
	<meta http-equiv="cache-control" content="no-cache">
	<meta http-equiv="expires" content="0">    
	<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
	<meta http-equiv="description" content="This is my page">
	<!--
	<link rel="stylesheet" type="text/css" href="styles.css">
	-->

  </head>
  
  <body>
    <h3>注册成功 !!!</h3><br>
  </body>
</html>

login.jsp

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <base href="<%=basePath%>">
    
    <title>My JSP 'login.jsp' starting page</title>
    
	<meta http-equiv="pragma" content="no-cache">
	<meta http-equiv="cache-control" content="no-cache">
	<meta http-equiv="expires" content="0">    
	<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
	<meta http-equiv="description" content="This is my page">
	<!--
	<link rel="stylesheet" type="text/css" href="styles.css">
	-->

  </head>
  
  <body>
  <SCRIPT LANGUAGE="JavaScript">
  		function login(){
  			var account = document.loginForm.account.value;
  			var password = document.loginForm.password.value;  			
	  		var xmlHttp=new XMLHttpRequest();
	  		var url = "servlets/LoginServlet?account="+account+"&password="+password;
			xmlHttp.open("POST", url, true);				
			xmlHttp.onreadystatechange=function() {
				if (xmlHttp.readyState==4) {
					resultDiv.innerHTML = xmlHttp.responseText;
				}
				else{
					resultDiv.innerHTML += "正在登录，请稍候......";
				}				
			}
			xmlHttp.send();	
  		}
	</SCRIPT>  	
  <h2>欢迎登陆学生管理系统</h2><br><hr><br>
  <div id="resultDiv">
  <form name="loginForm">
  请输入您的账号：<input type="text" name="account"><br><br>
  请输入您的密码：<input type="password" name="password"><br><br>
  <input type="button" value="登录" onclick="login()">
  </form>
  </div>
  </body>
</html>

loginFail.jsp

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <base href="<%=basePath%>">
    
    <title>My JSP 'loginFail.jsp' starting page</title>
    
	<meta http-equiv="pragma" content="no-cache">
	<meta http-equiv="cache-control" content="no-cache">
	<meta http-equiv="expires" content="0">    
	<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
	<meta http-equiv="description" content="This is my page">
	<!--
	<link rel="stylesheet" type="text/css" href="styles.css">
	-->

  </head>
  
  <body>
   		 对不起，登录失败！<BR>
		请您检查是否：<BR>
		账号名写错<BR>
		密码写错
  </body>
</html>

loginSuccess.jsp

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <base href="<%=basePath%>">
    
    <title>My JSP 'loginSuccess.jsp' starting page</title>
    
	<meta http-equiv="pragma" content="no-cache">
	<meta http-equiv="cache-control" content="no-cache">
	<meta http-equiv="expires" content="0">    
	<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
	<meta http-equiv="description" content="This is my page">
	<!--
	<link rel="stylesheet" type="text/css" href="styles.css">
	-->

  </head>
  
  <body>
  		 欢迎${account}登录成功!<BR>
		您可以选择以下功能：<BR>
		<a href="">查询学生</a><BR>	
		<a href="">修改学生资料</a><BR>	
		<a href="">修改用户资料</a><BR>	
		<a href="">退出</a><BR>	
  </body>
</html>
DiSstantYouu
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
ajax用户登录注册
车明强的博客
11-04 5825
首先在服务器环境下运行，访问php接口 调用封装好的Ajax方法 前端js操作代码： 后端数据接口 <?php /* 接口说明文档 url: './data/user.php' type: post 参数： user 用户账号 pass 用户密码 type 登录或注册 = login 登录 = add 注册 返回值示例： {"err":0,"msg":"登录成功"} */// 允许任何来源 header(
jQuery Ajax 登陆和注册页面
06-01
带有自动验证插件，
ajax实现用户登录注册
07-28
ajax实现用户登录注册，完整的验证，经过调试，适合初学者
登录注册AJAX
weixin_44081699的博客
02-27 309
$("#butn").click(function(){ $.ajax({ url: 'http://101.132.40.198:8181/login', type: 'post', data: { username: document.getElementById('inp1').value, ...
Ajax实现登录验证
06-24
Ajax实现的登录页面，能够不刷新页面直接登录
ajax用户注册登录.zip
11-21
这个"超级简单易用的Ajax请求登录注册模板"很可能包含了预设的CSS样式，使得界面看起来简约清新。样式文件（可能为.css）用于控制布局和视觉效果，确保与各种网站主题兼容。 7. **实际应用** 这样的模板适用于...
SpringBoot使用Ajax实现登录
12-02
在Spring Boot应用中，使用Ajax实现登录功能是一个常见的需求，它可以提供无刷新的用户体验，使得用户界面更加流畅。本文将详细介绍如何在Spring Boot环境中配置和使用Ajax进行登录处理。 首先，我们看到`pom.xml`...
jquery+ajax注册登录页
01-03
在这个"jquery+ajax注册登录页"实例中，我们将深入探讨如何利用这两者来实现无刷新的用户注册和登录功能。 首先，jQuery是一个轻量级的JavaScript库，它简化了DOM操作、事件处理、动画效果和Ajax交互等任务。它的...
使用Ajax完成注册和登录
learn together
05-21 8813
简介 完成用户的登录和注册，以及个人信息的查询，并使用Ajax向后端提交JSON格式的数据。AJAX 是一种在无需重新加载整个网页的情况下，能够更新部分网页的技术。而JSON是一种轻量级的数据交换格式， 易于人阅读和编写，同时也易于机器解析和生成。 实现 控制器 @Autowired注解负责完成服务层成员变量的自动装配。 @RequestBody注解负责将前端发送过来的JSON数据封装到用户对象之中，以方便后端获取数据。 @ResponseBody注解负责给前端返回JSON数据对象。 package com
ajax请求实现登录注册
xiaobai_jq的博客
05-06 5166
之前是用form表单提交数据到后台，form表单提交会导致整个页面重新加载会显得不方便，如果不想要页面跳转，我们就用到了ajax请求，这边用的是jQuery ajax。之前页面做的也很丑，这次使用miniui前台框架完成。 ...
Jquery+Ajax实现用户注册与登入（Asp.Net版）
07-21
非常实用的Jqery和Ajax的实现用户注册和登入功能。 另外附送美女图像一张，呵呵。
用AJAX实现页面登陆以及注册用户名验证的简单实例
01-19
AJAX即“Asynchronous Javascript And XML”（异步JavaScript和XML），是指一种创建交互式网页应用的网页开发技术。 AJAX 是一种用于创建快速动态网页的技术。其核心是 JavaScript 对象 XMLHttpRequest。该对象在 Internet Explorer 5 中首次引入，它是一种支持异步请求的技术。简而言之，XMLHttpRequest使您可以使用 JavaScript 向服务器提出请求并处理响应，而不阻塞用户。 通过在后台与服务器进行少量数据交换，AJAX 可以使网页实现异步更新。这意味着可以在不重新加载整个网页的情况下，对网页的某
ajax 实现用户注册详细代码
12-11
ajax 技术实现 用户注册详细代码 以及介绍
基于servlet+ajax用户注册登录系统.zip
05-10
作业：用户登录注册系统，后台采用jsp + servlet + javabean技术实现，浏览器客户端采用ajax框架之jquery框架！ 要求： 不能抄袭，没有分组，面向接口编程，不要迟到！ 1、注册的信息： 用户名，密码，性别(下拉选择)，爱好(复选框)，城市(下拉选择),个人说明(文本域，富文本编辑器) 2、注册信息提交需要做js验证。 a、用户名不能为空，密码必须是6个字符以上。 b、密码只能是字母或者数字 c、个人说明要保证不能为空 d、用户名要使用ajax验证 3、js验证通过后， 数据交给servlet处理，如果数据不符合要求，返回表单提交页面，原来填写的内容必须回显。 4、注册成功后，进入登陆页面，完成登陆操作。 5、登陆成功后，显示所有的用户列表。 6、数据库采用mysql或oracle,数据库连接采用数据库连接池技术。
AJAX实现页面登录及注册用户名验证
qq_37139060的博客
08-05 1万+
AJAX介绍 定义：“Asynchronous Javascript And XML”（异步JavaScript和XML），是指一种创建交互式网页应用的网页开发技术。          AJAX 是一种用于创建快速动态网页的技术。其核心是 JavaScript 对象 XMLHttpRequest。该对象在 Internet Explorer 5 中首次引入，它是一种支持异步请求的技术。简而言之...
Ajax异步验证登陆或者注册
weixin_34262482的博客
03-02 513
首先介绍一个不错的学习Ajax的中文网站：http://www.w3school.com.cn/ajax/index.asp AJAX = 异步 JavaScript 和 XML。详细介绍见上面的网址即可； 1：首先介绍一下使用Javascript写的异步验证，然而在实际开发过程中很少用这种的，太过繁琐，但是依旧写一个吧！至少懂其原理哦！ 　　1.1：第一种方式：先说使用get方法向服务器发...
ajax 登陆注册实例,Ajax实现登录案例
weixin_39759182的博客
08-05 1042
这篇文章主要为大家详细介绍了Ajax实现登录案例，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下Ajax登录案例，供大家参考，具体内容如下Msgpackage com.lbl.msg;public class Msg {String msg;int code;public Msg() {}public Msg(String msg, int code) {this.m...
用户登录和注册界面（html ajax）
热门推荐
qq_37139060的博客
08-05 3万+
用户名密码的登录页面（点击注册跳转到注册页面） &lt;/html&gt;login.html &lt;!DOCTYPE html&gt; &lt;html xmlns:th="http://www.thymeleaf.org"&gt; &lt;head&gt; &lt;meta charset="UTF-8" /&gt; &lt;title&gt;index&amp
Ajax之简单验证登录注册
Welkin_qing的博客
12-20 920
一、 传统Ajax注册登录 html主页： &amp;lt;!DOCTYPE html&amp;gt; &amp;lt;html lang=&quot;en&quot;&amp;gt; &amp;lt;head&amp;gt; &amp;lt;meta charset=&quot;UTF-8&quot;&amp;gt; &amp;lt;title&amp;gt;Document&amp
jquery ajax登陆注册
最新发布
05-30
结合起来，jQuery AJAX登录注册是一种使用jQuery和AJAX技术实现的登录和注册功能。 具体实现过程如下： 1. 在页面中引入jQuery库和一个用于处理AJAX请求的JavaScript文件。 2. 使用jQuery选择器获取表单元素，并...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值