Asp .Net - Autenticação com JQuery/JSON

Neste tutorial será explicado como fazer autenticação Asp .Net utilizando JQuery com JSON. Fará a autenticação com AJAX, que dará um efeito super interessante para o login de sua aplicação ou site.

Para iniciar crie um projeto em branco e adicione as seguintes páginas:
Default.aspx - Essa já vem, será nossa página com o formulário de login.
Login.aspx - Essa será nossa página que irá fazer o login e retornar em JSON.
MinhaPagina.aspx - Essa será nossa página de teste para verificar se a autenticação está funcionando.

Vamos configurar nosso Web.config para que a página Default.aspx seja o login e tenhamos acesso a página Login.aspx mesmo sem estar logado.
[Web.config]

Após fazer essas alterações no web.config, se tentarmos acessar a página MinhaPagina.aspx seremos redirecionados automaticamente para Default.aspx.

Agora vamos montar nossa rotina de login dentro da página Login.aspx:
[Login.aspx.cs]

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.Script.Serialization;
using System.Web.Security;

public partial class Login : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {
        JavaScriptSerializer jss = new JavaScriptSerializer();

        string user = Request.Params["usuario"] != null ? 
        Request.Params["usuario"].ToString().ToLower() : "";
        string senha = Request.Params["senha"] != null ? 
        Request.Params["senha"].ToString() : "";

        if (user.Equals("user") && senha.Equals("123456"))
        {
            FormsAuthentication.SetAuthCookie(user, true);
            Response.Write(jss.Serialize(new { sucesso = 1, msg = "" }));
        }
        else
        {
            Response.Write(jss.Serialize(new { sucesso = 0, msg = "Dados inválidos." }));
        }
        Response.End();
    }
}

Agora vamos fazer nosso formulário de login. Utilizaremos a API JQUERY que pode ser carregada diretamente com a API do Google (como vou fazer no exemplo), ou baixada no site do fabricante: www.jquery.com
Obs: A partir do VS 2010 o JQuery já vem embutido.
[Default.aspx]

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



    
    
    
    


    

    

        
            Usuário:
        
        
        
            Senha:
        
        
        
        

        
    
    

Nossa página em execução.

Ao tentar fazer login com dados inválidos.

E ao fazer o login com os dados corretor vai ser redirecionado para a página MinhaPagina.aspx.

Até a próxima!