Comment implémenter la fonction de connexion sans actualisation AJAX

Lorsque vous cliquez sur le bouton de connexion, une fenêtre de connexion apparaîtra. Après avoir entré le nom d'utilisateur et le mot de passe corrects et cliqué sur connexion, la fenêtre de connexion se fermera et le statut sera remplacé par le nom d'utilisateur actuel. Cet article présente principalement le fonctionnement d'AJAX. implémente la fonction de connexion sans actualisation. Les amis qui en ont besoin peuvent s'y référer. Suivant

Lorsque vous cliquez sur le bouton de connexion, une fenêtre de connexion apparaîtra. Après avoir entré le nom d'utilisateur et le mot de passe corrects et cliqué sur connexion, le. la fenêtre de connexion se fermera et le statut sera remplacé par le nom d'utilisateur actuel.

Étape 1 :

Tout d'abord, la fenêtre contextuelle utilise les contrôles de jquery-ui La première étape. est d'apprendre à l'utiliser.

Ouvrez le development-bundle->demos sous l'interface jquery décompressée et recherchez index.html, sélectionnez la boîte de dialogue du modèle sous la boîte de dialogue, cliquez avec le bouton droit pour afficher le code source. , observez comment utiliser le contrôle et recherchez un code clé : $("#dialog-modal").dialog({height: 140,modal: true}); message et trouvez le code clé pour fermer : $(this).dialog('close'); avec ces deux lignes de code, vous pouvez contrôler l'affichage et la fermeture de la fenêtre, et vous pouvez passer à l'étape suivante Use You. vous devez copier le dossier css et le dossier js du package de développement jquery-ui dans le projet.

Étape 2 :

Publiez ici le code du gestionnaire général pour gérer les requêtes AJAX. quand j'écris réellement, je l'utilise avant de l'écrire, mais il est impossible de le lister en détail étape par étape ici Afin de faciliter la compréhension, je publierai d'abord le code général du programme de traitement :

1. IsLogin.ashx, utiliser Pour déterminer si l'utilisateur est connecté, le nom d'utilisateur sera renvoyé lors de la connexion. Notez ici que pour utiliser la session dans un gestionnaire général, l'utilisation de System.Web.SessionState doit être introduite et l'interface IRequiresSessionState

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.SessionState;
namespace AJAX无刷新登录.AJAX
{
 /// <summary>
 /// IsLogin 的摘要说明
 /// </summary>
 public class IsLogin : IHttpHandler,IRequiresSessionState
 {
  public void ProcessRequest(HttpContext context)
  {
   context.Response.ContentType = "text/plain";
   if (context.Session["userName"] != null)
   {
    string userName = context.Session["userName"].ToString();
    context.Response.Write("yes|"+userName);
   }
   else
   {
    context.Response.Write("no");
   }
  }
  public bool IsReusable
  {
   get
   {
    return false;
   }
  }
 }
}

2.CheckLogin doit être introduit.ashx, utilisé pour détecter si le nom d'utilisateur et le mot de passe saisis par l'utilisateur correspondent. S'il est correct, il renverra oui, s'il est faux, il renverra non. . Pour plus de simplicité, il n'y a pas de connexion à la base de données ici

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.SessionState;
namespace AJAX无刷新登录.AJAX
{
 /// <summary>
 /// CheckLogin 的摘要说明
 /// </summary>
 public class CheckLogin : IHttpHandler,IRequiresSessionState
 {
  public void ProcessRequest(HttpContext context)
  {
   context.Response.ContentType = "text/plain";
   string userName = context.Request["userName"];
   string password=context.Request["password"];
   if (userName=="admin"&&password=="admin")
   {
    context.Session["userName"] = "admin";
    context.Response.Write("ok");
   }
   else
   {
    context.Response.Write("no");
   }
  }
  public bool IsReusable
  {
   get
   {
    return false;
   }
  }
 }
}

3. LoginOut.ashx, utilisé pour contrôler la déconnexion de l'utilisateur, définissez la session sur vide. le programme de traitement général est terminé. Le code de l'interface principale est affiché ci-dessous :

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.SessionState;
namespace AJAX无刷新登录.AJAX
{
 /// <summary>
 /// LoginOut 的摘要说明
 /// </summary>
 public class LoginOut : IHttpHandler,IRequiresSessionState
 {
  public void ProcessRequest(HttpContext context)
  {
   context.Response.ContentType = "text/plain";
   context.Session["userName"] = null;
  }
  public bool IsReusable
  {
   get
   {
    return false;
   }
  }
 }
}