9 完整的用户注册登录实例
实例说明:
1.运行时会弹出login登录页面,用户输入用户名id,密码和验证验后,点击按钮登录,如果id或密码或验证码不正确,则系统会给予提示,如果登录成功,则会在欢迎页面上显示欢迎信息。
2.在login页面上有个"注册"连接,是让新用户注册用的。用户在输入密码时会显示密码的强度,小于6位数的为弱,除了带有字母、数字以外的其它字符为强如#,*等,其它为中。
在注册时会检查要输入的项是否都已输入,也会检查用户的邮箱格式是否正确(用js的正则表达式),如果注册成功会弹出个跳转页面,3秒后显示欢迎页面。
如下截图(用 jQuery):
目录图:数据集:
数据集的ReturnUserID的原形为:
INSERT INTO [dbo].[T_User] ([UserName], [Password], [Email]) output inserted.id VALUES (@UserName, @Password, @Email)
并设置此方法的属性,如下图:
定义出错信息显示的css:
.error
{
background-color:Red;
}
服务端产生随机验证码的处理程序:
using System; using System.Collections.Generic; using System.Linq; using System.Web; using System.Drawing; using System.Web.SessionState; using System.Drawing.Imaging; namespace Register { /// <summary> /// HandRegisterCode 的摘要说明 /// </summary> public class HandRegisterCode : IHttpHandler,IRequiresSessionState { public void ProcessRequest(HttpContext context) { context.Response.ContentType = "image/JPEG"; using (Bitmap bmp = new Bitmap(60, 30)) { using (Graphics g = Graphics.FromImage(bmp)) { Random rand = new Random(); int value = rand.Next(1000, 9999); HttpContext.Current.Session["code"] = value; string svalue = value.ToString(); g.DrawString(svalue, new Font("宋体", 20), Brushes.Aquamarine, new PointF(0, 0)); bmp.Save(context.Response.OutputStream, ImageFormat.Jpeg); } } } public bool IsReusable { get { return false; } } } }
登录页html:
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Login.aspx.cs" Inherits="Register.Login" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <title></title> <link href="css/StyleSheet1.css" rel="stylesheet" type="text/css" /> <script src="js/jquery-1.9.1.min.js" type="text/javascript"></script> <script type="text/javascript"> $(function () { $("#<%=btnLogin1.ClientID %>").click(function () { var userid = $("#<%=txtUserID.ClientID %>").val(); if (userid.length <= 0) { $("#errmsg").text("请输入用户ID").css("display", ""); return false; }; var pwd = $("#<%=txtPWD.ClientID %>").val(); if (pwd.length <= 0) { $("#errmsg").text("请输入用户密码").css("display", ""); return false; }; }); }); </script> </head> <body> <form id="form1" runat="server"> <div> <table border="0" cellspacing="0" cellpadding="0" width="40%"> <tr> <td> <asp:Label ID="Label1" runat="server" Text="用户ID:" AssociatedControlID="txtUserID"></asp:Label> </td> <td > <asp:TextBox ID="txtUserID" runat="server"></asp:TextBox> </td> </tr> <tr> <td> <asp:Label ID="Label2" runat="server" Text="密码:" AssociatedControlID="txtPWD"></asp:Label> </td> <td> <asp:TextBox ID="txtPWD" runat="server"></asp:TextBox> </td> </tr> <tr> <td> <img src="HandRegisterCode.ashx" alt="验证码" id="img" onclick="this.src='HandRegisterCode.ashx?aa='+new Date()"></a> </td> <td> <asp:TextBox ID="txtRegisterCode" runat="server"></asp:TextBox> </td> </tr> <tr> <td> </td> <td> <asp:Label ID="lblmsg" CssClass="error" Visible="False" runat="server" Text=""></asp:Label> <label id="errmsg" class="error" style="display:none"></label> </td> </tr> <tr> <td> <asp:Button ID="btnLogin1" runat="server" Text="登录" onclick="btnLogin1_Click" style="height: 21px" /> </td> <td> <a href="Registrer.aspx">注册</a> </td> </tr> </table> </div> </form> </body> </html>
登录页的cs代码:
using System; using System.Collections.Generic; using System.Linq; using System.Web; using System.Web.UI; using System.Web.UI.WebControls; using Register.DAL.DataSetUserTableAdapters; namespace Register { public partial class Login : System.Web.UI.Page { protected void Page_Load(object sender, EventArgs e) { } private bool CheckInput() { bool b=false; if (txtUserID.Text.Length <= 0) { lblmsg.Text = "请输入用户ID"; lblmsg.Visible=true; return b; }; if (txtPWD.Text.Length <= 0) { lblmsg.Text = "请输入用户密码"; lblmsg.Visible = true; return b; } if (txtRegisterCode.Text != Convert.ToString(Session["code"])) { lblmsg.Text = "输入的验证码不正确."; lblmsg.Visible=true; return b; } lblmsg.Visible=false; return true; } protected void btnLogin1_Click(object sender, EventArgs e) { if (!CheckInput()) return; long id = Convert.ToInt64(txtUserID.Text); T_UserTableAdapter adapter = new T_UserTableAdapter(); var data = adapter.GetDataByID(id); if (data.Count >= 1) { var user = data.Single(); if (user.Password != txtPWD.Text) { lblmsg.Text = "用户密码不正确."; lblmsg.Visible = true; return; } else { lblmsg.Visible = false; Session["ID"] = id; Response.Redirect("~/welcom.aspx"); } } else { lblmsg.Text = "此用户ID不存在"; lblmsg.Visible = true; return; } } } }
注册页的html:
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Registrer.aspx.cs" Inherits="Register.Registrer" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <title></title> <link href="css/StyleSheet1.css" rel="Stylesheet" type="text/css" /> <script src="js/jquery-1.9.1.min.js" type="text/javascript"></script> <script type="text/javascript"> $(function () { $("#<%=txtPassword2.ClientID %>").blur(function () { var pw1 = $("#<%=txtPassowrd.ClientID %>").val(); var pw2 = $(this).val(); if (pw1 != pw2) { alert("两次输入的密码不一样"); return false; } }); $("#<%=txtPassowrd.ClientID %>").blur(function () { var svalue = $(this).val(); if (svalue.length <= 6) { $("#lblhint").text("密码强度:弱"); } else { var regex = /\W/; //判断是否含有字母数字 if (regex.test(svalue)) { $("#lblhint").text("密码强度:强"); } else { $("#lblhint").text("密码强度:中"); } } }); $("#<%=form1.ClientID %>").submit(function () { var pw1 = $("#<%=txtPassowrd.ClientID %>").val(); var pw2 = $("#<%=txtPassword2.ClientID %>").val(); if (pw1 != pw2) { alert("两次输入的密码不一样"); return false; } var regex = /.+@.+/; var email = $("#<%=txtEmail.ClientID %>").val(); if (!regex.test(email)) { alert("邮箱格式不正确."); return false; } }); }); </script> <style type="text/css"> .style1 { width: 165px; } </style> </head> <body> <form id="form1" runat="server"> <div> <table border="0" cellspacing="0" cellpadding="0" style="width: 30%"> <tr> <td> <asp:Label ID="Label1" runat="server" Text="用户名:" AssociatedControlID="txtUserName"></asp:Label></td> <td class="style1"> <asp:TextBox ID="txtUserName" runat="server" AutoPostBack="True" ontextchanged="txtUserName_TextChanged"></asp:TextBox></td> </tr> <tr> <td> <asp:Label ID="Label2" runat="server" Text="密码:" AssociatedControlID="txtPassowrd"></asp:Label></td> <td class="style1"> <asp:TextBox ID="txtPassowrd" runat="server"></asp:TextBox></td> <td><asp:Label ID="lblhint" runat="server" Text=""></asp:Label></td> </tr> <tr> <td> <asp:Label ID="Label3" runat="server" Text="重复密码:" AssociatedControlID="txtPassword2"></asp:Label></td> <td class="style1"> <asp:TextBox ID="txtPassword2" runat="server"></asp:TextBox></td> </tr> <tr> <td> <asp:Label ID="Label4" runat="server" Text="邮箱" AssociatedControlID="txtEmail"></asp:Label></td> <td> <asp:TextBox ID="txtEmail" runat="server"></asp:TextBox></td> </tr> <tr> <td> <asp:Button ID="btnRegister" runat="server" Text="提交" onclick="btnRegister_Click" /></td> <td class="style1"> <asp:Label ID="lblmsg" runat="server" CssClass="error" Text="Label" Visible="False"></asp:Label></td> </tr> </table> </div> </form> </body> </html>
注册页的cs码:
using System; using System.Collections.Generic; using System.Linq; using System.Web; using System.Web.UI; using System.Web.UI.WebControls; using Register.DAL.DataSetUserTableAdapters; using System.Text.RegularExpressions; namespace Register { public partial class Registrer : System.Web.UI.Page { protected void Page_Load(object sender, EventArgs e) { } protected void txtUserName_TextChanged(object sender, EventArgs e) { string username = txtUserName.Text; T_UserTableAdapter adapter = new T_UserTableAdapter(); var data = adapter.GetDataByName(username); if (data.Count >= 1) { lblmsg.Text = "此用户名已存在"; lblmsg.Visible = true; return; } } private bool checkinput() { if (txtUserName.Text.Length <= 0) { lblmsg.Text = "请输入用户名"; lblmsg.Visible = true; return false; }; if (txtPassowrd.Text.Length<=0) { lblmsg.Text = "请输入密码"; lblmsg.Visible = true; return false; } if (txtPassword2.Text!=txtPassowrd.Text) { lblmsg.Text = "两次输入密码不一样"; lblmsg.Visible = true; return false; } Regex regex=new Regex(".+@.+"); if (!regex.IsMatch(txtEmail.Text)) { lblmsg.Text = "邮箱格式不正确."; lblmsg.Visible = true; return false; } lblmsg.Visible=false; return true; } protected void btnRegister_Click(object sender, EventArgs e) { if (!checkinput()) return; T_UserTableAdapter adapter = new T_UserTableAdapter(); long id =Convert.ToInt64(adapter.ReturnUserID(txtUserName.Text, txtPassowrd.Text, txtEmail.Text)); Session["ID"] = id; Response.Redirect("ShowMsg.aspx?msg=页面即将跳转...&page=welcom.aspx"); } } }
跳转页的html:
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="ShowMsg.aspx.cs" Inherits="Register.ShowMsg" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <title></title> <script type="text/javascript"> setInterval(function () { window.location.href = '<%=Request["page"] %>'; }, 3000); </script> </head> <body> <form id="form1" runat="server"> <div> </div> </form> </body> </html>
跳转页的cs码:
using System; using System.Collections.Generic; using System.Linq; using System.Web; using System.Web.UI; using System.Web.UI.WebControls; namespace Register { public partial class ShowMsg : System.Web.UI.Page { protected void Page_Load(object sender, EventArgs e) { if (!IsPostBack) { Response.Write(Request["msg"]); } } } }
欢迎页的html:
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="welcom.aspx.cs" Inherits="Register.welcom" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <title></title> </head> <body> <form id="form1" runat="server"> <div> </div> </form> </body> </html>
欢迎页的cs码:
using System; using System.Collections.Generic; using System.Linq; using System.Web; using System.Web.UI; using System.Web.UI.WebControls; using Register.DAL.DataSetUserTableAdapters; namespace Register { public partial class welcom : System.Web.UI.Page { protected void Page_Load(object sender, EventArgs e) { if (!IsPostBack) { long id = Convert.ToInt64(Session["ID"]); T_UserTableAdapter adapter = new T_UserTableAdapter(); var data = adapter.GetDataByID(id); if (data.Count >= 1) { var user = data.Single(); string sname = user.UserName; Response.Write(string.Format("欢迎ID:({0})的到来,你的名称为{1}",id,sname)); } } } } }