页面登陆(一)

页面登陆(一)
开发工具与关键技术:Visual Studio 2015 页面登陆
作者:袁何恩
撰写时间:2019年5月8日
今天,我要和大家分享的技术是页面登陆。
我们都知道每个项目或软件都有登陆页面,用来保护用户的信息和隐私安全,还有记录用户的登陆信息和次数,因为用户不只是一个人,因为项目或软件面对的是多数人,所以登陆页面不只是用来保护用户的信息和隐私安全和记录用户的登陆信息和次数,还来区分用户和用户之间的不同,保证每个用户的信息在页面都是独一无二的,根据用户的信息来获取到不同的数据。页面登陆还包括用户的注册和验证码的验证,我这里就不演示用户的注册了,直接就是用户登陆和验证码的验证,当然其中会包括数据库的信息的建立,这些就不写入了数据库的信息的建立。
下面我演示的项目是我新建的项目,和以前的不一样。
一、 在项目中创建页面登陆的视图,在里面写好视图的代码,再引用layui的插件,接下来是js的部分了,首先声明变量来接收控制器中传来的数据,传来的数据是字符串,也就是获取控制器中的值,登陆页面代码的执行步骤最重要的是逻辑步骤合理,一定要符合逻辑,还要逻辑步骤严密,不能有逻辑错误的情况出现,页面登陆的视图代码如下:
$("#btnSubmit").click(function () {
var UserNuber = $(’#fmLogin [name=“UserNuber”]’).val();
var password = $(’#fmLogin [name=“password”]’).val();
var validCode = $(’#fmLogin [name=“validCode”]’).val();
var UserTypeClass = $(’#fmLogin [name=“UserTypeClass”]’).val();
var rememberMe = $(’#fmLogin [name=“rememberMe”]:checked’).val();
);
“btnSubmit”是登陆按钮的ID,“val”是去字符串的空格。
二、接下来是在控制器中写入页面登陆的代码,首先声明string类型的变量来接收字符串,当然还有数据的判断,判断数据是否为空,用户每次登陆进去,都保存一些数据在浏览器中,这些数据叫cookie,代码图如下:
在这里插入图片描述
图中的是“isRember”是布尔值,首先声明bool类型的变量来接收isRember,只有false和true两种情况,没有其他的情况,获取cookie中的值,“UserNuber”是用户账号,“Password”是用户密码,“UserTypeClass”是验证码,用户每次登陆的验证码都不一样,所以需要判断,其中代码如:
UserNuber = System.Web.HttpContext.Current.Server.UrlDecode(cookie[“UserNuber”]);是从数据库中获取用户账号信息。用户登陆是根据页面的获取到的用户账号,去数据库中匹配用户账号相应的用户密码,再与页面的用户密码判断是否相同,所以需要判断用户密码和用户账号、验证码是否为空,
然后把数据传递到页面,数据传递到页面有两个方法,一个方法的代码如下:
ViewData[“UserNuber”] = UserNuber;
ViewData[“Password”] = Password;
ViewData[“UserTypeClass”] = UserTypeClass;
ViewData[“isRember”] = isRember;
另一个方法的代码如图下:
在这里插入图片描述
一个是数据放进去是什么类型,拿出来就是什么类型,运行时间久;一个是数据放进去是什么类型,拿出来还要转换一下类型,运行时间快。
二、把页面传来的数据进行判断,和打开加载层。代码图如下:
在这里插入图片描述
图中“var layerIndex = layer.load();”是打开加载层意思,if()是判断是否填写数据意思,用户可能不填入数据,“UserNuber”是用户账号,“Password”是用户密码,“UserTypeClass”是验证码,用户每次登陆的验证码都不一样,是所以需要判断。
三、接下来是在控制器中写入页面登陆的代码,判断数据是否为空,否则返回相应的弹出层的提示。代码图如下:
在这里插入图片描述
KaTeX parse error: Expected 'EOF', got '#' at position 3: ("#̲password").val(…("#validCode").val("");
是清空密码和验证码的意思,因为每次都不一样,验证码也不一样。
$("#validCodeImg").click();是验证码刷新的意思,

猜你喜欢

转载自blog.csdn.net/weixin_44561769/article/details/89969365