Ajouter la connexion à votre application ASP.NET MVC

Ce guide montre comment intégrer Auth0 à une application ASP.NET MVC, nouvelle ou existante, à l’aide du SDK Auth0.AspNetCore.Authentication.

Utilisez l’IA pour intégrer Auth0

Si vous utilisez un assistant IA de programmation comme Claude Code, Cursor ou GitHub Copilot, vous pouvez ajouter automatiquement l’authentification Auth0 en quelques minutes à l’aide d’Agent Skills.

Installation :

npx skills add auth0/agent-skills --skill auth0

Ensuite, demandez à votre assistant IA :

Add Auth0 authentication to my ASP.NET Core MVC app

Votre assistant IA créera automatiquement votre application Auth0, récupérera les identifiants, installera le SDK Auth0 ASP.NET Core Authentication, configurera le middleware d’authentification et implémentera les flux de connexion et de déconnexion. Documentation complète sur Agent Skills →

Prérequis : Avant de commencer, assurez-vous d’avoir installé ce qui suit :

• .NET SDK 8.0 ou une version ultérieure
• Votre éditeur de code préféré (Visual Studio, VS Code ou Rider)
• Un compte Auth0 (inscrivez-vous gratuitement)

​

Pour commencer

Auth0 vous permet d’ajouter rapidement l’authentification et d’obtenir l’accès aux renseignements du profil utilisateur dans votre application. Ce guide montre comment intégrer Auth0 à toute application ASP.NET MVC, nouvelle ou existante, à l’aide du SDK Auth0.AspNetCore.Authentication.

1. Créer un nouveau projet

   Créez un nouveau projet ASP.NET Core MVC pour ce Quickstart

   dotnet new mvc -n SampleMvcApp
   

   Ouvrir le projet

   cd SampleMvcApp
   
2. Installer le SDK Auth0

   dotnet add package Auth0.AspNetCore.Authentication
   
3. Configurez votre application Auth0

   Ensuite, vous devez créer une nouvelle application sur votre tenant Auth0 et ajouter la configuration à votre projet.

   Vous pouvez choisir de configurer automatiquement votre application Auth0 en exécutant une commande CLI, ou de le faire manuellement dans le Dashboard :

   CLI

   Exécutez la commande shell suivante à la racine de votre projet pour créer une application Auth0 et mettre à jour votre fichier appsettings.json :

   Mac

   # Installer Auth0 CLI (s’il n’est pas déjà installé)
   brew tap auth0/auth0-cli && brew install auth0
   
   # Configurer l’application Auth0 et générer appsettings.json
   auth0 qs setup --app --type regular --framework aspnet-mvc --port 5000 --name "My ASP.NET MVC App"
   

   Cette commande va :

   1. Vérifier si vous êtes authentifié (et vous inviter à vous connecter au besoin)
   2. Créer une application Web régulière Auth0 configurée pour http://localhost:5000
   3. Mettre à jour appsettings.json avec Auth0:Domain, Auth0:ClientId et Auth0:ClientSecret

   Dashboard

   Avant de commencer, créez ou mettez à jour appsettings.json à la racine de votre projet

   appsettings.json

   {
     "Logging": {
       "LogLevel": {
         "Default": "Information",
         "Microsoft.AspNetCore": "Warning"
       }
     },
     "AllowedHosts": "*",
     "Auth0": {
       "Domain": "YOUR_AUTH0_DOMAIN",
       "ClientId": "YOUR_CLIENT_ID",
       "ClientSecret": "YOUR_CLIENT_SECRET"
     }
   }
   

   1. Accédez au Auth0 Dashboard
   2. Cliquez sur Applications → Applications → Create Application
   3. Entrez un nom pour votre application (p. ex., “My MVC App”)
   4. Sélectionnez Regular Web Application comme type d’application
   5. Cliquez sur Create
   6. Accédez à l’onglet Settings
   7. Remplacez YOUR_AUTH0_DOMAIN, YOUR_CLIENT_ID et YOUR_CLIENT_SECRET dans le fichier appsettings.json par les valeurs Domain, Client ID et Client Secret du dashboard

   Configurer les URL de rappel :

   Dans l’onglet Settings, configurez les URL suivantes :

   • URL de rappel autorisées: http://localhost:5000/callback
   • URL de déconnexion autorisées: http://localhost:5000
   • Origines Web autorisées: http://localhost:5000

   Cliquez sur Enregistrer les modifications

   Important : Assurez-vous de configurer les connexions et de les activer pour votre application dans l’Auth0 Dashboard, sous l’onglet Connections.

4. Configurer l’authentification

   Mettez à jour votre Program.cs pour configurer l’authentification 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. Ajouter les fonctionnalités Login et Logout

   Créez un AccountController.cs dans le dossier 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. Créer la vue Profil

   Créez un nouveau fichier 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>
   

   Remarque : Vous devrez d’abord créer le répertoire Views/Account s’il n’existe pas déjà.

7. Mettez à jour votre layout

   Mettez à jour votre fichier de mise en page pour ajouter des boutons Login/Logout. Dans Views/Shared/_Layout.cshtml, repérez l’élément <nav> et remplacez-le par :

   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>
   

   Important : Remplacez uniquement l’élément <nav>. Conservez toutes les autres parties de _Layout.cshtml intactes, en particulier l’appel @RenderBody(), qui est nécessaire à l’affichage du contenu de la page.

8. Lancez votre application

   dotnet run
   

   Votre application devrait démarrer et afficher l’URL sur laquelle elle écoute :

   info: Microsoft.Hosting.Lifetime[14]
         Now listening on: http://localhost:5000
   

   Ouvrez votre navigateur et allez à http://localhost:5000. Cliquez sur le lien Connexion dans la barre de navigation. Vous serez redirigé vers la page de connexion d’Auth0. Après vous être connecté, vous serez redirigé vers votre application et vous devriez voir votre nom dans la barre de navigation.

Vérification

Vous devriez maintenant avoir une application MVC protégée par Auth0 entièrement fonctionnelle, accessible à l’adresse http://localhost:5000. Les utilisateurs peuvent se connecter, consulter leur profil et se déconnecter.

---

​

Utilisation avancée

Accéder aux renseignements du profil utilisateur

Vous pouvez accéder aux renseignements du profil utilisateur à partir de la propriété User dans vos contrôleurs ou vos vues :

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);
}

Les claims de l’utilisateur contiennent des renseignements OIDC standard :

• Name : nom d’affichage de l’utilisateur
• Email : adresse courriel de l’utilisateur
• Picture : URL de la photo de profil de l’utilisateur
• NameIdentifier (sub) : ID utilisateur unique

Personnaliser les paramètres de connexion

Vous pouvez transmettre des paramètres personnalisés à la page de connexion Auth0 :

Controllers/AccountController.cs

public async Task Login(string returnUrl = "/")
{
    var authenticationProperties = new LoginAuthenticationPropertiesBuilder()
        .WithRedirectUri(returnUrl)
        .WithParameter("screen_hint", "signup")  // Afficher la page d’inscription
        .WithParameter("ui_locales", "es")       // Régler la langue sur l’espagnol
        .Build();

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

Stocker les jetons pour les appels d’API

Si vous devez appeler des API externes au nom de l’utilisateur, vous pouvez récupérer et stocker des jetons :

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";
});

Ensuite, récupérez le jeton d’accès dans votre contrôleur :

Controllers/ApiController.cs

[Authorize]
public async Task<IActionResult> CallApi()
{
    var accessToken = await HttpContext.GetTokenAsync("access_token");
    
    // Utiliser le jeton d’accès pour appeler votre 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);
}

Gérer les événements d’authentification

Personnalisez le comportement de l’authentification en traitant les événements :

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);
        }
    };
});

---

​

Ressources supplémentaires

Dépôt GitHub

Code source et suivi des problèmes

Référence de l’API

Documentation détaillée de l’API

Forum de la communauté

Obtenez de l’aide auprès de la communauté Auth0

---

​

Problèmes courants

Impossible d’obtenir la configuration

Problème : Unable to obtain configuration from: https://your-tenant.auth0.com/.well-known/openid-configuration

Solution : Vérifiez que votre Domain est correct et n’inclut pas https://. La bibliothèque construit automatiquement l’autorité.

{
  "Auth0": {
    "Domain": "your-tenant.auth0.com"  // Correct - aucun protocole
  }
}

Assurez-vous également de ce qui suit :

• Aucune barre oblique à la fin de la valeur du domain
• Votre application a accès à Internet pour joindre Auth0
• Le format du domain correspond à la région de votre tenant (.auth0.com, .us.auth0.com, .eu.auth0.com)

Valeurs de configuration introuvables

Problème : ArgumentNullException: Value cannot be null. (Parameter 'Domain') ou un message semblable.

Solution : Assurez-vous que appsettings.json contient la section Auth0 avec les valeurs Domain, ClientId et ClientSecret. Vérifiez aussi que la configuration est bien lue :

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");
});

Problèmes d’ordre du middleware

Problème : L’authentification ne fonctionne pas malgré une configuration correcte.

Solution : Assurez-vous que le middleware est dans le bon ordre. UseAuthentication() doit être placé avant UseAuthorization() :

Program.cs

app.UseRouting();
app.UseAuthentication();  // Doit être avant UseAuthorization
app.UseAuthorization();
app.MapControllerRoute(...);

---

​

Application d’exemple

Vous trouverez une application d’exemple avec le code source du SDK :

Application Playgroud ASP.NET Core MVC

Comprend des exemples de connexion, de déconnexion, de profil d’utilisateur, et plus encore.

Clonez et exécutez :

git clone https://github.com/auth0/auth0-aspnetcore-authentication.git
cd auth0-aspnetcore-authentication/playground/Auth0.AspNetCore.Authentication.Playground
# Mettez à jour appsettings.json avec votre configuration Auth0
dotnet run

---