【SSH网上商城】——AJAX异步验证是否存在该用户名

2024-08-28 14:38
文章标签 是否 验证 异步 存在 用户名 ssh ajax 网上商城

本文主要是介绍【SSH网上商城】——AJAX异步验证是否存在该用户名，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

        这几天抽着中午的空隙，敲SSH网上商城，刚开始敲的时候，弄SSH的框架花了段时间，框架搭完以后，开始首页跳转，一切都开始步入正轨了。敲了几集视频，感觉SSH网上商城的项目挺好玩的，虽然开始学习的时候不太懂，但是看着功能一个一个的实现，很有成就感。

使用ajax完成用户名是否存在的异步校验：一共分为五个步骤：


1.事件触发:

            * 在用户名那添加onblur事件
2.编写AJAX代码:
           * 向Action中提交:传递username参数
3.编写Action
           * 接收username:模型驱动接收.
           * 编写实体类
           * User
           * User.hbm.xml
           * 配置到Spring中.
4.编写DAO
            * 继承HibernateDaoSupport
            * 在配置中注入sessionFactory
5.编写Service

            *注入UserDao

            *事务管理

1、在注册页面找到用户名，为用户名添加onblur（鼠标失去焦点）事件

<strong><span style="font-size:18px;"><input type="text" id="username" name="username" class="text" maxlength="20" οnblur="checkUsername()"/></span></strong>
2、编写AJAX代码:
 
<strong><span style="font-size:18px;">	function checkUsername(){// 获得文件框值:var username = document.getElementById("username").value;// 1.创建异步交互对象var xhr = createXmlHttp();// 2.设置监听xhr.onreadystatechange = function(){if(xhr.readyState == 4){if(xhr.status == 200){document.getElementById("span1").innerHTML = xhr.responseText;}}}// 3.打开连接xhr.open("GET","${pageContext.request.contextPath}/user_findByName.action?time="+new Date().getTime()+"&username="+username,true);// 4.发送xhr.send(null);}function createXmlHttp(){var xmlHttp;try{ // Firefox, Opera 8.0+, SafarixmlHttp=new XMLHttpRequest();}catch (e){try{// Internet ExplorerxmlHttp=new ActiveXObject("Msxml2.XMLHTTP");}catch (e){try{xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");}catch (e){}}}return xmlHttp;}</span></strong>
3.编写Action

在编写action前，需要先创建相应的包和类，要用到的user的包和类，见下图：


userAction: 接收username:模型驱动接收 
package cn.itcast.shop.user;
import java.io.IOException;
import cn.itcast.shop.user.service.UserService;
import cn.itcast.shop.user.vo.User;
import javax.servlet.http.HttpServletResponse;
import org.apache.struts2.ServletActionContext;
import com.opensymphony.xwork2.ActionSupport;
import com.opensymphony.xwork2.ModelDriven;/*** 用户模块Action的类* @author CXC**/
public class UserAction extends ActionSupport implements ModelDriven<User> {//模型驱动要使用的private User user=new User();public User getModel(){return user;		}//接受验证码：private String checkcode;public void setCheckcode(String checkcode){this.checkcode=checkcode;	}//注入UserServiceprivate UserService userService;public void setUserService(UserService userService) {this.userService = userService;}/*** 跳转到注册页面的执行方法*/public String registPage() {return "registPage";}/*** AJAX进行一步校验用户名的执行方法* @ throws IOException*/public String findByName() throws IOException {// 调用Service进行查询:User existUser = userService.findByUsername(user.getUsername());// 获得response对象,向页面输出:HttpServletResponse response = ServletActionContext.getResponse();response.setContentType("text/html;charset=UTF-8");// 判断if (existUser != null) {// 查询到该用户:用户名已经存在response.getWriter().println("<font color='red'>用户名已经存在</font>");} else {// 没查询到该用户:用户名可以使用response.getWriter().println("<font color='green'>用户名可以使用</font>");}return NONE;}/*** 用户注册的方法：*/public String regist(){//判断验证码程序//从session中获得验证码的随机值String checkcode1=(String)ServletActionContext.getRequest().getSession().getAttribute("checkcode");if(!checkcode.equalsIgnoreCase(checkcode1)){this.addActionError("验证码输入错误！");return "checkcodeFail";			}userService.save(user);this.addActionMessage("注册成功！请去邮箱激活！");return "msg";		}
/*** 用户激活的方法*/public String active(){//根据激活码查询用户：User existUser=userService.findByCode(user.getCode());//判断if(existUser ==null){//激活码错误this.addActionMessage("激活失败：激活码错误！");}else{//激活成功//修改用户的状态existUser.setState(1);existUser.setCode(null);userService.update(existUser);this.addActionMessage("激活成功，请去登陆！");}return "msg";}/*** 跳转到登陆页面*/public String loginPage(){return "loginPage";}/*** 登陆的方法*/public String login(){User existUser=userService.login(user);if(existUser==null){//登陆失败this.addActionError("登陆失败：用户名或密码错误或用户未激活！");return LOGIN;}else{//登陆成功//将用户的信息存入到session中ServletActionContext.getRequest().getSession().setAttribute("existUser",existUser);return "loginSuccess";	}}/*** 用户退出的方法*/public String quit(){//销毁sessionServletActionContext.getRequest().getSession().invalidate();return "quit";}}


实体类：编写User的实体类 

<strong><span style="font-size:18px;">package cn.itcast.shop.user.vo;
/*** 用户名模块实体类:* @author CXC*CREATE TABLE `user` (`uid` int(11) NOT NULL AUTO_INCREMENT,`username` varchar(255) DEFAULT NULL,`password` varchar(255) DEFAULT NULL,`name` varchar(255) DEFAULT NULL,`email` varchar(255) DEFAULT NULL,`phone` varchar(255) DEFAULT NULL,`addr` varchar(255) DEFAULT NULL,`state` int(11) DEFAULT NULL,`code` varchar(64) DEFAULT NULL,PRIMARY KEY (`uid`)
) ENGINE=InnoDB AUTO_INCREMENT=2 DEFAULT CHARSET=utf8;*/
public class User {private Integer uid;private String username;private String password;private String name;private String email;private String phone;private String addr;private Integer state;private String code;public Integer getUid() {return uid;}public void setUid(Integer uid) {this.uid = uid;}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;}public String getName() {return name;}public void setName(String name) {this.name = name;}public String getEmail() {return email;}public void setEmail(String email) {this.email = email;}public String getPhone() {return phone;}public void setPhone(String phone) {this.phone = phone;}public String getAddr() {return addr;}public void setAddr(String addr) {this.addr = addr;}public Integer getState() {return state;}public void setState(Integer state) {this.state = state;}public String getCode() {return code;}public void setCode(String code) {this.code = code;}}</span></strong>

在User.hbm.xml中添加映射：

<strong><span style="font-size:18px;"><?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE hibernate-mapping PUBLIC "-//Hibernate/Hibernate Mapping DTD 3.0//EN""http://www.hibernate.org/dtd/hibernate-mapping-3.0.dtd"><hibernate-mapping><class name="cn.itcast.shop.user.vo.User" table="user"><id name="uid"><generator class="native"/></id><property name="username"/><property name="password"/><property name="name"/><property name="email"/><property name="phone"/><property name="addr"/><property name="state"/><property name="code"/></class></hibernate-mapping></span></strong>

配置到Spring中：


4、编写Dao，在这块中UserDao继承HibernateDaoSupport

<strong style="font-family: Arial, Helvetica, sans-serif; font-size: 12px; background-color: rgb(255, 255, 255);"><span style="font-size:18px;"></span></strong>

<strong><span style="font-size:18px;">package cn.itcast.shop.user.dao;</span></strong>


import java.util.List;import org.springframework.orm.hibernate3.support.HibernateDaoSupport;import cn.itcast.shop.user.vo.User;/** * 用户模块持久层代码：* @author CXC**/
public class UserDao extends HibernateDaoSupport{//按照名称查询是否有该用户：public User findByUsername(String username){String hql = "from User where username = ?";List<User> list = (List<User>) this.getHibernateTemplate().find(hql, username);if(list != null && list.size() > 0){return list.get(0);}return null;}//注册用户存入数据库的代码实现public void save(User user){this.getHibernateTemplate().save(user);}// 根据激活码查询用户public User findByCode(String code) {String hql = "from User where code = ?";List<User> list = (List<User>) this.getHibernateTemplate().find(hql,code);if(list != null && list.size() > 0){return list.get(0);}return null;}// 修改用户状态的方法public void update(User existUser) {this.getHibernateTemplate().update(existUser);}//用户登陆的方法public User login(User user) {// TODO Auto-generated method stubString hql="from User where username= ? and password = ? and state= ?";List<User> list=(List<User>) this.getHibernateTemplate().find(hql,user.getUsername(),user.getPassword(),1);if (list !=null && list.size()>0){return list.get(0);}return null;}
}

5、编写Service：将配置注入到sessionFactory中 

<!-- 配置用户模块的Action --><action name="user_*" class="userAction" method="{1}"><result name="registPage">/WEB-INF/jsp/regist.jsp</result>

事务管理： 

<?xml version="1.0" encoding="UTF-8"?>
<beans xmlns="http://www.springframework.org/schema/beans"xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"xmlns:context="http://www.springframework.org/schema/context"xmlns:aop="http://www.springframework.org/schema/aop"xmlns:tx="http://www.springframework.org/schema/tx"xsi:schemaLocation="http://www.springframework.org/schema/beans http://www.springframework.org/schema/beans/spring-beans.xsdhttp://www.springframework.org/schema/contexthttp://www.springframework.org/schema/context/spring-context.xsdhttp://www.springframework.org/schema/aophttp://www.springframework.org/schema/aop/spring-aop.xsdhttp://www.springframework.org/schema/tx http://www.springframework.org/schema/tx/spring-tx.xsd"><!-- 配置连接池: --><!-- 引入外部属性文件 --><context:property-placeholder location="classpath:jdbc.properties"/><!-- 配置C3P0连接池 -->	<bean id="dataSource" class="com.mchange.v2.c3p0.ComboPooledDataSource"><property name="driverClass" value="${jdbc.driver}"/><property name="jdbcUrl" value="${jdbc.url}"/><property name="user" value="${jdbc.user}"/><property name="password" value="${jdbc.password}"/></bean>	<!-- Hibernate的相关信息 --><bean id="sessionFactory" class="org.springframework.orm.hibernate3.LocalSessionFactoryBean"><!-- 注入连接池 --><property name="dataSource" ref="dataSource"/><!-- 配置Hibernate的其他的属性 --><property name="hibernateProperties"><props><prop key="hibernate.dialect">org.hibernate.dialect.MySQLDialect</prop><prop key="hibernate.show_sql">true</prop><prop key="hibernate.format_sql">true</prop><prop key="hibernate.connection.autocommit">false</prop><prop key="hibernate.hbm2ddl.auto">update</prop></props></property><!--配置 hibernate的映射文件 --><property name="mappingResources"><list><value>cn/itcast/shop/user/vo/User.hbm.xml</value></list></property></bean><!-- 事务管理： --><!-- 事务管理器 --><bean id="transactionManager" class ="org.springframework.orm.hibernate3.HibernateTransactionManager"><property name="sessionFactory" ref="sessionFactory"/></bean><!-- 开启注解事务  --><tx:annotation-driven transaction-manager="transactionManager"/><!-- Action的配置  --><!-- 首页访问的Action --><bean id="indexAction" class="cn.itcast.shop.index.IndexAction" scope="prototype"><property name="categoryService" ref="categoryService"/><property name="productService" ref="productService"/></bean><!-- 配置验证码的Action  --><bean id="checkImgAction" class="cn.itcast.shop.user.CheckImgAction" scope="prototype"></bean><!-- 用户模块的Action  --><bean id='userAction' class="cn.itcast.shop.user.UserAction" scope="prototype"><!-- 注入Service --><property name="userService" ref="userService"/></bean><!--  Service的配置   --><bean id='userService' class="cn.itcast.shop.user.service.UserService"><property name="userDao" ref="userDao"/></bean><!--  Dao的配置  --><bean id='userDao' class="cn.itcast.shop.user.dao.UserDao"><property name="sessionFactory" ref="sessionFactory"/></bean> </beans>

总结：

         刚开始学习SSH网上商城，接触到了好多东西，SSH（spring structs，hibernate）通过这个项目让我对以后的学习更感兴趣，通过敲这一条线，先来梳理一下简单的逻辑。


这篇关于【SSH网上商城】——AJAX异步验证是否存在该用户名的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！


http://www.chinasem.cn/article/1115053。

相关文章

shell脚本快速检查192.168.1网段ip是否在用的方法

shell脚本快速检查192.168.1网段ip是否在用的方法

《shell脚本快速检查192.168.1网段ip是否在用的方法》该Shell脚本通过并发ping命令检查192.168.1网段中哪些IP地址正在使用,脚本定义了网络段、超时时间和并行扫描数量,并使用... 目录脚本：检查 192.168.1 网段 IP 是否在用脚本说明使用方法示例输出优化建议总结检查 1
阅读更多...
如何使用celery进行异步处理和定时任务(django)

如何使用celery进行异步处理和定时任务(django)

《如何使用celery进行异步处理和定时任务(django)》文章介绍了Celery的基本概念、安装方法、如何使用Celery进行异步任务处理以及如何设置定时任务,通过Celery,可以在Web应用中... 目录一、celery的作用二、安装celery三、使用celery 异步执行任务四、使用celery
阅读更多...
python 字典d[k]中key不存在的解决方案

python 字典d[k]中key不存在的解决方案

《python字典d[k]中key不存在的解决方案》本文主要介绍了在Python中处理字典键不存在时获取默认值的两种方法,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,... 目录defaultdict：处理找不到的键的一个选择特殊方法__missing__有时候为了方便起见，
阅读更多...
Python使用asyncio实现异步操作的示例

Python使用asyncio实现异步操作的示例

《Python使用asyncio实现异步操作的示例》本文主要介绍了Python使用asyncio实现异步操作的示例,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋... 目录1. 基础概念2. 实现异步 I/O 的步骤2.1 定义异步函数2.2 使用 await 等待异
阅读更多...
如何测试计算机的内存是否存在问题? 判断电脑内存故障的多种方法

如何测试计算机的内存是否存在问题? 判断电脑内存故障的多种方法

《如何测试计算机的内存是否存在问题?判断电脑内存故障的多种方法》内存是电脑中非常重要的组件之一，如果内存出现故障，可能会导致电脑出现各种问题，如蓝屏、死机、程序崩溃等，如何判断内存是否出现故障呢？下... 如果你的电脑是崩溃、冻结还是不稳定，那么它的内存可能有问题。要进行检查，你可以使用Windows 11
阅读更多...
Python中的异步:async 和 await以及操作中的事件循环、回调和异常

Python中的异步:async 和 await以及操作中的事件循环、回调和异常

《Python中的异步:async和await以及操作中的事件循环、回调和异常》在现代编程中,异步操作在处理I/O密集型任务时,可以显著提高程序的性能和响应速度,Python提供了asyn... 目录引言什么是异步操作？python 中的异步编程基础async 和 await 关键字asyncio 模块理论
阅读更多...
Spring Security基于数据库验证流程详解

Spring Security基于数据库验证流程详解

Spring Security 校验流程图 相关解释说明（认真看哦） AbstractAuthenticationProcessingFilter 抽象类 /*** 调用 #requiresAuthentication(HttpServletRequest, HttpServletResponse) 决定是否需要进行验证操作。* 如果需要验证，则会调用 #attemptAuthentica
阅读更多...
【测试】输入正确用户名和密码，点击登录没有响应的可能性原因

【测试】输入正确用户名和密码，点击登录没有响应的可能性原因

目录 一、前端问题 1. 界面交互问题 2. 输入数据校验问题 二、网络问题 1. 网络连接中断 2. 代理设置问题 三、后端问题 1. 服务器故障 2. 数据库问题 3. 权限问题： 四、其他问题 1. 缓存问题 2. 第三方服务问题 3. 配置问题 一、前端问题 1. 界面交互问题 登录按钮的点击事件未正确绑定，导致点击后无法触发登录操作。 页面可能存在
阅读更多...
Codeforces Round #113 (Div. 2) B 判断多边形是否在凸包内

Codeforces Round #113 (Div. 2) B 判断多边形是否在凸包内

题目点击打开链接 凸多边形A， 多边形B， 判断B是否严格在A内。  注意AB有重点 。  将A,B上的点合在一起求凸包，如果凸包上的点是B的某个点，则B肯定不在A内。 或者说B上的某点在凸包的边上则也说明B不严格在A里面。 这个处理有个巧妙的方法，只需在求凸包的时候， <=  改成< 也就是说凸包一条边上的所有点都重复点都记录在凸包里面了。 另外不能去重点。 int
阅读更多...
C++ | Leetcode C++题解之第393题UTF-8编码验证

C++ | Leetcode C++题解之第393题UTF-8编码验证

题目： 题解： class Solution {public:static const int MASK1 = 1 << 7;static const int MASK2 = (1 << 7) + (1 << 6);bool isValid(int num) {return (num & MASK2) == MASK1;}int getBytes(int num) {if ((num &
阅读更多...

Copyright China编程 23002807@qq.com

沪ICP备2023033072号-2