用户注册的mysql代码_用户的注册登陆流程及代码实现
沒有SSM框架前項目分包分層是這樣的. (其中的命名不太規(guī)范,應省略_)
在有了框架之后項目使用SSM后sql語句都半封裝在了.....xml文件中.對應的Dao的接口中的方法,實現(xiàn)對數(shù)據(jù)庫的增刪改查操作.獲取JDBC鏈接寫在了mybatis的xml配置文件里了.
而servlet也變成了一個,并使用Spring,SpringMVC提供的IOC,DI,視圖解析等多工具,只使用指定的@...注解就可以實現(xiàn)生成bean的對象,指定哪個方法為哪個/*.do(action)路徑等.
總體代碼量減少了,需要配置的xml文件多了.大部分的事情好像都交給了框架去做.忽然感覺一下落了空.沒關系,還有重要的事情要處理.
上面的是一個簡單的用戶登陸的頁面,在類似 jq22 這樣的網(wǎng)站上可以找到類似的jquery的相關工具js,如驗證碼.頁面效果.
當判定用戶輸入的驗證碼與給出的一致后,進入用戶名及密碼的判定,從數(shù)據(jù)庫查詢該用戶名和密碼,如果核對正確,則登陸成功.反之.則反之.
具體注冊和登陸要使用ajax與json去傳遞數(shù)據(jù),因為這樣可以預先判定用戶名是否已注冊,已經(jīng)注冊的話,直接返回給用戶說已經(jīng)注冊了,你就別用這個名字了,然后可以跟一系列的隨機數(shù)字在這個名字后面(但這樣是不是還是已經(jīng)注冊了的,判定起來就略麻煩些)
$("#loginButton").click(function (){
var IsBy=$.idcode.validateCode();/*alert(IsBy);*/console.log(IsBy);if(!IsBy){ //如果驗證碼通過,則執(zhí)行ajax的方法
event.preventDefault();
}else{
loginUser();
}
});
登陸:
console.log("in loginUser() ~");
var user_name= $("#user_name").val();
var user_pwd= $("#user_pwd").val();/*var passPattern = /^(?=.*[a-z])(?=.*[A-Z])(?=.*\d)[^]{8,16}$/;*/var namePattern= /^[a-zA-Z0-9_-]{4,16}$/;if(namePattern.test(user_name)){
console.log(user_name);
console.log(user_pwd);//用戶名RegExp正確后,再判定其是否已經(jīng)在數(shù)據(jù)庫中存在
$.ajax({
url:"<%=path%>/user/queryUserByNameAndPwd.do", //根據(jù)用戶名查詢用戶實例
type:"POST",
data:{"user_name":user_name, "user_pwd":user_pwd},
dataType:"json",
success:function(data){//響應回傳成功后到這里
if(data.code==1){//如果用戶名密碼正確,則登陸.
console.log(data.message);
document.forms["loginForm"].submit();
window.location.href="http://localhost:8084/OrderSystemM/Test1/index.jsp";/*return true;*/}else if(data.code==0){
alert(data.message);/*return false;*/}else{//用戶實例不為空,但用戶名不等于該查詢的用戶名 (幾率微乎其微)
alert("網(wǎng)絡錯誤,請稍后再試");//發(fā)送BUG信息到管理員
/*return false;*/}
}
})
}
}
用戶登陸后返回首頁,如果不調(diào)用window.location.href方法回轉到index.jsp,會顯示.do路徑,我想還有別的方法可以解決這一問題.!
之后用戶需要退出時:
console.log("清除session");
$.ajax({
url:"<%=path%>/user/removeSession.do", //清除用戶sessoin
type:"POST",
data:{},
dataType:"json",
success:function(data){//響應回傳成功后到這里
if(data.removeCode==1){//如果用戶名重復,則<
alert("您已退出登陸!歡迎下次光臨💗");
window.location.href="http://localhost:8084/OrderSystemM/Test1/index.jsp";
}else if(data.removeCode==0){
alert("退出失敗!請聯(lián)系!");
}else{//用戶實例不為空,但用戶名不等于該查詢的用戶名 (幾率微乎其微)
alert("網(wǎng)絡錯誤,請稍后再試");//發(fā)送BUG信息到管理員
}
}
})
}
在用戶注冊時,將bootstrap的插件又get了幾個新方法.
//注冊按鈕點擊執(zhí)行注冊判定
$("#regButton").click(registerUser);//用戶名失去焦點時,執(zhí)行查詢該用戶名是否已經(jīng)存在的ajax操作
$("#user_nameReg").blur(userNameJudger);//密碼框失焦,執(zhí)行密碼判定
$("#user_pwdReg").blur(pwdCompare);//密碼2變動時執(zhí)行
$("#user_pwdReg2").change(pwdCompare);//用戶名的正則表達式
var uPattern = /^[a-zA-Z0-9_-]{4,16}$/;//密碼的正則表達式
var pPattern = /^.*(?=.{6,30})(?=.*\d)(?=.*[A-Z])(?=.*[a-z])(?=.*[!@#$%^&*? ]).*$/;//設定用戶名的判定boolean
var nameFlag = false;
var user_nameReg= $("#user_nameReg").val();//用戶名判定
function userNameJudger(){
var user_nameReg= $("#user_nameReg").val();if(user_nameReg != null && user_nameReg !=''){//用戶名不為空
if(uPattern.test(user_nameReg)){//用戶名格式正式
console.log("用戶名格式正確");//格式正確后判定是否已經(jīng)存在數(shù)據(jù)庫中//ajax
$.ajax({
url:"/user/queryUserInsByName.do",
type:"POST",
data:{"user_name":user_nameReg},
dataType:"json",
success:function(data){if(data.exist==1){
$("#nameSp").html("??? ×用戶名已經(jīng)重復");
nameFlag= false;/*alert(data.message);*/}else{
$("#nameSp").html("??? √");
nameFlag= true;/*alert(data.message);*/}
}
})
}else{
nameFlag= false;
console.log("用戶名格式不正確");//用戶名格式不正確
/*alert("用戶名格式錯誤,應為4到16位(可使用 : 字母，數(shù)字，下劃線，減號)");*/
/*右側的 Tooltip*/$("#nameSp").html("???
💀用戶名格式錯誤,點我查看具體原因.
");$("[data-toggle='tooltip']").tooltip();
}
}else{//用戶名不能為空
nameFlag = false;
$("#nameSp").html("??? 🚫用戶名不能為空");
}
}/*tHIS FUNCTION IS SLOW
function getNameBool(){
userNameJudger();
return nameFlag;
}*/
/*設置密碼的判定boolean*/var pwdFlag= false;//密碼格式及相同比較,如果相同,pwdFlag為true
function pwdCompare(){
pwdFlag= false;
var user_pwd1Reg= $("#user_pwdReg").val();
var user_pwd2= $("#user_pwdReg2").val();if(user_pwd1Reg != null && user_pwd1Reg != ''){//如果密碼1不為空,不為空字符串
if(pPattern.test(user_pwd1Reg)){//密碼格式正確,繼續(xù)判定兩個密碼是否相同
console.log("密碼1格式正確");//ok
$("#pwd1Sp").html("??? √");if(user_pwd1Reg===user_pwd2){//兩個密碼相同,格式也正確
/*alert("密碼一致~可以注冊");//ok*/pwdFlag= true;
$("#pwd1Sp").html("??? √");
$("#pwd2Sp").html("??? √");returnpwdFlag;
}else{//第一個密碼格式正確,第二個密碼跟第一個不相同
/*alert("兩個密碼不同~");//ok*/
if(user_pwd2==''){
pwdFlag= false;
$("#pwd2Sp").html("??? 請輸入重復密碼.");returnpwdFlag;
}else{
pwdFlag= false;
$("#pwd2Sp").html("??? 重復密碼錯誤.");returnpwdFlag;
}
}
}else{//密碼1格式錯誤
pwdFlag = false;/*alert("密碼格式錯誤,需求6-30位,包括至少1個大寫字母，1個小寫字母，1個數(shù)字，1個特殊字符");//ok*/$("#pwd1Sp").html("???
💀密碼格式錯誤,點我查看具體原因.
");$("[data-toggle='tooltip']").tooltip();returnpwdFlag;
}
}else{//如果密碼1為空,為空字符串,判斷重復密碼是否空
if(user_pwd2 != null && user_pwd2 != ''){
pwdFlag= false;//如果密碼1為空,密碼2不空,則清空密碼2,關注密碼1輸入框提示先輸入密碼1
$("#user_pwdReg2").val('');//ok
console.log("密碼2被清空,先填寫密碼1");//ok
$("#user_pwdReg").focus();//ok
/*alert("先要輸入密碼1~"); //ok*/$("#pwd2Sp").html("??? 請先輸入上面的密碼.");returnpwdFlag;
}
}
}//注冊新用戶的一系列focus,blur事件.
/*function getRegsiterInfo(){
$()
}*/
//注冊新用戶
function registerUser(){
console.log("in registerUser() ~");
var user_nameTrue= $("#user_nameReg").val();
var user_pwdTrue= $("#user_pwdReg").val();//執(zhí)行用戶名判斷,是否已經(jīng)存在或格式等.
userNameJudger();if(pwdCompare() &&nameFlag){
$.ajax({
url:"/user/insertNewUser.do",
type:"POST",
data:{"user_name":user_nameTrue,"user_pwd":user_pwdTrue},
dataType:"json",
success:function(data){if(data.insertNum>0){
console.log("注冊成功");//發(fā)送用戶名密碼到用戶郵箱(待添加)
console.log("用戶名:"+user_nameTrue+".密碼:"+user_pwdTrue);//提交表單
document.forms["regForm"].submit();/*跳轉頁面并刷新獲取session及*/window.location.href="http://localhost:8084/OrderSystemM/Test1/userinfo.jsp";// }else{
console.log("注冊失敗");
}
}
})
}else{
console.log("🚫阻止提交");
event.preventDefault();
}
}
基本注冊的流程是這樣,口述的話簡單說明為,先判定注冊的用戶名是否已經(jīng)存在于了數(shù)據(jù)庫中,如果是,則提示已經(jīng)存在,并阻止提交 nameFlag = false
兩次重復密碼進行比對,格式正確并兩者相同,則返回true, 當這些具體滿足了條件,將用戶注冊信息通過ajax及json注冊到數(shù)據(jù)庫,并返回注冊狀態(tài)碼1or0,
1的話頁面假性submit提交讓注冊框消失,并跳轉如userinfo用戶信息頁面. (這里如果使用郵箱則可以發(fā)送郵件給注冊郵箱,當用戶點擊后再判斷操作)
基本的controller 更新用戶
//動態(tài)更新用戶數(shù)據(jù) 用戶信息界面
@RequestMapping("updateUser")
@ResponseBodypublic MapupdateUser(User user){
Map map = new HashMap();int updateNum =us.updateByPrimaryKeySelective(user);
map.put("updateNum",updateNum);if(updateNum>0){
map.put("message", "用戶數(shù)據(jù)更新成功💗");
}returnmap;
}
注冊
//注冊新用戶,成功返回狀態(tài)碼1
@RequestMapping("insertNewUser")
@ResponseBodypublic MapinsertNewUser(User u,HttpSession session){
Map map = new HashMap();int insertNum =us.insertUser(u);if(insertNum>0){
map.put("insertNum", insertNum);
map.put("message", "注冊成功.");
User user=us.queryUserByNameAndPwd(u);
System.out.println(user);
session.setAttribute("userID", user.getUser_id());//剛注冊,昵稱為空,放入用戶名
session.setAttribute("userName", u.getUser_name());returnmap;
}else{
map.put("insertNum", insertNum);
map.put("message", "注冊失敗,請聯(lián)系網(wǎng)站管理員.");returnmap;
}
}
根據(jù)session中的用戶id查詢用戶實例,將數(shù)據(jù)反填到用戶數(shù)據(jù)中
//根據(jù)用戶ID查詢用戶實例 從session中獲取ID
@RequestMapping("getUserById")
@ResponseBodypublicModelMap getUserById(HttpSession session,ModelMap map){
System.out.println(">>>>>>>>>>>>>>>>"+(Long)session.getAttribute("userID"));
User user= us.queryUserById((Long)session.getAttribute("userID"));
map.addAttribute("userIns",user);/*return "redirect:/user/showUser.do";*/
returnmap;
}
用戶退出
//用戶退出.清空session
@RequestMapping("removeSession")
@ResponseBodypublic MapremoveSession(HttpSession session){
Map map = new HashMap();
session.removeAttribute("userID"); //清空session 并無返回類型
session.removeAttribute("userName");
System.out.println("觸發(fā)removeSession");
map.put("removeCode",1);returnmap;
}
用戶名和密碼登陸
//用戶登陸進行ajax判定 如果登陸成功判斷狀態(tài)碼并展示用戶姓名鏈接,及退出按鈕
@RequestMapping("queryUserByNameAndPwd")
@ResponseBodypublic MapqueryUserByNameAndPwd(User user,HttpSession session){
Map map = new HashMap();
User u=us.queryUserByNameAndPwd(user);if(u!=null){//用戶存在登陸成功放入1
map.put("message", "登陸成功💗");
map.put("code", 1);//sessoin放入用用戶名和密碼
session.setAttribute("userID", u.getUser_id());//如果用戶昵稱不為空,則將用戶昵稱進行展示
if(u.getNick_name()!=null){
session.setAttribute("userName", u.getNick_name());returnmap;
}else{//昵稱為空,放入用戶名
session.setAttribute("userName", u.getUser_name());returnmap;
}
}else{//如果用戶為空,則放入0
System.out.println("密碼錯誤");
map.put("message", "用戶名或密碼錯誤💀");
map.put("code", 0);returnmap;
}
}
...
接下來是對數(shù)據(jù)庫表的設計以及商家入駐及套餐內(nèi)容展示.
感謝徐老大的xJsonBindView.js
總結
以上是生活随笔為你收集整理的用户注册的mysql代码_用户的注册登陆流程及代码实现的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： 日本音响品牌(日本行政区划)
- 下一篇： .net mysql 备份_window