ASP.Net学习（七）

最新推荐文章于 2023-05-26 22:53:13 发布

挑战不可

最新推荐文章于 2023-05-26 22:53:13 发布

阅读量328

点赞数

分类专栏： Asp.Net学习文章标签： asp.net

本文链接：https://blog.csdn.net/qq_42612120/article/details/107477963

版权

Asp.Net学习专栏收录该内容

17 篇文章 9 订阅

订阅专栏

本文详细介绍了自动登录功能的实现方法，包括用户信息验证、Cookie存储与读取、MD5加密等关键步骤。同时，深入探讨了AJAX技术，讲解了其工作原理、优势及如何使用XMLHttpRequest对象进行GET和POST请求。

摘要由CSDN通过智能技术生成

1.自动登录实现

<body>
    <form id="form1" runat="server">
        <div>
            用户名:<input type="text" name="txtName" value="<%=UserName%>" /><br />
            密&ensp;&ensp;码:<input type="password" name="txtPwd" /><br />
            验证码:<input type="text" name="txtCode" />
            <img src="ValidateImageCode.ashx" id="imgCode" />
            <a href="javascript:void(0)" id="validateCode">看不清</a><br />
            <input type="submit" value="登录" />
            <input  type="checkbox" name="autoLogin" value="auto" id="checkId" on="xuanze()"/>自动登录
            <span style="font-size: 14px; color: red">
                <%=Msg %></span>
        </div>
    </form>
</body>

using System;
using System.Collections.Generic;
using _0715StudentProject.Model;
using _0715StudentProject.Common;
using _0715StudentProject.BLL;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;

public partial class _2020_07_19_UserLogin : System.Web.UI.Page
{

    public string Msg { get; set; }
    public string UserName { get; set; }
    protected void Page_Load(object sender, EventArgs e)
    {
        if (IsPostBack)
        {
            // string userName = Request.Form["txtxName"];
            //UserName = userName;
            if (CheckValidateCode())//判断验证码正确与否
            {
                CheckUserInfo();
            }
            else
            {
                //验证码错误
                Msg = "验证码错误！！";
            }
        }

        else
        {
            //判断Cookie中的值
            CheckCookieInfo();
        }
    }

    #region 检验Cookie中的值
    protected void CheckCookieInfo()
    {
        if (Request.Cookies["tsp1"] !=null && Request.Cookies["tsp2"] != null)
        {
            string userName = Request.Cookies["tsp1"].Value;
            string userPwd = Request.Cookies["tsp2"].Value;
            //校验
            UserInfoService userInfoService = new UserInfoService();
            UserInfo userInfo = userInfoService.GetUserInfoByName(userName);
            if (userInfo!=null)
            {
                //注意：在添加用户或者注册用户时一定要将用户输入的密码加密后在存储到数据库中
                if (userPwd == WebCommon.GetMd5String(WebCommon.GetMd5String(userInfo.UserPass)))
                {
                    Session["userInfo"] = userInfo;
                    Response.Redirect("UserInfoList.aspx");
                }
            }
            Response.Cookies["tsp1"].Expires = DateTime.Now.AddDays(-1);
            Response.Cookies["tsp2"].Expires = DateTime.Now.AddDays(-1);
        }
    }
    #endregion

    #region 判断用户名  密码
    protected void CheckUserInfo()
    {
        //获取用户输入的用户名  密码
        string userName = Request.Form["txtName"];
        UserName = userName;
        string userPwd = Request.Form["txtPwd"];
        //校验用户名和密码
        UserInfoService userInfoService = new UserInfoService();
        string msg = string.Empty;
        UserInfo userInfo = null;
        //判断用户名  密码
        if (userInfoService.ValidateUserInfo(userName, userPwd, out msg, out userInfo))
        {
            //判断用户是否选择了 【自动登录】  按钮
            //页面上有多个复选框时，只能选中复选框的值提交到服务端
            if (!string.IsNullOrEmpty(Request.Form["autoLogin"]))
            {
                HttpCookie cookie1 = new HttpCookie("tsp1",userName);
                HttpCookie cookie2 = new HttpCookie("tsp2",WebCommon.GetMd5String(WebCommon.GetMd5String(userPwd)));
                cookie1.Expires = DateTime.Now.AddDays(7);
                cookie2.Expires = DateTime.Now.AddDays(7);
                Response.Cookies.Add(cookie1);
                Response.Cookies.Add(cookie2);
            }
            Session["userInfo"] = userInfo;
            Response.Redirect("UserInfoList.aspx");
        }
        else
        {
            Msg = msg;
        }
    }
    #endregion

    #region  判断验证码正确与否
    protected bool CheckValidateCode()
    {
        bool isSucess = false;
        if (Session["validateCode"] != null)//在使用Session时一定要检验是否为空
        {
            string txtCode = Request.Form["txtCode"];//获取用户输入的验证码
            string sysCode = Session["validateCode"].ToString();
            if (sysCode.Equals(txtCode, StringComparison.InvariantCultureIgnoreCase))
            {
                isSucess = true;
                Session["validateCode"] = null;
            }
        }
        return isSucess;
    }
    #endregion
}

2.AJAX

jkhjkkhjul法国如果

AJAX:Asynchronous JavaScript and XML

中文意思：异步JavaScript和XML。指一种创建交互式网页应用的网页开发技术。AJAX并非缩写词,而是由Jesse James Gaiiett创造的名词。

不是指一种单一的技术，而是有机地利用了一系列相关的技术：

web标准( Standards-Based Presentation )XHTML+CSS的表示,使用 DOM( Document Object Model )进行动态显示及交互,使用 XML 和 XSLT 进行数据交换及相关操作,使用 XMLHttpRequest 进行异步数据查询、检索。

简单理解为：JavaScript + XMLHttpRequest + CSS +服务器端的集合。

Ajax在本质上是一个浏览器端的技术，Ajax技术之主要目的在于局部交换客户端及服务器间之数据。这个技术的主角XMLHttpRequest 的最主要特点，在于能够不用重新载入整个版面来更新资料，也就是所谓的Refresh without Reload(轻刷新)与服务器之间的沟通，完全是透过Javascript 来实行。使用XMLHttpRequest 本身传送的数据量很小，所以反应会更快，也就让网络程式更像一个桌面应用程序。AJAX 就是运用Javascript 在后台悄悄帮你去跟服务器要资料，最后再由Javascript 或DOM 来帮你呈现结果，因为所有动作都是由Javascript 代劳，所以省去了网页重载的麻烦

3.为XMLHttpRequest对象设置请求参数

GET方式

xhr.open("GET", "GetAreasByAjax.ashx?isAjax=1", true); GET方式请求可以设置浏览器不使用缓存。
xhr.setRequestHeader("If-Modified-Since", "0");发送: xhr.send(null);//GET方式

POST方式：

设置参数：xhr.open("POST", "GetAreasByAjax.aspx", true);

添加请求头：xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");

发送：xhr.send("isAjax=1&na=123");//POST方式

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="AjaxDemo.aspx.cs" Inherits="_2020_7_20_AjaxDemo" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title></title>
    <script src="../js/jquery-1.7.1.js"></script>
    <script type="text/javascript">
        $(function () {
            $("#btnGetDate").click(function () {
                //开始通过AJAX向服务器发送请求
                var xhr;
                if (XMLHttpRequest) {//表示用户使用高版本IE，谷歌 火狐等
                    xhr = new XMLHttpRequest();
                } else {//低IE
                    xhr = new ActiveXObject("Microsoft.XMLHTTP");
                }
                xhr.open("get", "GetDate.ashx?name=zhangsan&age=12", true);
                xhr.send();//开始发送
                //回调函数：当服务器将数据发挥给浏览器后，自动调用该方法。
                xhr.onreadystatechange = function () {
                    if (xhr.readyState == 4) {//表示服务端已经将会数据完整返回，并且浏览器全部接受完毕
                        if (xhr.status == 200) {//判断状态码是否为200
                            alert(xhr.responseText);
                        }
                    }
                }
            });
        });
    </script>
</head>

<body>
    <form id="form1" runat="server">
        <div>
            <input type="button" value="获取服务端时间" id="btnGetDate" />
        </div>
    </form>
</body>
</html>

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="AjaxPostDemo.aspx.cs" Inherits="_2020_7_20_AjaxPostDemo" %>

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title></title>
    <script src="../js/jquery-1.7.1.js"></script>
    <script type="text/javascript">
        $(function () {
            $("#btnPost").click(function () {
                var xhr;
                if (XMLHttpRequest) {
                    xhr = new XMLHttpRequest();
                } else {
                    xhr = new ActiveXObject("Miscrosoft.XMLHTTP");
                }
                xhr.open("post", "GetDate.ashx", true);
                xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
                xhr.send("name=zhangsan&pwd=12");
                xhr.onreadystatechange = function () {
                    if (xhr.readyState == 4) {
                        if (xhr.status == 200) {
                            alert(xhr.responseText);
                        }
                    }
                }
            });
        });
    </script>
</head>
<body>
    <form id="form1" runat="server">
        <div>
            <input type="button" value="获取数据" id="btnPost" />
        </div>
    </form>
</body>
</html>

4.传值练习

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="JqueryAjax.aspx.cs" Inherits="_2020_7_20_JqueryAjax" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title></title>
    <script src="../js/jquery-1.7.1.js"></script>
    <script type="text/javascript">
        $(function () {
            $("#btnGet").click(function () {
                $.get("GetDate.ashx", { "name": "lisi", "pwd": "123" }, function (data) {
                    alert(data);
                });
            });

            $("#btnPost").click(function () {
                $.post("ShowData.aspx", { "name": "lisi", "pwd": "123" }, function (data) {
                    alert(data);
                });
            });

            $("#btnAjax").click(function () {
                $.ajax({
                    type: "POST",
                    url: "GetDate.ashx",
                    data: "name=John&loaction=Boston",
                    success: function (msg) {
                        alert("Data Save:" + msg);
                    }
                });
            });
        });
    </script>
</head>
<body>
    <form id="form1" runat="server">
        <div>
            <input type="button" value="GET获取数据" id="btnGet" />
            <input type="button" value="POST获取数据" id="btnPost" />
            <input type="button" value="AJAX获取数据" id="btnAjax" />
        </div>
    </form>
</body>
</html>