使用AjaxPro框架实现无刷新用户登录验证【原创】

最新推荐文章于 2024-08-27 15:45:36 发布

原创最新推荐文章于 2024-08-27 15:45:36 发布 · 3.9k 阅读

·

0

·

CC 4.0 BY-SA版权

版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。

文章标签：

#框架 #login #string #javascript #button #class

Ajax 专栏收录该内容

8 篇文章

订阅专栏

本文介绍如何使用AjaxPro框架实现网页无刷新登录验证功能，包括配置web.config、注册Ajax方法及前后端交互流程。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

操作环境:Visual Studio.Net2003
操作系统:window Xp SP2

AjaxPro.dll下载地址:

http://download1.youkuaiyun.com/down3/20070612/12092627946.dll

如果您有任何意见,请留下您宝贵的意见以便告知

==============================================================================

利用AjaxPro框架实现无刷新用户登录验证,这个框架的重点在于三个配置

首先是web.config里面的配置信息

其次是PageLoad里面的注册

（1）首先要在项目中引用AjaxPro.dll,

（2）然后在页面中Using AjaxPro;

AjaxPro.Utility.RegisterTypeForAjax(typeof(frm_login));

最后就是写Ajax方法

/// <summary>
  /// 用户登录验证:声明为Ajax方法，被前台调用
  /// </summary>
  [AjaxPro.AjaxMethod]
  public string UserLogin(string strName,string strPwd)
  {
   try
   {
    m_emp.Username = strName;
    m_emp.Password = strPwd;
    m_emp.LoginVerify();
    return m_emp.MySqlCommand.Parameters["@RETURN_VALUE"].Value.ToString();
   }
   catch(Exception errExce)
   {
    return errExce;
   }
   finally
   {
   }
  }

最后一步就是前台的调用，获取服务器端传过来的值

<script type="text/javascript" language="javascript">
        function userLogin()
        {
            var userName =  document.frm_login.userName.value;
            var userPassword = document.frm_login.userPassword.value;

            var result =    MyProject.Webs.tabContent.frm_login.UserLogin(userName,userPassword);

            if(userName == "")
            {
                alert("请输入用户名！");
                return;
            }
            else if(userPassword == "")
            {
                alert("请输入密码！");
                return;
            }

            if(result.value == 2)
            {
                alert("用户名不存在");
            }
            else if(result.value == 1)
            {
                alert("密码不存在");
            }
            else
            {
            alert("验证成功");
            }
        }
        </script>

下面是个完整的用户登录验证例子：

Login.aspx(HTML代码如下)

<%@ Page language="c#" Codebehind="Login.aspx.cs" AutoEventWireup="false" Inherits="MyProject.Webs.tabContent.frm_login" %>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" >
<HTML>
    <HEAD>
        <title>Login</title>
        <meta name="GENERATOR" Content="Microsoft Visual Studio .NET 7.1">
        <meta name="CODE_LANGUAGE" Content="C#">
        <meta name="vs_defaultClientScript" content="JavaScript">
        <meta name="vs_targetSchema" content="http://schemas.microsoft.com/intellisense/ie5">
        <script type="text/javascript" language="javascript">
        function userLogin()
        {
            var userName =  document.frm_login.userName.value;
            var userPassword = document.frm_login.userPassword.value;

            var result =    MyProject.Webs.tabContent.frm_login.UserLogin(userName,userPassword);

            if(userName == "")
            {
                alert("请输入用户名！");
                return;
            }
            else if(userPassword == "")
            {
                alert("请输入密码！");
                return;
            }

            if(result.value == 2)
            {
                alert("用户名不存在");
            }
            else if(result.value == 1)
            {
                alert("密码不存在");
            }
            else
            {
            alert("ok");
            }
        }
        </script>
    </HEAD>
    <body>
        <form id="frm_login" method="post" runat="server">
            <div>
                <table align="center" cellpadding="0" cellspacing="0" width="265" style="WIDTH: 265px; HEIGHT: 105px">
                    <tr>
                        <td height="25" colspan="2" align="center" class="title">登录</td>
                    </tr>
                    <tr>
                        <td width="86">用户名</td>
                        <td width="210"><INPUT id="userName" style="WIDTH: 168px; HEIGHT: 22px" type="text" size="22" name="txtUsername"></td>
                    </tr>
                    <tr>
                        <td>密码</td>
                        <td><INPUT id="userPassword" style="WIDTH: 168px; HEIGHT: 22px" type="password" size="22" name="txtPassword"></td>
                    </tr>
                    <tr>
                        <td></td>
                        <td align="right">
                            <input type="button" value="确定" class="button" onclick="userLogin()" id="btnLogin"> 
                            <input type="button" value="取消" class="button" onclick="parent.closeDiv(parent.userLogIn)">
                        </td>
                    </tr>
                </table>
            </div>
        </form>
    </body>
</HTML>

Login.ASPX.CS(后台)

using System;
using System.Collections;
using System.ComponentModel;
using System.Data;
using System.Drawing;
using System.Web;
using System.Web.SessionState;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.HtmlControls;
using AjaxPro;

using System.Data.SqlClient;

namespace MyProject.Webs.tabContent
{
    /// <summary>
    /// Login 的摘要说明。
    /// </summary>
    public class frm_login : System.Web.UI.Page
    {
        protected cEmployee m_emp = new cEmployee();

        private void Page_Load(object sender, System.EventArgs e)
        {
            AjaxPro.Utility.RegisterTypeForAjax(typeof(frm_login));
        }

        /// <summary>
        /// 用户登录验证:声明为Ajax方法，被前台调用
        /// </summary>
        [AjaxPro.AjaxMethod]
        public string UserLogin(string strName,string strPwd)
        {
            try
            {
                m_emp.Username = strName;
                m_emp.Password = strPwd;
                m_emp.LoginVerify();
                return m_emp.MySqlCommand.Parameters["@RETURN_VALUE"].Value.ToString();
            }
            catch(Exception errExce)
            {
                return errExce;
            }
            finally
            {
            }
        }

        #region Web 窗体设计器生成的代码
        override protected void OnInit(EventArgs e)
        {
            //
            // CODEGEN: 该调用是 ASP.NET Web 窗体设计器所必需的。
            //
            InitializeComponent();
            base.OnInit(e);
        }

        /// <summary>
        /// 设计器支持所需的方法 - 不要使用代码编辑器修改
        /// 此方法的内容。
        /// </summary>
        private void InitializeComponent()
        {
            this.ID = "frm_login";
            this.Load += new System.EventHandler(this.Page_Load);

        }
        #endregion
    }
}

cEmployee

using System;
using System.Data.SqlClient;
using System.Data;

namespace MyProject
{
    /// <summary>
    /// 员工信息类。
    /// </summary>
    public class cEmployee:cMyApp
    {
        /// <summary>
        /// '保持属性值的局部变量
        /// </summary>
        protected string m_Username;
        protected string m_Password;
        protected int     m_DeptID;
        protected int    m_Emp_ID;
        protected string m_Emp_Name;
        protected double m_Emp_Salary;

        public SqlCommand    MySqlCommand;

        public SqlConnection    MySqlConnection;



        /// <summary>
        /// 构造函数
        /// </summary>
        public cEmployee()
        {

        }



        /// <summary>
        /// 登录用户名
        /// </summary>
        public string Username
        {
            get
            {
                return m_Username;
            }
            set
            {
                m_Username = value;
            }
        }

        /// <summary>
        /// 登录密码
        /// </summary>
        public string Password
        {
            get
            {
                return m_Password;
            }
            set
            {
                m_Password = value;
            }
        }

        /// <summary>
        /// 对用户输入的用户名和密码进行有效性验证
        /// </summary>
        /// <returns></returns>
        public string LoginVerify()
        {
            try
            {

                MySqlConnection = new SqlConnection("UID=SA;PWD=1234;DATABASE=MyAjaxDB");
                MySqlCommand.CommandText = "SP_User_Login";
                MySqlCommand.Connection  = MySqlConnection;
                MySqlCommand.CommandType = CommandType.StoredProcedure;
                MyParameter = MySqlCommand.Parameters.Add("@RETURN_VALUE",SqlDbType.Int);
                MyParameter.Direction = ParameterDirection.ReturnValue;

                MySqlCommand.Parameters.Add("@name",m_Username);
                MySqlCommand.Parameters.Add("@pwd", m_Password);
                MySqlConnection.Open();
                MySqlCommand.ExecuteNonQuery();
                return "";
            }
            catch(Exception errExce)
            {

            }
            finally
            {
                MySqlConnection.Close();
            }
        }

    }
}

SP_User_Login（存储过程）



CREATE PROC SP_User_Login
(
      @name VARCHAR(15),
      @pwd   VARCHAR(15)
)
AS
      DECLARE @temp_Name VARCHAR(15)
BEGIN
      SELECT  @temp_Name=UserName
      FROM     t_UserLogin
      WHERE   UserName = @name
         AND
              Password  = @pwd
      IF @temp_Name IS NOT NULL
          RETURN 0    --登录成功
    IF EXISTS (SELECT UserName
               FROM   t_UserLogin
                   WHERE  UserName = @name)
          RETURN 1    --密码不正确
        ELSE
          RETURN 2    --用户名不存在
END
GO

到了这步就算完成了，如果出现“×××未定义”这种错误，一般都是配置的问题，或者就是前台调用路径的问题，这都是小问题

评论 1

被折叠的条评论为什么被折叠?

到【灌水乐园】发言

查看更多评论

添加红包

成就一亿技术人!

hope_wisdom

发出的红包

实付元

使用余额支付

点击重新获取

扫码支付

钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。