Spring MVC + mybatis实现的注册登录

╰半橙微兮° 2022-05-31 00:46 256阅读 0赞

# Spring MVC + mybatis实现的注册登录 #

## 前期准备： ##

如下图所示，准备好所需要的包，

![Center][]新建工程，导入所需要的包，在web.xml中配置好所需要的，如下，

**\[html\]**  [view plain][]   [copy][view plain]

1.  **<?****xml** version="1.0" encoding="UTF-8"**?>**  
2.  **<****web-app** version="2.4" xmlns="http://java.sun.com/xml/ns/j2ee"      
3.      xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance    
4.      http://www.springmodules.org/schema/cache/springmodules-cache.xsd   
5.      http://www.springmodules.org/schema/cache/springmodules-ehcache.xsd"      
6.      xsi:schemaLocation="http://java.sun.com/xml/ns/j2ee        
7.      http://java.sun.com/xml/ns/j2ee/web-app\_2\_4.xsd            
8.       "**>**  
9.  **<****filter****>**  
10.     **<****filter-name****>**encoding**</****filter-name****>**  
11.     **<****filter-class****>**org.springframework.web.filter.CharacterEncodingFilter**</****filter-class****>**  
12.     **<****init-param****>**  
13.         **<****param-name****>**encoding**</****param-name****>**  
14.         **<****param-value****>**UTF-8**</****param-value****>**  
15.     **</****init-param****>**  
16. **</****filter****>**  
17.     **<****filter-mapping****>**  
18.         **<****filter-name****>**encoding**</****filter-name****>**  
19.         **<****url-pattern****>**\*.action**</****url-pattern****>**  
20.     **</****filter-mapping****>**  
21.       
22. **<****servlet****>**  
23.     **<****servlet-name****>**spring**</****servlet-name****>**  
24.     **<****servlet-class****>**org.springframework.web.servlet.DispatcherServlet**</****servlet-class****>**  
25.       
26.     **<****load-on-startup****>**1**</****load-on-startup****>**  
27.     **<****init-param****>**  
28.         **<****param-name****>**contextConfigLocation**</****param-name****>**  
29.         **<****param-value****>**/WEB-INF/config/spring.xml**</****param-value****>**  
30.     **</****init-param****>**  
31. **</****servlet****>**  
32. **<****servlet-mapping****>**  
33.     **<****servlet-name****>**spring**</****servlet-name****>**  
34.     **<****url-pattern****>**\*.action**</****url-pattern****>**  
35. **</****servlet-mapping****>**  
36.     **<****welcome-file-list****>**  
37.         **<****welcome-file****>**index.jsp**</****welcome-file****>**  
38.     **</****welcome-file-list****>**  
39. **</****web-app****>**

配置好如下文件spring.xml，

**\[html\]**  [view plain][]   [copy][view plain]

1.  **<?****xml** version="1.0" encoding="UTF-8"**?>**  
2.  **<****beans** xmlns="http://www.springframework.org/schema/beans"  
3.      xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns:context="http://www.springframework.org/schema/context"  
4.      xmlns:aop="http://www.springframework.org/schema/aop" xmlns:util="http://www.springframework.org/schema/util"  
5.      xmlns:cache="http://www.springframework.org/schema/cache" xmlns:tx="http://www.springframework.org/schema/tx"  
6.      xmlns:mvc="http://www.springframework.org/schema/mvc"  
7.      xsi:schemaLocation="http://www.springframework.org/schema/beans  
8.                       http://www.springframework.org/schema/beans/spring-beans-3.2.xsd  
9.                       http://www.springframework.org/schema/context  
10.                      http://www.springframework.org/schema/context/spring-context-3.2.xsd  
11.                      http://www.springframework.org/schema/aop  
12.                      http://www.springframework.org/schema/aop/spring-aop-3.2.xsd  
13.                      http://www.springframework.org/schema/util  
14.                      http://www.springframework.org/schema/util/spring-util-3.2.xsd  
15.                      http://www.springframework.org/schema/cache  
16.                      http://www.springframework.org/schema/cache/spring-cache-3.2.xsd  
17.                      http://www.springframework.org/schema/tx  
18.                      http://www.springframework.org/schema/tx/spring-tx-3.2.xsd  
19.                      http://www.springframework.org/schema/mvc  
20.                      http://www.springframework.org/schema/mvc/spring-mvc-3.2.xsd"**>**  
21.   
22.       
23.     **<****context:annotation-config****>****</****context:annotation-config****>**  
24.       
25.       
26.     **<****context:component-scan** base-package="com.register"**>****</****context:component-scan****>**  
27.       
28.       
29.     **<****util:properties** id="myproperties" location="/WEB-INF/config/jdbc.properties"**>**  
30.     **</****util:properties****>**  
31.       
32.     **<****bean** id="ds" class="com.mchange.v2.c3p0.ComboPooledDataSource"**>**  
33.           
34.         **<****property** name="driverClass" value="\#\{myproperties.driver\}"**>****</****property****>**  
35.         **<****property** name="jdbcUrl" value="\#\{myproperties.url\}"**>****</****property****>**  
36.         **<****property** name="user" value="\#\{myproperties.username\}"**>****</****property****>**  
37.         **<****property** name="password" value="\#\{myproperties.password\}"**>****</****property****>**  
38.           
39.         **<****property** name="initialPoolSize" value="3"**>****</****property****>**  
40.         **<****property** name="maxPoolSize" value="20"**>****</****property****>**  
41.     **</****bean****>**  
42.       
43.     **<****bean** id="sqlSessionFactory" class="org.mybatis.spring.SqlSessionFactoryBean"**>**  
44.       **<****property** name="dataSource" ref="ds" **/>**  
45.         
46.       **<****property** name="mapperLocations" value="classpath:com/register/dao/\*.xml"**>****</****property****>**  
47.     **</****bean****>**  
48.       
49.       
50.     **<****bean** id="sqlSession" class="org.mybatis.spring.SqlSessionTemplate"**>**   
51.         **<****constructor-arg** index="0" ref="sqlSessionFactory"**>****</****constructor-arg****>**  
52.     **</****bean****>**  
53.       
54.     **<****mvc:annotation-driven****>****</****mvc:annotation-driven****>**  
55.       
56. **</****beans****>**

配置好数据库信息，

**\[html\]**  [view plain][]   [copy][view plain]

1.  driver=com.mysql.jdbc.Driver  
2.  url=jdbc:mysql://localhost:3306/cheshangbao?useUnicode=true&characterEncoding=utf8&autoReconnect=true&useOldAliasMetadataBehavior=true  
3.  username=root  
4.  password=admin

另外，还有所需要的操作数据库的语句，

**\[html\]**  [view plain][]   [copy][view plain]

1.  **<?****xml** version="1.0" encoding="UTF-8" **?>**  
2.  <!DOCTYPE mapper  
3.  PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN"  
4.  "http://mybatis.org/dtd/mybatis-3-mapper.dtd"**>**  
5.    
6.    
7.  **<****mapper** namespace="com.register.dao"**>**  
8.    
9.        
10.     **<****insert** id="addUser" parameterType="map"**>**  
11.         insert into user\_login (phone\_mobile,login\_password,register\_time,user\_code) values(\#\{phone\_mobile\},\#\{login\_password\},\#\{register\_time\},\#\{user\_code\})  
12.     **</****insert****>**  
13.       
14.       
15.     **<****select** id="judgeUser" parameterType="String" resultType="com.register.vo.User"**>**  
16.         select phone\_mobile from user\_login where phone\_mobile=\#\{phone\_mobile\}  
17.     **</****select****>**  
18.       
19.       
20.     **<****select** id="userLogin" parameterType="map" resultType="com.register.vo.User"**>**  
21.         select phone\_mobile,login\_password from user\_login where phone\_mobile=\#\{phone\_mobile\} and login\_password=\#\{login\_password\}  
22.     **</****select****>**  
23. **</****mapper****>**

## 前端准备工作， ##

我做的一个简单的注册登录的页面，在页面中对表单进行了第一层的判断，然后在后端又写了第二层验证。

登陆页面如下，

**\[html\]**  [view plain][]   [copy][view plain]

以下是注册界面，

**\[html\]**  [view plain][]   [copy][view plain]

1.  <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"**>**  
2.  **<****html****>**  
3.    **<****head****>**  
4.      **<****base** href="<%=basePath%>"**>**  
5.        
6.      **<****title****>**用户注册**</****title****>**  
7.      **<****meta** http-equiv="pragma" content="no-cache"**>**  
8.      **<****meta** http-equiv="cache-control" content="no-cache"**>**  
9.      **<****meta** http-equiv="expires" content="0"**>**      
10.     **<****meta** http-equiv="keywords" content="keyword1,keyword2,keyword3"**>**  
11.     **<****meta** http-equiv="description" content="This is my page"**>**  
12.     **<****link** rel="stylesheet" href="assets/css/style.css"**>**   
13.       
16.   **</****head****>**  
17.    **<****script** type="text/javascript" src="<%=basePath%>/js/jquery-1.8.3.js"**>****</****script****>**  
18.   **<****script** src="<%=basePath%>/js/My97DatePicker/WdatePicker.js" **>****</****script****>**  
19.   **<****script** type="text/javascript"**>**  
20. // 用户名合法性的判断  
21.   $(function()\{  
22.         $("\#phone\_number").blur(function()\{  
23.                 var phone = $("\#phone\_number").val();  
24.                 var len = $("\#phone\_number").val().length;  
25.                 $.getJSON("userJudge.action",\{"phone\_mobile":phone\},function(data)\{  
26.                         if(data!=null)\{  
27.                             alert("手机号已注册，青重新输入！！");  
28.                             $("\#userNameError").html("手机号已注册！");  
29.                             $("\#regFrm").attr("onsubmit","return false");  
30.                               
31.                         \}else if(len==0||phone==null)\{  
32.                             $("\#userNameError").html("手机号不能为空！");  
33.                             $("\#regFrm").attr("onsubmit","return false");  
34.                             \}  
35.                         else if (!checkContactNumber()) \{   
36.                               $("\#userNameError").html("不符合手机号格式！");  
37.                               $("\#regFrm").attr("onsubmit","return false");  
38.                             \}   
39.                         else\{  
40.                             $("\#userNameError").html("恭喜！手机号可用！")  
41.                             $("\#regFrm").attr("onsubmit","return true");  
42.                                 \}  
43.                     \});  
44.             \});  
45.         \});  
46. // 密码合法性的判断  
47.     $(function()\{  
48.         $("\#pwd").blur(function()\{  
49.             var len = $("\#pwd").val().length;  
50.             if(len==0)\{  
51.                 $("\#pwdError").html("密码不能为空！");  
52.                 $("\#regFrm").attr("onsubmit","return false");  
53.                 \}  
54.             if(len**>**0&&len**<****6**)\{  
55.                 $("\#pwdError").html("密码位数最少为6位！");  
56.                 $("\#regFrm").attr("onsubmit","return false");  
57.                 \}  
58.             if(len**>**=6)\{  
59.                 $("\#pwdError").html("密码格式正确！");  
60.                 $("\#regFrm").attr("onsubmit","return true");  
61.                 \}  
62.             \})  
63.         \})  
64. // 确认两次密码  
65.     $(function()\{  
66.         $("\#conpwd").blur(function()\{  
67.         var oldpwd = $("\#pwd").val();  
68.         var conpwd = $("\#conpwd").val();  
69.         var number = $("\#conpwd").val().length;  
70.         if(number == 0)\{  
71.             $("\#pwdError").html("密码不能为空！");  
72.             $("\#regFrm").attr("onsubmit","return false");  
73.         \}  
74.         else if(oldpwd!=conpwd)\{  
75.                 $("\#conpwdError").html("两次密码不一致！");  
76.                 $("\#regFrm").attr("onsubmit","return false");  
77.             \}else\{  
78.                 $("\#conpwdError").html("密码符合！");  
79.                 $("\#regFrm").attr("onsubmit","return true");  
80.             \}  
81.         \})  
82.     \})  
83.     function check()\{    
84.          fr=document.reg;    
85.          if(fr.phone\_mobile.value=="")\{    
86.             fr.phone\_mobile.focus();    
87.             return false;    
88.          \}    
89.          if((fr.login\_password.value==""))\{    
90.                  fr.login\_password.focus();   
91.                  return false;    
92.          \}  
93.         if((fr.login\_password2.value==""))\{    
94.              fr.login\_password2.focus();   
95.              return false;    
96.      \}  
97.            fr.submit();  
98.          \}  
99.     function checkContactNumber() \{    
100.         var mobile = $.trim($("\#phone\_number").val());    
101.         var isMobile = /^(((13\[0-9\]\{1\})|(15\[0-9\]\{1\})|(18\[0-9\]\{1\})|(17\[0-9\]\{1\})|(14\[0-9\]\{1\}))+\\d\{8\})$/;    
102.             if (!isMobile.exec(mobile) && mobile.length != 11) \{    
103.                 $("\#phone\_number").focus();    
104.                 return false;    
105.             \}    
106.         return true;    
107.         \}    
108.   **</****script****>**  
109.   **<****body****>**  
110.     <!-- **<****form** id="regFrm" action="userReg.action" method="post" onsubmit=""**>**  
111.         用户名：**<****input** type="text" name="userName" id="uname"**>****<****span** style="color: red;" id="userNameError"**>****</****span****>****<****br****/>**  
112.         密码：**<****input** type="password" name="password" id="pwd"**>****<****span** style="color: red;" id="pwdError"**>****</****span****>****<****br****/>**  
113.         确认密码：**<****input** type="password" id="conpwd"**>****<****span** style="color: red;" id="conpwdError"**>****</****span****>****<****br****/>**  
114.         生日**<****input** type="text" name="birthday" onClick="WdatePicker()" class="Wdate"**>****<****br****/>**  
115.         **<****input** type="submit" value="注册"**>**  
116.     **</****form****>** --**>**  
117.     **<****div** class="page-container"**>**  
118.             **<****h1****>**用户注册**</****h1****>**  
119.           <!--   **<****form** id="regFrm" action="userReg.action" method="post" onsubmit=""**>**  
120.               用户名:**<****input** type="text" name="userName" class="username" **>**  
121.             密    码:**<****input** type="password" name="password" class="password" **>**  
122.                 **<****button** type="submit" class="submit\_button"**>**登录**</****button****>** --**>**  
123.                 **<****form** name="reg" id="regFrm" action="userReg.action" method="post" onsubmit=""**>**  
124.                 手机号：**<****input** type="text" name="phone\_mobile" id="phone\_number"**>****<****span** style="color: red;" id="userNameError"**>****</****span****>****<****br****/>**  
125.         密码：**<****input** type="password" name="login\_password" id="pwd"**>****<****span** style="color: red;" id="pwdError"**>****</****span****>****<****br****/>**  
126.         确认密码：**<****input** type="password" name="login\_password2" id="conpwd"**>****<****span** style="color: red;" id="conpwdError"**>****</****span****>****<****br****/>**  
127.          **<****button** type="submit" class="submit\_button" onclick="return check()"**>**注册**</****button****>**  
128.             **</****form****>**  
129.         **</****div****>**  
130.   **</****body****>**  
131. **</****html****>**

页面中对手机号进行了验证，而且能够与后台进行交互，判断数据库中是否已有此手机号，页面所需的js文件和css配置会在以下给出，

## 进入正题 ##

数据库中包含用户手机号，用户密码，以及注册信息，和生成的唯一识别码，

以下是用户的实体类，

**\[java\]**  [view plain][]   [copy][view plain]

1.  **package** com.register.vo;  
2.    
3.  **import** java.util.Date;  
4.    
5.  **public** **class** User \{  
6.  **private** **int** id;  
7.  **private** String phone\_mobile;//用户手机号  
8.  **private** String login\_password;//用户登录密码  
9.  **private** Date register\_time;//用户注册日期  
10. **private** String user\_code;//用户唯一识别ID  
11.   
12. **public** User(**int** id, String phone\_mobile, String login\_password, Date register\_time,  
13.         String user\_code) \{  
14.     **super**();  
15.     **this**.id = id;  
16.     **this**.phone\_mobile = phone\_mobile;  
17.     **this**.login\_password = login\_password;  
18.     **this**.register\_time = register\_time;  
19.     **this**.user\_code = user\_code;  
20. \}  
21.   
22. **public** User(String phone\_mobile, String login\_password, Date register\_time, String user\_code) \{  
23.     **super**();  
24.     **this**.phone\_mobile = phone\_mobile;  
25.     **this**.login\_password = login\_password;  
26.     **this**.register\_time = register\_time;  
27.     **this**.user\_code = user\_code;  
28. \}  
29. **public** User() \{  
30. \}  
31.   
32. **public** **int** getId() \{  
33.     **return** id;  
34. \}  
35. //对用户数据进行封装  
36. **public** **void** setId(**int** id) \{  
37.     **this**.id = id;  
38. \}  
39.   
40. **public** String getPhone\_mobile() \{  
41.     **return** phone\_mobile;  
42. \}  
43.   
44. **public** **void** setPhone\_mobile(String phone\_mobile) \{  
45.     **this**.phone\_mobile = phone\_mobile;  
46. \}  
47.   
48. **public** String getLogin\_password() \{  
49.     **return** login\_password;  
50. \}  
51.   
52. **public** **void** setLogin\_password(String login\_password) \{  
53.     **this**.login\_password = login\_password;  
54. \}  
55.   
56. **public** Date getRegister\_time() \{  
57.     **return** register\_time;  
58. \}  
59.   
60. **public** **void** setRegister\_time(Date register\_time) \{  
61.     **this**.register\_time = register\_time;  
62. \}  
63.   
64. **public** String getUser\_code() \{  
65.     **return** user\_code;  
66. \}  
67.   
68. **public** **void** setUser\_code(String user\_code) \{  
69.     **this**.user\_code = user\_code;  
70. \}  
71.   
72. \}

下面这一步是比较重要的一步，Controller类，

如下所示，

**\[java\]**  [view plain][]   [copy][view plain]

1.   **package** com.register.controller;  
2.  **import** java.net.InetAddress;  
3.  **import** java.net.UnknownHostException;  
4.  **import** java.text.DateFormat;  
5.  **import** java.text.SimpleDateFormat;  
6.  **import** java.util.Date;  
7.  **import** java.util.HashMap;  
8.  **import** java.util.Map;  
9.  **import** java.util.UUID;  
10. **import** java.util.regex.Matcher;  
11. **import** java.util.regex.Pattern;  
12.   
13. **import** javax.script.ScriptEngine;  
14. **import** javax.script.ScriptEngineManager;  
15. **import** javax.script.ScriptException;  
16. **import** javax.servlet.http.HttpServletRequest;  
17. **import** javax.servlet.http.HttpSession;  
18.   
19. **import** org.apache.ibatis.session.SqlSession;  
20. **import** org.springframework.beans.factory.annotation.Autowired;  
21. **import** org.springframework.stereotype.Controller;  
22. **import** org.springframework.web.bind.annotation.RequestMapping;  
23. **import** org.springframework.web.bind.annotation.ResponseBody;  
24.   
25. **import** com.register.service.UserService;  
26. **import** com.register.vo.User;  
27.   
28.   
29. //让控制器成为一个bean  
30. @Controller  
31. //这个控制器是接受user\_reg页面传过来的参数去操作数据库  
32. **public** **class** UserController \{  
33.     @Autowired  
34.     **private** SqlSession sqlSession;  
35.     @Autowired  
36.     **private** UserService us;  
37.     @Autowired  
38.     **private** HttpServletRequest req;  
39.     @RequestMapping("/userReg.action")  
40.     //jsp页面通过userReg.action找到这个方法  
41.     **public** String userReg(User user)\{  
42.         Map<String,Object> map = **new** HashMap<String, Object>();  
43.         map.put("phone\_mobile", user.getPhone\_mobile());  
44.         map.put("login\_password", user.getLogin\_password());  
45.                  
46.         //判断页面传回的数据要求  
47.         Pattern pattern = Pattern.compile("^((13\[0-9\])|(15\[^4,\\\\D\])|(18\[01236789\]))\\\\d\{8\}$");  
48.          Matcher matcher = pattern.matcher(user.getPhone\_mobile());  
49.         **if**(user.getPhone\_mobile()==**null** || user.getLogin\_password()==**null** || !matcher.matches())\{  
50.             **return** "index.jsp";  
51.         \}  
52.           
53.         //获取当前注册时间  
54.         Date date = **new** Date();  
55.         DateFormat df = **new** SimpleDateFormat("yyyy-MM-dd HH:mm:ss");  
56.         map.put("register\_time", df.format(date));  
57.           
58.         //生成唯一识别码  
59.          String s = UUID.randomUUID().toString();   
60.          String user\_code =  s.substring(0,8)+s.substring(9,13)+s.substring(14,18)+s.substring(19,23)+s.substring(24);   
61.          map.put("user\_code", user\_code);  
62.            
63.          //将数据添加到数据库中  
64.         **int** a = sqlSession.insert("com.register.dao.addUser",map);  
65.           
66.         req.setAttribute("phone\_mobile", user.getPhone\_mobile());  
67.         req.setAttribute("login\_password", user.getLogin\_password());  
68.         **return** "pages/register\_success.jsp";  
69.     \}  
70.   
71.   
72.     //处理用户名唯一性的判断                                                                       
73.     @RequestMapping("/userJudge.action")  
74.     @ResponseBody  
75.     **public** User userJudge(String phone\_mobile) \{  
76.         User u = sqlSession.selectOne("com.register.dao.judgeUser",phone\_mobile);  
77.         System.out.println(u.getPhone\_mobile());  
78.         **return** u;  
79.     \}  
80.       
81.     //用户登录的判断  
82.     @RequestMapping("/userLogin.action")  
83.     **public** String userLogin(String phone\_mobile,String login\_password)\{  
84.         //对页面传回的值进行二次判断  
85.          Pattern pattern = Pattern.compile("^((13\[0-9\])|(15\[^4,\\\\D\])|(18\[01236789\]))\\\\d\{8\}$");  
86.          Matcher matcher = pattern.matcher(phone\_mobile);  
87.         **if**(phone\_mobile==**null** || login\_password==**null** || !matcher.matches())\{  
88.             **return** "pages/user-login-no.jsp";  
89.         \}  
90.           
91.         User u = us.userLogin(phone\_mobile, login\_password);  
92.           
93.         //查到用户了，执行登录成功的操作  
94.         **if**(u!=**null**)\{  
95.             req.getSession().setAttribute("u", u);  
96.             **return** "pages/user-login-ok.jsp";  
97.         \}**else**\{  
98.             **return** "pages/user-login-no.jsp";  
99.         \}  
100.     \}  
101.     //用户退出销毁session 跳转到登录页  
102.     @RequestMapping("/userExit.action")  
103.     **public** String userExit(HttpSession session)\{  
104.         session.invalidate();  
105.         **return** "index.jsp";  
106.     \}  
107. \}

UserService类，

**\[java\]**  [view plain][]   [copy][view plain]

1.  **package** com.register.service;  
2.    
3.  **import** java.util.HashMap;  
4.  **import** java.util.Map;  
5.    
6.  **import** org.apache.ibatis.session.SqlSession;  
7.  **import** org.springframework.beans.factory.annotation.Autowired;  
8.  **import** org.springframework.stereotype.Service;  
9.    
10. **import** com.register.vo.User;  
11.   
12.   
13. @Service  
14. **public** **class** UserService \{  
15.     @Autowired  
16.     **private** SqlSession sqlSession;  
17.     **public** User userLogin(String phone\_mobile,String login\_password)\{  
18.         Map<String,Object> map = **new** HashMap<String, Object>();  
19.         map.put("phone\_mobile",phone\_mobile);  
20.         map.put("login\_password", login\_password);  
21.         User u = sqlSession.selectOne("com.register.dao.userLogin",map);  
22.         **return** u;  
23.     \}  
24. \}

注入测试类，

**\[java\]**  [view plain][]   [copy][view plain]

1.  **package** com.register.util;  
2.    
3.  **import** org.springframework.stereotype.Controller;  
4.    
5.  @Controller  
6.  **public** **class** TestUtil \{  
7.      **public** **void** a()\{  
8.          System.out.println("注入成功！");  
9.      \}  
10.   
11. \}

OK，到这里已经基本差不多了，但是这里边所给的代码并不完整，为了方便大家相互交流学习，这是源码以及数据库文件，

链接：http://pan.baidu.com/s/1geEOshX 密码：bx9q，想要参考源码的可以自己下载。

[Center]: /images/20220531/9cf286e78b8844cd89f35c5f0a5762cc.png
[view plain]: http://blog.csdn.net/wojiaohuangyu/article/details/51997847#