Saltar al contenido principal

Usa IA para integrar Auth0

Si usas un asistente de programación con IA como Claude Code, Cursor o GitHub Copilot, puedes añadir la autenticación de Auth0 automáticamente en cuestión de minutos con agent skills.Instala:
npx skills add auth0/agent-skills --skill auth0-quickstart --skill auth0-aspnetcore-authentication
Luego, pídele a tu asistente de IA lo siguiente:
Add Auth0 authentication to my ASP.NET Core MVC app
Tu asistente de IA creará automáticamente tu aplicación en Auth0, obtendrá las credenciales, instalará el SDK Auth0 ASP.NET Core Authentication, configurará el middleware de autenticación e implementará los flujos de inicio y cierre de sesión. Documentación completa sobre agent skills →
Requisitos previos: Antes de comenzar, asegúrate de tener instalado lo siguiente:
  • .NET SDK 8.0 o una versión posterior
  • Tu editor de código preferido (Visual Studio, VS Code o Rider)
  • Una cuenta de Auth0 (regístrate gratis)

​
Primeros pasos

Auth0 le permite agregar autenticación rápidamente y acceder a la información del perfil del usuario en su aplicación. Esta guía muestra cómo integrar Auth0 en cualquier aplicación ASP.NET MVC nueva o existente mediante el SDK Auth0.AspNetCore.Authentication.
1

Crear un nuevo proyecto

Cree un nuevo proyecto de ASP.NET Core MVC para esta guía de inicio rápido
dotnet new mvc -n SampleMvcApp
Abre el proyecto
cd SampleMvcApp
2

Instala el SDK de Auth0

dotnet add package Auth0.AspNetCore.Authentication
3

Configura tu aplicación en Auth0

A continuación, debes crear una nueva aplicación en tu tenant de Auth0 y agregar la configuración a tu proyecto.Puede hacerlo automáticamente ejecutando un comando de CLI o de forma manual desde el Dashboard:
Ejecute el siguiente comando de shell en el directorio raíz del proyecto para crear una aplicación de Auth0 y actualizar appsettings.json:
AUTH0_APP_NAME="My App" && brew tap auth0/auth0-cli && brew install auth0 && auth0 login --no-input && auth0 apps create -n "${AUTH0_APP_NAME}" -t regular -c http://localhost:5000/callback -l http://localhost:5000 -o http://localhost:5000 --reveal-secrets --json --metadata created_by="quickstart-docs-cli" > auth0-app-details.json && CLIENT_ID=$(jq -r '.client_id' auth0-app-details.json) && CLIENT_SECRET=$(jq -r '.client_secret' auth0-app-details.json) && DOMAIN=$(auth0 tenants list --json | jq -r '.[] | select(.active == true) | .name') && rm auth0-app-details.json && cat > appsettings.json << EOF
{
  "Logging": {
    "LogLevel": {
      "Default": "Information",
      "Microsoft.AspNetCore": "Warning"
    }
  },
  "AllowedHosts": "*",
  "Auth0": {
    "Domain": "${DOMAIN}",
    "ClientId": "${CLIENT_ID}",
    "ClientSecret": "${CLIENT_SECRET}"
  }
}
EOF
echo "appsettings.json se creó con los datos de Auth0:" && cat appsettings.json
Configurar las URL de callback:En la pestaña Settings, configure las siguientes URL:
  • Allowed Callback URLs: http://localhost:5000/callback
  • URLs de cierre de sesión permitidas: http://localhost:5000
  • Orígenes web permitidos: http://localhost:5000
Haz clic en Save Changes
Importante: Asegúrese de configurar las conexiones y habilitarlas para su aplicación en el Auth0 Dashboard, en la pestaña Conexiones.
4

Configurar la autenticación

Actualiza tu archivo Program.cs para configurar la autenticación de Auth0:
Program.cs
using Auth0.AspNetCore.Authentication;

var builder = WebApplication.CreateBuilder(args);

builder.Services.AddAuth0WebAppAuthentication(options =>
{
    options.Domain = builder.Configuration["Auth0:Domain"];
    options.ClientId = builder.Configuration["Auth0:ClientId"];
    options.ClientSecret = builder.Configuration["Auth0:ClientSecret"];
});

builder.Services.AddControllersWithViews();

var app = builder.Build();

if (!app.Environment.IsDevelopment())
{
    app.UseExceptionHandler("/Home/Error");
    app.UseHsts();
}

app.UseHttpsRedirection();
app.UseStaticFiles();
app.UseRouting();

app.UseAuthentication();
app.UseAuthorization();

app.MapControllerRoute(
    name: "default",
    pattern: "{controller=Home}/{action=Index}/{id?}");

app.Run();
5

Agregar funcionalidad de inicio y cierre de sesión

Cree un archivo AccountController.cs en la carpeta Controllers:
Controllers/AccountController.cs
using Auth0.AspNetCore.Authentication;
using Microsoft.AspNetCore.Authentication;
using Microsoft.AspNetCore.Authentication.Cookies;
using Microsoft.AspNetCore.Authorization;
using Microsoft.AspNetCore.Mvc;

public class AccountController : Controller
{
    public async Task Login(string returnUrl = "/")
    {
        var authenticationProperties = new LoginAuthenticationPropertiesBuilder()
            .WithRedirectUri(returnUrl)
            .Build();

        await HttpContext.ChallengeAsync(Auth0Constants.AuthenticationScheme, authenticationProperties);
    }

    [Authorize]
    public async Task Logout()
    {
        var authenticationProperties = new LogoutAuthenticationPropertiesBuilder()
            .WithRedirectUri(Url.Action("Index", "Home"))
            .Build();

        await HttpContext.SignOutAsync(Auth0Constants.AuthenticationScheme, authenticationProperties);
        await HttpContext.SignOutAsync(CookieAuthenticationDefaults.AuthenticationScheme);
    }

    [Authorize]
    public IActionResult Profile()
    {
        return View();
    }
}
6

Vista de creación de perfil

Cree un archivo nuevo Views/Account/Profile.cshtml:
Views/Account/Profile.cshtml
@{
    ViewData["Title"] = "User Profile";
}

<div class="row">
    <div class="col-md-12">
        <h2>@ViewData["Title"]</h2>
        <div class="row">
            <div class="col-md-2">
                <img src="@User.FindFirst(c => c.Type == "picture")?.Value" alt="User's profile picture" class="img-fluid rounded-circle" />
            </div>
            <div class="col-md-10">
                <h3>@User.Identity.Name</h3>
                <p><strong>Email:</strong> @User.FindFirst(c => c.Type == System.Security.Claims.ClaimTypes.Email)?.Value</p>
                <p><strong>Email Verified:</strong> @User.FindFirst(c => c.Type == "email_verified")?.Value</p>
                <p><strong>User ID:</strong> @User.FindFirst(c => c.Type == System.Security.Claims.ClaimTypes.NameIdentifier)?.Value</p>
            </div>
        </div>
        
        <h4 class="mt-4">User Claims</h4>
        <table class="table">
            <thead>
                <tr>
                    <th>Claim Type</th>
                    <th>Claim Value</th>
                </tr>
            </thead>
            <tbody>
                @foreach (var claim in User.Claims)
                {
                    <tr>
                        <td>@claim.Type</td>
                        <td>@claim.Value</td>
                    </tr>
                }
            </tbody>
        </table>
    </div>
</div>
Nota: Primero tendrás que crear el directorio Views/Account si no existe.
7

Actualiza tu diseño

Actualiza tu archivo de diseño para añadir botones de inicio y cierre de sesión. En Views/Shared/_Layout.cshtml, busca el elemento <nav> y sustitúyelo por:
Views/Shared/_Layout.cshtml
<nav class="navbar navbar-expand-sm navbar-toggleable-sm navbar-light bg-white border-bottom box-shadow mb-3">
    <div class="container-fluid">
        <a class="navbar-brand" asp-area="" asp-controller="Home" asp-action="Index">SampleMvcApp</a>
        <div class="navbar-collapse collapse d-sm-inline-flex justify-content-between">
            <ul class="navbar-nav flex-grow-1">
                <li class="nav-item">
                    <a class="nav-link text-dark" asp-area="" asp-controller="Home" asp-action="Index">Home</a>
                </li>
            </ul>
            <ul class="navbar-nav">
                @if (User.Identity.IsAuthenticated)
                {
                    <li class="nav-item">
                        <a class="nav-link text-dark" asp-controller="Account" asp-action="Profile">@User.Identity.Name</a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link text-dark" asp-controller="Account" asp-action="Logout">Logout</a>
                    </li>
                }
                else
                {
                    <li class="nav-item">
                        <a class="nav-link text-dark" asp-controller="Account" asp-action="Login">Login</a>
                    </li>
                }
            </ul>
        </div>
    </div>
</nav>
Importante: Reemplace únicamente el elemento <nav>. Mantenga intactas todas las demás partes de _Layout.cshtml, especialmente la llamada a @RenderBody(), que es necesaria para mostrar el contenido de la página.
8

Ejecuta tu aplicación

dotnet run
Tu aplicación debería iniciarse y mostrar la URL en la que está escuchando:
info: Microsoft.Hosting.Lifetime[14]
      Now listening on: http://localhost:5000
Abre el navegador y ve a http://localhost:5000. Haz clic en el enlace Login de la barra de navegación. Se te redirigirá a la página de inicio de sesión de Auth0. Después de iniciar sesión, se te redirigirá de nuevo a tu aplicación y deberías ver tu nombre en la barra de navegación.
Punto de verificaciónAhora debería tener una aplicación MVC protegida con Auth0 en ejecución y totalmente funcional en http://localhost:5000. Los usuarios pueden iniciar sesión, ver su perfil y cerrar sesión.

​
Uso avanzado

Puedes acceder a la información del perfil del usuario a través de la propiedad User en tus controladores o vistas:
Controllers/AccountController.cs
[Authorize]
public IActionResult Profile()
{
    var user = new
    {
        Name = User.Identity.Name,
        EmailAddress = User.FindFirst(c => c.Type == System.Security.Claims.ClaimTypes.Email)?.Value,
        ProfileImage = User.FindFirst(c => c.Type == "picture")?.Value,
        UserId = User.FindFirst(c => c.Type == System.Security.Claims.ClaimTypes.NameIdentifier)?.Value
    };
    
    return View(user);
}
Las claims del usuario contienen información estándar de OIDC:
  • Name: Nombre para mostrar del usuario
  • Email: Correo electrónico del usuario
  • Picture: URL de la imagen de perfil del usuario
  • NameIdentifier (sub): ID único del usuario
Puedes pasar parámetros personalizados a la página de inicio de sesión de Auth0:
Controllers/AccountController.cs
public async Task Login(string returnUrl = "/")
{
    var authenticationProperties = new LoginAuthenticationPropertiesBuilder()
        .WithRedirectUri(returnUrl)
        .WithParameter("screen_hint", "signup")  // Mostrar la página de registro
        .WithParameter("ui_locales", "es")       // Establecer el idioma en español
        .Build();

    await HttpContext.ChallengeAsync(Auth0Constants.AuthenticationScheme, authenticationProperties);
}
Si necesitas llamar a API externas en nombre del usuario, puedes recuperar y almacenar tokens:
Program.cs
builder.Services.AddAuth0WebAppAuthentication(options =>
{
    options.Domain = builder.Configuration["Auth0:Domain"];
    options.ClientId = builder.Configuration["Auth0:ClientId"];
    options.ClientSecret = builder.Configuration["Auth0:ClientSecret"];
})
.WithAccessToken(options =>
{
    options.Audience = "https://your-api.example.com";
});
Luego, recupera el token de acceso en el controlador:
Controllers/ApiController.cs
[Authorize]
public async Task<IActionResult> CallApi()
{
    var accessToken = await HttpContext.GetTokenAsync("access_token");
    
    // Usa el token de acceso para llamar a tu API
    var client = new HttpClient();
    client.DefaultRequestHeaders.Authorization = 
        new AuthenticationHeaderValue("Bearer", accessToken);
    
    var response = await client.GetAsync("https://your-api.example.com/data");
    var data = await response.Content.ReadAsStringAsync();
    
    return View(data);
}
Personaliza el comportamiento de la autenticación manejando eventos:
Program.cs
builder.Services.AddAuth0WebAppAuthentication(options =>
{
    options.Domain = builder.Configuration["Auth0:Domain"];
    options.ClientId = builder.Configuration["Auth0:ClientId"];
    options.ClientSecret = builder.Configuration["Auth0:ClientSecret"];
})
.WithAccessToken(options =>
{
    options.Events = new Auth0WebAppWithAccessTokenEvents
    {
        OnMissingRefreshToken = async (context) =>
        {
            await context.SignOutAsync(CookieAuthenticationDefaults.AuthenticationScheme);
            var authenticationProperties = new LoginAuthenticationPropertiesBuilder()
                .WithRedirectUri("/")
                .Build();
            
            await context.ChallengeAsync(Auth0Constants.AuthenticationScheme, authenticationProperties);
        }
    };
});

​
Recursos adicionales

Repositorio de GitHub

Código fuente y seguimiento de problemas

Referencia de la API

Documentación detallada de la API

Foro de la comunidad

Obtén ayuda de la comunidad de Auth0

​
Problemas comunes

Problema: Unable to obtain configuration from: https://your-tenant.auth0.com/.well-known/openid-configurationSolución: Verifique que su dominio sea correcto y que no incluya https://. La biblioteca construye la autoridad automáticamente.
{
  "Auth0": {
    "Domain": "your-tenant.auth0.com"  // Correcto: sin protocolo
  }
}
Asegúrese también de lo siguiente:
  • Que no haya una barra diagonal al final del valor del dominio
  • Que su aplicación tenga acceso a Internet para conectarse a Auth0
  • Que el formato del dominio coincida con la región de su inquilino (.auth0.com, .us.auth0.com, .eu.auth0.com)
Problema: ArgumentNullException: Value cannot be null. (Parameter 'Domain') o similar.Solución: Asegúrese de que appsettings.json contenga la sección de Auth0 con los valores de Domain, ClientId y ClientSecret. Compruebe que la configuración se esté leyendo correctamente:
Program.cs
builder.Services.AddAuth0WebAppAuthentication(options =>
{
    options.Domain = builder.Configuration["Auth0:Domain"]
        ?? throw new InvalidOperationException("Auth0:Domain is required");
    options.ClientId = builder.Configuration["Auth0:ClientId"]
        ?? throw new InvalidOperationException("Auth0:ClientId is required");
    options.ClientSecret = builder.Configuration["Auth0:ClientSecret"]
        ?? throw new InvalidOperationException("Auth0:ClientSecret is required");
});
Problema: La autenticación no funciona a pesar de que la configuración es correcta.Solución: Asegúrese de que el middleware esté en el orden correcto. UseAuthentication() debe ir antes de UseAuthorization():
Program.cs
app.UseRouting();
app.UseAuthentication();  // Debe ir antes de UseAuthorization
app.UseAuthorization();
app.MapControllerRoute(...);

​
Aplicación de ejemplo

Puedes encontrar una aplicación de ejemplo junto al código fuente del SDK:

Aplicación Playgroud de ASP.NET Core MVC

Incluye ejemplos de inicio de sesión, cierre de sesión, perfil del usuario y más.
Clona y ejecuta: 
git clone https://github.com/auth0/auth0-aspnetcore-authentication.git
cd auth0-aspnetcore-authentication/playground/Auth0.AspNetCore.Authentication.Playground
# Actualiza appsettings.json con tu configuración de Auth0
dotnet run