.NET MVC Web项目注册流程

最新推荐文章于 2023-01-10 00:16:03 发布

Jdouble

最新推荐文章于 2023-01-10 00:16:03 发布

阅读量454

点赞数 1

本文链接：https://blog.csdn.net/Jdouble/article/details/97962184

版权

第一步、创建数据库和表

Create database MiShop02;


USE [MiShop02]
GO
/****** Object:  Table [dbo].[UserInfo]    Script Date: 07/25/2019 11:57:49 ******/
SET ANSI_NULLS ON
GO
SET QUOTED_IDENTIFIER ON
GO
SET ANSI_PADDING ON
GO
CREATE TABLE [dbo].[UserInfo](
	[UserId] [int] IDENTITY(1,1) NOT NULL,
	[UserName] [varchar](50) NULL,
	[UserPwd] [varchar](50) NULL,
	[UserTel] [bigint] NULL,
	[UserEmail] [varchar](50) NULL,
	[userDate] [date] NULL,
	[CreateTime] [datetime] NULL,
PRIMARY KEY CLUSTERED 
(
	[UserId] ASC
)WITH (PAD_INDEX  = OFF, STATISTICS_NORECOMPUTE  = OFF, IGNORE_DUP_KEY = OFF, ALLOW_ROW_LOCKS  = ON, ALLOW_PAGE_LOCKS  = ON) ON [PRIMARY]
) ON [PRIMARY]
GO
SET ANSI_PADDING OFF
GO


Create table SmsInfo(
	Id int primary key identity,
	Code int,
	TelPhone bigint,
	CreateTime datetime,
	ExpireTime datetime
);

第二步、创建实体类库MiShop.Model并添加一个UserInfo实体类

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;

namespace MiShop.Model
{
    /// <summary>
    /// 用户信息表实体类
    /// </summary>
    public class UserInfo
    {
        /// <summary>
        /// 无参构造
        /// </summary>
        public UserInfo()
        {
        }
        /// <summary>
        /// 全参构造
        /// </summary>
        /// <param name="userId"></param>
        /// <param name="userName"></param>
        /// <param name="userPwd"></param>
        /// <param name="userTel"></param>
        /// <param name="userEmail"></param>
        /// <param name="userDate"></param>
        /// <param name="createTime"></param>
        public UserInfo(int userId, string userName, string userPwd, long userTel, string userEmail, DateTime userDate, DateTime createTime)
        {
            UserId = userId;
            UserName = userName;
            UserPwd = userPwd;
            UserTel = userTel;
            UserEmail = userEmail;
            UserDate = userDate;
            CreateTime = createTime;
        }
        //用户编号
        public int UserId { get; set; }
        //用户名
        public string UserName { get; set; }
        //用户密码
        public string UserPwd { get; set; }
        //用户手机号码
        public Int64 UserTel { get; set; }
        //用户邮箱
        public string UserEmail { get; set; }
        //用户生日
        public DateTime UserDate { get; set; }
        //创建时间
        public DateTime CreateTime { get; set; }
    }
}

第三步、创建工具类库MiShop.Core并添加一个SqlHelper类用于数据库操作

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Configuration;
using System.Data.SqlClient;

namespace MiShop.core
{
    public class SqlHelper
    {
        //读取Web配置文件连接字符串
        private string connString = ConfigurationManager.AppSettings["connStr"];

        /// <summary>
        /// 增删改
        /// </summary>
        /// <param name="sql"></param>
        /// <param name="parameters"></param>
        /// <returns></returns>
        public int ExcuteNoQuery(string sql, SqlParameter[] parameters)
        {
            int result = -1;
            SqlConnection conn = null;
            try
            {
                //创建连接对象
                conn = new SqlConnection(connString);
                //打开连接
                conn.Open();
                //创建操作对象
                SqlCommand command = new SqlCommand(sql, conn);
                //预处理
                if (parameters != null)
                {
                    command.Parameters.AddRange(parameters);
                }
                //处理返回结果
                result = command.ExecuteNonQuery();

                return result;
            }
            catch (Exception ex)
            {

                return result;
            }
            finally
            {
                conn.Close();
            }
        }

        /// <summary>
        /// 查询方法
        /// </summary>
        /// <param name="sql"></param>
        /// <param name="parameters"></param>
        /// <returns></returns>
        public int ExcuteReader(string sql, SqlParameter[] parameters)
        {
            int result = -1;
            SqlConnection conn = null;
            try
            {
                //创建连接对象
                conn = new SqlConnection(connString);
                //打开连接
                conn.Open();
                //创建操作对象
                SqlCommand command = new SqlCommand(sql, conn);
                //预处理
                if (parameters != null)
                {
                    command.Parameters.AddRange(parameters);
                }
                //处理返回结果
                SqlDataReader reader = command.ExecuteReader();
                if (reader.Read())
                {
                    result = 1;
                }
                return result;
            }
            catch (Exception ex)
            {

                return result;
            }
            finally
            {
                conn.Close();
            }
        }
    }
}

第三步、创建数据访问层类库MiShop.DAL并添加UserInfoRepository类

第四步、创建业务逻辑层类库MiShop.BLL并添加UserInfoService类

第五步、在UI层Web.config中配置数据库连接字符串

第六步、给各个类添加引用

1.数据访问层引用--实体类和工具类

2.业务逻辑层引用--实体类和数据库访问层

3.UI层引用--业务逻辑层和实体类

第七步、在数据访问层UserInfoRepository中添加新增用户信息方法

 /// <summary>
        /// 数据访问层添加用户信息方法
        /// </summary>
        /// <param name="userInfo"></param>
        /// <returns></returns>
        public int AddUserInfo(UserInfo userInfo)
        {
            string sql = @"insert into UserInfo(UserName, UserPwd, UserTel, UserEmail, userDate, CreateTime) Values(@UserName,@UserPwd,@UserTel,null,null,@CreateTime);";
            SqlParameter[] parameters = {
            new SqlParameter(){
                DbType = DbType.String,
                ParameterName="@UserName",
                Value = userInfo.UserName
            },
            new SqlParameter(){
                DbType = DbType.String,
                ParameterName="@UserPwd",
                Value = userInfo.UserPwd
            },
            new SqlParameter(){
                DbType = DbType.Int64,
                ParameterName="@UserTel",
                Value = userInfo.UserTel
            },
            new SqlParameter(){
                DbType = DbType.DateTime,
                ParameterName="@CreateTime",
                Value = DateTime.Now
            }
            };
            SqlHelper helper = new SqlHelper();
            return helper.ExcuteNoQuery(sql, parameters);
        }

第八步、在业务逻辑层UserInfoService类中添加新增用户信息方法，调用数据访问层方法进行数据操作

 /// <summary>
        /// 注册
        /// </summary>
        /// <param name="userInfo"></param>
        /// <returns></returns>
        public int AddUserInfo(UserInfo userInfo)
        {
            UserInfoRepository userInfoRepository = new UserInfoRepository();
            return userInfoRepository.AddUserInfo(userInfo);
        }

第九步、在注册页面对应控制器中添加SaveUserInfo方法，用于保存UI层传递的数据并调用业务逻辑层方法

 // GET: Login
        /// <summary>
        /// 注册页面控制器方法
        /// </summary>
        /// <param name="userInfo"></param>
        /// <returns></returns>
        public JsonResult SaveUserInfo(UserInfo userInfo)
        {
            OperateResult result = new OperateResult();
            UserInfoService service = new UserInfoService();
            result.Success = service.AddUserInfo(userInfo) >0;
            return Json(result);
        }

第十步、在UI层页面中使用Ajax保存页面数据并提交到控制器中

                    var data = {};
                    data.UserName = $("#username").val();
                    data.UserPwd = $("#password").val();
                    data.UserTel = $("#tel").val();
                    alert(data.UserName + data.UserPwd + data.UserTel);
                    $.ajax({
                        url: "/Login/SaveUserInfo",
                        data: data,
                        type: "post",
                        success: function (result) {
                            if (result.Success) {
                                alert("注册成功");
                                window.location.href("/Home/Login");
                            }
                            else {
                                alert("注册失败");
                            }
                        }
                    })

第十一步、给用户名、密码、手机号加上正则表达式校验

 //校验密码：只能输入6-20个字母、数字、下划线 
			function CheckPassword(){
                var password = $("#password").val();
				var reg = /^(\w){6,20}$/;
                if (reg.test(password)) {
                    $("#uPwd").text("");
/*                    $("#uPwd").css("color", "green");*/
                    return true;
                } else {
                    $("#uPwd").text("只能输入6-20个字母、数字、下划线");
                    $("#uPwd").css("color", "red");
                    return false;
                }
            }

            //校验确认密码：是否相等
            function CheckRePwd() {
                var password = $("#password").val();
                var rePwd = $("#rePwd").val();
                if (rePwd == "") {
                    $("#uRePwd").text("确认密码不能为空");
                    $("#uRePwd").css("color", "red");
                    return false;
                }
                if (rePwd != password) {
                    $("#uRePwd").text("两次密码输入不一致");
                    $("#uRePwd").css("color", "red");
                    return false;
                } else {
                    $("#uRePwd").text("");
/*                    $("#uRePwd").css("color", "green");*/
                    return true;
                }
            }

			
			
			//校验登录名：不能包含汉字
			function CheckUserName(){
                var username = $("#username").val();
                if (username=="")
                {
                    $("#uName").text("用户名不能为空");
                    $("#uName").css("color", "red");
                    return false;
                }
				var reg = /[\u4E00-\u9FA5]/g;
                if (reg.test(username)) {
                    $("#uName").text("用户名不能包含汉字！");
                    $("#uName").css("color", "red");
                    return false;

                } else {

                    if (QueryUserName()) {
                        $("#uName").text("");
                        $("#uName").css("color", "green");
                        return true;
                    } else {
                        return false;
                    }
                }
            }


            //校验手机号：要求11位
			function CheckUserTel(){
                var tel = $("#tel").val();
                if (tel=="")
                {
                    $("#uTel").text("手机号不能为空");
                    $("#uTel").css("color", "red");
                    return false;
                }
				var reg = /^1([38]\d|5[0-35-9]|7[3678])\d{8}$/;
                if (reg.test(tel)) {
                    $("#uTel").text("");
                    /*$("#uTel").css("color", "green");*/
                    /*if (QueryUserTel()) {*/
                       /* $("#uTel").text("");*/
                       /* $("#uTel").css("color", "green");*/
                        return true;
                   /* }
                    else {
                        return false;
                    }*/
                } else {
                    $("#uTel").text("手机号必须为11位");
                    $("#uTel").css("color", "red");
                    return false;
                }
            }

第十二步、校验用户名和手机是否已存在

1.在数据访问层UserInfoRepository类中添加手机号查询方法和用户名查询方法

 /// <summary>
        /// 验证手机号是否存在
        /// </summary>
        /// <param name="userInfo"></param>
        /// <returns></returns>
        public int CheckUserTel(UserInfo userInfo)
        {
            string sql = "select UserTel from UserInfo where UserTel=@UserTel";
            SqlParameter[] parameters = {
            new SqlParameter(){
                DbType = DbType.String,
                ParameterName="@UserTel",
                Value = userInfo.UserTel
            }
            };
            SqlHelper helper = new SqlHelper();
            return helper.ExcuteReader(sql, parameters);
        }

        /// <summary>
        /// 验证用户名是否存在
        /// </summary>
        /// <param name="userInfo"></param>
        /// <returns></returns>
        public int CheckUserName(UserInfo userInfo)
        {
            string sql = "select UserName from UserInfo where UserName=@UserName";
            SqlParameter[] parameters = {
            new SqlParameter(){
                DbType = DbType.String,
                ParameterName="@UserName",
                Value = userInfo.UserName
            }
            };
            SqlHelper helper = new SqlHelper();
            return helper.ExcuteReader(sql, parameters);
        }

2.在业务逻辑层UserInfoService类中添加查询方法，用于调用数据访问层方法

/// <summary>
        /// 验证手机号是否存在
        /// </summary>
        /// <param name="userInfo"></param>
        /// <returns></returns>
        public int CheckUserTel(UserInfo userInfo)
        {
            UserInfoRepository userInfoRepository = new UserInfoRepository();
            return userInfoRepository.CheckUserTel(userInfo);
        }

        /// <summary>
        /// 验证用户名是否存在
        /// </summary>
        /// <param name="userInfo"></param>
        /// <returns></returns>
        public int CheckUserName(UserInfo userInfo)
        {
            UserInfoRepository userInfoRepository = new UserInfoRepository();
            return userInfoRepository.CheckUserName(userInfo);
        }

3.在控制器中添加查询手机号和用户名方法，用于接收UI层传递的数据

/// <summary>
        /// 查询手机号是否存在
        /// </summary>
        /// <param name="userInfo"></param>
        /// <returns></returns>
        public JsonResult QueryUserTel(UserInfo userInfo)
        {

            OperateResult result = new OperateResult();
            UserInfoService service = new UserInfoService();
            result.Success = service.CheckUserTel(userInfo) > 0;
            return Json(result);
        }

        /// <summary>
        /// 查询用户名是否存在
        /// </summary>
        /// <param name="userInfo"></param>
        /// <returns></returns>
        public JsonResult QueryUserName(UserInfo userInfo)
        {

            OperateResult result = new OperateResult();
            UserInfoService service = new UserInfoService();
            result.Success = service.CheckUserName(userInfo) > 0;
            return Json(result);
        }

4.在UI层页面中使用Ajax上传数据到控制器中

 //验证用户名是否存在
            function QueryUserName()
            {
               var data = {};
               data.UserName = $("#username").val();
               $.ajax({
                       url: "/Login/QueryUserName",
                       data: data,
                       type: "post",
                   success: function (result) {
                       if (result.Success) {
                           $("#uName").text("用户名已存在");
                           $("#uName").css("color", "red");
                           userName = false;
                           return userName;
                       }
                       else {
                          $("#uName").text("");
                         /*  $("#uName").css("color", "green");*/
                           userName = true;
                           return userName;
                       }
                   }
               })
                return userName;
            }

             //验证手机号是否存在
            function QueryUserTel() {           
                var data = {};
                data.UserTel = $("#tel").val();
                $.ajax({
                    url: "/Login/QueryUserTel",
                    data: data,
                    type: "post",
                    success: function (result) {
                        if (result.Success) {
                            $("#uTel").text("手机号已存在");
                            $("#uTel").css("color", "red");
                            tel = false;
                            return tel;
                        }
                        else {
                            $("#uTel").text("");
             /*               $("#uTel").css("color", "green");*/
                            tel = true;
                            return tel;
                        }
                    }
                })
                return tel;
            }

第十三步、实现发送验证码功能并校验

1.创建第三方类库MiShop.Remote

2.引入第三方短信发送类

3.在Web.config配置appId和appKey

4.在实体类添加SmsInfo类

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;

namespace MiShop.Mode
{
    public class SmsInfo
    {
        public int Id { get; set; }

        public int Code { get; set; }

        public Int64 TelPhone { get; set; }

        public DateTime CreateTime { get; set; }

        public DateTime ExpireTime { get; set; }

        public SmsInfo()
        {

        }

        public SmsInfo(int id, int code, long telPhone, DateTime createTime, DateTime expireTime)
        {
            Id = id;
            Code = code;
            TelPhone = telPhone;
            CreateTime = createTime;
            ExpireTime = expireTime;
        }
    }
}

5.在数据访问层添加SmsInfoRepository类并添加添加短信发送记录和查询验证码方法

/// <summary>
        /// 添加短信发送记录
        /// </summary>
        /// <param name="userInfo"></param>
        /// <returns></returns>
        public int AddSmsInfo(SmsInfo smsInfo)
        {
            string sql = @"insert into SmsInfo(Code,TelPhone,CreateTime,ExpireTime) Values(@Code,@TelPhone,@CreateTime,@ExpireTime);";
            SqlParameter[] parameters = {
            new SqlParameter(){
                DbType = DbType.Int32,
                ParameterName="@Code",
                Value = smsInfo.Code
            },
            new SqlParameter(){
                DbType = DbType.Int64,
                ParameterName="@TelPhone",
                Value = smsInfo.TelPhone
            },
            new SqlParameter(){
                DbType = DbType.DateTime,
                ParameterName="@CreateTime",
                Value = DateTime.Now
            },
            new SqlParameter(){
                DbType = DbType.DateTime,
                ParameterName="@ExpireTime",
                Value = DateTime.Now.AddMinutes(5)
            }
            };
            SqlHelper helper = new SqlHelper();
            return helper.ExcuteNoQuery(sql, parameters);
        }

        /// <summary>
        /// 查询验证码
        /// </summary>
        /// <param name="smsInfo"></param>
        /// <returns></returns>
        public int QueryCode(SmsInfo smsInfo)
        {
            string sql = "select Code from SmsInfo where Code=@Code and TelPhone=@TelPhone and ExpireTime>@ExpireTime";
            SqlParameter[] parameters = {
            new SqlParameter(){
                DbType = DbType.Int32,
                ParameterName="@Code",
                Value = smsInfo.Code
            },
            new SqlParameter(){
                DbType = DbType.Int64,
                ParameterName="@TelPhone",
                Value = smsInfo.TelPhone
            },
            new SqlParameter(){
                DbType = DbType.DateTime,
                ParameterName="@ExpireTime",
                Value = DateTime.Now
            }
            };
            SqlHelper helper = new SqlHelper();
            return helper.ExcuteReader(sql, parameters);
        }

6.在业务逻辑层添加SmsInfoService类并添加发送验证码和查询验证码方法，在发送验证码方法里，获取发送的的验证码并添加到数据库中

/// <summary>
        /// 发送验证码
        /// </summary>
        /// <param name="tel"></param>
        /// <returns></returns>
        public bool SendCode(string tel)
        {
            TenXunYunSMS tenXunYunSMS = new TenXunYunSMS();
            try
            {
                //获取appId和appKey
                tenXunYunSMS.appId = Convert.ToInt32(ConfigurationManager.AppSettings["appId"]);
                tenXunYunSMS.appKey = ConfigurationManager.AppSettings["appKey"];
                //发送验证码
                tenXunYunSMS.SetSMS(tel);
            }
            catch (Exception)
            {
                /*Console.WriteLine(ex.Message);*/
                return false;
            }
            //将验证码添加到数据库
            SmsInfo smsInfo = new SmsInfo();
            smsInfo.Code = tenXunYunSMS.Code;
            smsInfo.TelPhone = Convert.ToInt64(tel);
            SmsInfoRepository smsInfoRepository = new SmsInfoRepository();
            return smsInfoRepository.AddSmsInfo(smsInfo)>0;

        }

        /// <summary>
        /// 查询验证码
        /// </summary>
        /// <param name="smsInfo"></param>
        /// <returns></returns>
        public int QueryCode(SmsInfo smsInfo)
        {
            SmsInfoRepository smsInfoRepository = new SmsInfoRepository();
            return smsInfoRepository.QueryCode(smsInfo);
        }

7.新建一个Common的控制器，在控制器中添加发送验证码和校验验证码功能，获取UI层传递的数据

 public class CommonController : Controller
    {
        // GET: Common
        /// <summary>
        /// 获取手机号发送验证码
        /// </summary>
        /// <param name="tel"></param>
        /// <returns></returns>
        public JsonResult SendCode(string tel)
        {
            OperateResult result = new OperateResult();
            SmsInfoService sms = new SmsInfoService();
            result.Success= sms.SendCode(tel);
            return Json(result);

        }

        /// <summary>
        /// 校验验证码
        /// </summary>
        /// <param name="smsInfo"></param>
        /// <returns></returns>
        public JsonResult VaildataCode(SmsInfo smsInfo)
        {
            OperateResult result = new OperateResult();
            SmsInfoService sms = new SmsInfoService();
            result.Success=sms.QueryCode(smsInfo) > 0;
            return Json(result);

        }
    }

8.在UI层页面中使用Ajax提交数据到控制器中

var data = {};
                    data.UserTel = $("#tel").val();
                    $.ajax({
                        url: "/Login/QueryUserTel",
                        data: data,
                        type: "post",
                        success: function (result) {
                            if (result.Success) {
                                $("#uTel").text("手机号已存在");
                                $("#uTel").css("color", "red");
                            }
                            else {
                                $("#uTel").text("");
                                /*$("#uTel").css("color", "green");*/
                                var telphone = $("#tel").val();
                                $.ajax({
                                    url: "/Common/SendCode?tel=" + telphone,
                                    type: "post",
                                    success: function (result) {
                                        if (result.Success) {
                                            IntervalCo();
                                        }
                                        else {
                                            alert("发送失败！");

                                        }
                                    }
                                })
                            }
                        }
                    });


//校验验证码
                var data = {};
                data.TelPhone = $("#tel").val();
                data.Code = $("#Code").val();
                $.ajax({
                    url: "/Common/VaildataCode",
                    data: data,
                    type: "post",
                    success: function (result) {
                        if (result.Success) {
                            Reg();
                        }
                        else {

                        }
                    }
                })

第十四步、实现失去焦点校验输入是否正确和注册按钮点击事件

1.在对应的表单输入框添加失去焦点事件，在方法中调用正则表达式方法

//失去焦点事件
            $("#password").blur(function () {
                pwd = CheckPassword();

            });
            $("#username").blur(function () {
                userName = CheckUserName();

            });
            $("#tel").blur(function () {
                 tel =CheckUserTel();

            });
            $("#rePwd").blur(function () {
                rePwd= CheckRePwd();

            });

2.在点击注册按钮时调用校验验证码方法，校验成功则调用注册方法，若正则表达式校验和用户名手机号是否存在校验正确，则注册成功

//注册按钮点击事件
            $("#btn").click(function () {
                //校验验证码
                var data = {};
                data.TelPhone = $("#tel").val();
                data.Code = $("#Code").val();
                $.ajax({
                    url: "/Common/VaildataCode",
                    data: data,
                    type: "post",
                    success: function (result) {
                        if (result.Success) {
                            Reg();
                        }
                        else {

                        }
                    }
                })
            });

            //注册
            function Reg()
            {
                alert(userName +""+ rePwd +""+ pwd);
                 if (pwd && userName && rePwd) {
                    var data = {};
                    data.UserName = $("#username").val();
                    data.UserPwd = $("#password").val();
                    data.UserTel = $("#tel").val();
                    alert(data.UserName + data.UserPwd + data.UserTel);
                    $.ajax({
                        url: "/Login/SaveUserInfo",
                        data: data,
                        type: "post",
                        success: function (result) {
                            if (result.Success) {
                                alert("注册成功");
                                window.location.href("/Home/Login");
                            }
                            else {
                                alert("注册失败");
                            }
                        }
                    })
                }
                else {
                    alert("请正确填写信息");
                }
            }

Jdouble

关注

1
点赞
踩
2

收藏

觉得还不错? 一键收藏
0
评论
.NET MVC Web项目注册流程

第一步、创建数据库和表Create database MiShop02;USE [MiShop02]GO/****** Object: Table [dbo].[UserInfo] Script Date: 07/25/2019 11:57:49 ******/SET ANSI_NULLS ONGOSET QUOTED_IDENTIFIER ONGOSET ANS...
复制链接

扫一扫