> ## Documentation Index
> Fetch the complete documentation index at: https://translations.mintlify.site/llms.txt
> Use this file to discover all available pages before exploring further.

# Ajouter la connexion à votre application UWP

> Intégrez Auth0 à votre application Universal Windows Platform à l’aide du SDK Auth0.OidcClient.UWP

export const HowToSchema = () => <script type="application/ld+json">
    {'{"@context":"https://schema.org","@type":"HowTo"}'}
  </script>;

<HowToSchema />

<div id="add-login-to-your-uwp-application">
  # Ajouter la connexion à votre application UWP
</div>

Ce guide explique comment intégrer Auth0 à une application Universal Windows Platform (UWP) à l’aide du SDK Auth0.OidcClient.UWP. Au terme de ce guide, votre application prendra en charge la connexion, le logout et l’affichage des renseignements du profil utilisateur.

Ce guide utilise la version 1.x de `Auth0.OidcClient.UWP`.

***

<div id="prerequisites">
  ## Prérequis
</div>

Vous aurez besoin des éléments suivants avant de commencer :

* **Visual Studio 2019 (16.11+) ou Visual Studio 2022** avec la charge de travail « Développement de la plateforme Windows universelle » installée
* **Windows 10 SDK 10.0.16299** ou version ultérieure (installé avec la charge de travail UWP)
* **Un compte Auth0** ([inscrivez-vous gratuitement](https://auth0.com/signup))

***

<div id="get-started">
  ## Premiers pas
</div>

<Steps>
  <Step title="Configurer votre application Auth0" stepNumber={1}>
    Vous devez configurer une application Auth0 dans votre Auth0 Dashboard afin que votre application UWP puisse s’y connecter.

    1. Accédez au [Auth0 Dashboard](https://manage.auth0.com/) et connectez-vous
    2. Dans la barre latérale de gauche, allez à **Applications > Applications**
    3. Sélectionnez **Create Application**
    4. Entrez un nom pour votre application (par exemple, "My UWP App")
    5. Sélectionnez **Native** comme type d’application
    6. Sélectionnez **Create**
    7. Ouvrez l’onglet **Settings** de la page Application Details
    8. Notez votre **Domain** et votre **Client ID** en haut de la page — vous en aurez besoin dans votre code

    <Note>
      Notez les valeurs de Domain et de Client ID — vous en aurez besoin plus tard
    </Note>

    Ensuite, configurez votre URL de rappel :

    1. Dans l’onglet Settings, faites défiler la page jusqu’à **Application URIs**
    2. Dans le champ **Allowed Callback URLs**, entrez : `https://{yourDomain}/mobile`
       * Exemple : `https://mycompany.auth0.com/mobile`
    3. Dans le champ **Allowed Logout URLs**, entrez la même URL : `https://{yourDomain}/mobile`
    4. Sélectionnez **Save Changes**

    <Note>
      Le format d’URL de rappel `https://{yourDomain}/mobile` est la norme d’Auth0 pour les applications natives. Votre application UWP gérera automatiquement la redirection — aucune configuration personnalisée n’est requise.
    </Note>
  </Step>

  <Step title="Créez votre projet UWP" stepNumber={2}>
    Si vous avez déjà un projet UWP, passez directement à l’étape 3.

    1. Ouvrez Visual Studio
    2. Sélectionnez **Fichier > Nouveau > Projet**
    3. Recherchez "UWP" et sélectionnez **Blank App (Universal Windows)**
    4. Donnez un nom à votre projet (par exemple, "Auth0Sample")
    5. Sélectionnez **Suivant**
    6. Pour "Version minimale", sélectionnez **Windows 10 (version 1909)** ou une version ultérieure
    7. Pour "Version cible", sélectionnez la version disponible la plus récente (actuellement Windows 11)
    8. Sélectionnez **Créer**

    Visual Studio crée votre projet UWP avec les fichiers de base `MainPage.xaml` et `MainPage.xaml.cs`.
  </Step>

  <Step title="Installer le SDK Auth0" stepNumber={3}>
    Ajoutez le package NuGet Auth0.OidcClient.UWP à votre projet.

    **À l’aide de l’interface utilisateur du gestionnaire de packages (recommandé) :**

    1. Cliquez avec le bouton droit sur votre projet dans l’Explorateur de solutions
    2. Sélectionnez **Manage NuGet Packages**
    3. Allez à l’onglet **Browse**
    4. Recherchez "Auth0.OidcClient.UWP"
    5. Sélectionnez la version la plus récente et cliquez sur **Install**
    6. Acceptez tous les messages relatifs aux dépendances

    **Ou à l’aide de la console du gestionnaire de packages :**

    ```powershell theme={null}
    Install-Package Auth0.OidcClient.UWP
    ```

    **Ou avec la CLI dotnet :**

    ```bash theme={null}
    dotnet add package Auth0.OidcClient.UWP
    ```

    Vérifiez que l’installation s’est terminée sans erreur. Si des messages d’erreur s’affichent, vérifiez votre connexion Internet et réessayez.
  </Step>

  <Step title="Ajoutez les fonctions de connexion et de déconnexion à votre page principale" stepNumber={4}>
    Vous allez maintenant ajouter des boutons de connexion et de déconnexion à votre application. Mettez à jour `MainPage.xaml` et `MainPage.xaml.cs`.

    Commencez par mettre à jour `MainPage.xaml` :

    ```xaml theme={null}
    <?xml version="1.0" encoding="utf-8"?>
    <Page
        x:Class="Auth0Sample.MainPage"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">

        <StackPanel Padding="20" VerticalAlignment="Center" HorizontalAlignment="Center">
            <TextBlock Text="Auth0 UWP Sample" FontSize="28" Margin="0,0,0,20" />
            
            <Button x:Name="LoginButton" Click="LoginButton_Click" Content="Login" Padding="10" />
            <Button x:Name="LogoutButton" Click="LogoutButton_Click" Content="Logout" Padding="10" Margin="0,10,0,0" />
            
            <TextBlock x:Name="UserInfoText" Margin="0,20,0,0" FontSize="14" TextWrapping="Wrap" />
        </StackPanel>
    </Page>
    ```

    Mettez maintenant à jour `MainPage.xaml.cs` :

    ```csharp theme={null}
    using Auth0.OidcClient;
    using System;
    using Windows.UI.Xaml;
    using Windows.UI.Xaml.Controls;

    namespace Auth0Sample
    {
        public sealed partial class MainPage : Page
        {
            private Auth0Client _auth0Client;

            public MainPage()
            {
                InitializeComponent();
                InitializeAuth0();
            }

            private void InitializeAuth0()
            {
                _auth0Client = new Auth0Client(new Auth0ClientOptions
                {
                    Domain = "{yourDomain}",
                    ClientId = "{yourClientId}",
                    RedirectUri = "https://{yourDomain}/mobile",
                    PostLogoutRedirectUri = "https://{yourDomain}/mobile"
                });
            }

            private async void LoginButton_Click(object sender, RoutedEventArgs e)
            {
                try
                {
                    var loginResult = await _auth0Client.LoginAsync();

                    if (loginResult.IsError)
                    {
                        if (loginResult.Error == "UserCancel")
                        {
                            UserInfoText.Text = "Login cancelled";
                            return;
                        }

                        UserInfoText.Text = $"Login failed: {loginResult.Error}";
                        return;
                    }

                    var userEmail = loginResult.User.FindFirst("email")?.Value ?? "Unknown";
                    var userName = loginResult.User.FindFirst("name")?.Value ?? "User";

                    UserInfoText.Text = $"Welcome, {userName}!\nEmail: {userEmail}";

                    LoginButton.Visibility = Visibility.Collapsed;
                    LogoutButton.Visibility = Visibility.Visible;
                }
                catch (Exception ex)
                {
                    UserInfoText.Text = $"Error: {ex.Message}";
                }
            }

            private async void LogoutButton_Click(object sender, RoutedEventArgs e)
            {
                try
                {
                    await _auth0Client.LogoutAsync();

                    UserInfoText.Text = "You have been logged out";
                    LoginButton.Visibility = Visibility.Visible;
                    LogoutButton.Visibility = Visibility.Collapsed;
                }
                catch (Exception ex)
                {
                    UserInfoText.Text = $"Logout error: {ex.Message}";
                }
            }
        }
    }
    ```

    Remplacez les espaces réservés dans le code :

    * `{yourDomain}` - Votre domaine Auth0 (p. ex., `mycompany.auth0.com`)
    * `{yourClientId}` - Le Client ID de votre application Auth0
    * `Auth0Sample` - Le nom réel de votre projet (il doit correspondre au nom de votre projet UWP)
  </Step>

  <Step title="Lancez votre application" stepNumber={5}>
    Appuyez sur **F5** ou sélectionnez **Debug > Start Debugging** pour lancer votre application.

    **Comportement attendu :**

    1. Votre application UWP se lance et affiche un bouton "Login"
    2. Vous appuyez sur **Login** → Une fenêtre de navigateur s’ouvre et affiche la page de connexion Auth0
    3. Entrez vos identifiants Auth0 (ou créez un compte de test)
    4. Après le login, le navigateur se ferme automatiquement
    5. Votre application affiche votre nom et votre courriel
    6. Le bouton devient "Logout"
    7. Vous appuyez sur **Logout** → Le navigateur s’ouvre brièvement, puis se ferme
    8. Le bouton redevient "Login"

    <Tip>
      Si la page de connexion ne s’affiche pas, vérifiez que votre Domain et votre ClientId sont corrects, que votre Allowed Callback URL dans Auth0 Dashboard correspond à `https://{yourDomain}/mobile` et que votre connexion Internet fonctionne.
    </Tip>
  </Step>
</Steps>

<Check>
  **Vérification**

  Vous disposez maintenant d’une expérience de connexion Auth0 entièrement fonctionnelle dans votre application UWP.
</Check>

***

<div id="troubleshooting">
  ## Dépannage
</div>

<AccordionGroup>
  <Accordion title="La page de connexion ne s’ouvre pas">
    **Problème :** Problème de connectivité réseau ou configuration invalide.

    **Solution :**

    1. Vérifiez votre connexion Internet
    2. Vérifiez que votre Domain est exact (par exemple, `mycompany.auth0.com`)
    3. Vérifiez que votre ClientId est exact (sans espaces ni fautes de frappe)
    4. Assurez-vous d’utiliser Windows 10 (Fall Creators Update) ou une version ultérieure
  </Accordion>

  <Accordion title="Erreur de non-correspondance de l’URL de rappel">
    **Problème :** L’URL de redirection de votre application Auth0 ne correspond pas à celle indiquée dans votre code.

    **Solution :**

    1. Accédez à Auth0 Dashboard > Applications > Votre application > Settings
    2. Faites défiler jusqu’à « Application URIs »
    3. Vérifiez que « Allowed Callback URLs » contient : `https://{yourDomain}/mobile`
    4. Vérifiez que cela correspond exactement à `RedirectUri` dans votre code
    5. Cliquez sur **Save Changes** si vous avez apporté des modifications
  </Accordion>

  <Accordion title="L’application plante après la connexion">
    **Problème :** Il manque des instructions using ou les références d’espace de noms sont incorrectes.

    **Solution :**

    1. Assurez-vous d’avoir `using Auth0.OidcClient;` en haut de MainPage.xaml.cs
    2. Régénérez la solution (Build > Rebuild Solution)
  </Accordion>

  <Accordion title="Erreur d’autorisation invalide pendant la connexion">
    **Problème :** Votre jeton d’actualisation a expiré ou les informations d’authentification en cache sont invalides.

    **Solution :**

    1. Touchez **Logout** pour effacer les jetons en cache
    2. Touchez **Connexion** de nouveau et authentifiez-vous à nouveau
    3. Si le problème persiste, accédez à Auth0 Dashboard et supprimez les jetons d’actualisation de votre application
  </Accordion>

  <Accordion title="Aucune information utilisateur ne s’affiche">
    **Problème :** La portée `profile` n’a pas été demandée, donc les claims de l’utilisateur ne sont pas disponibles.

    **Solution :**

    1. Mettez à jour vos Auth0ClientOptions pour demander la portée profile :
       ```csharp theme={null}
       var options = new Auth0ClientOptions
       {
           Domain = "{yourDomain}",
           ClientId = "{yourClientId}",
           Scope = "openid profile email" // Ajoutez cette ligne
       };
       ```
    2. Déconnectez-vous, puis reconnectez-vous pour obtenir les portées mises à jour
  </Accordion>
</AccordionGroup>

***

<div id="next-steps">
  ## Étapes suivantes
</div>

Vous disposez maintenant d’une intégration Auth0 fonctionnelle dans votre application UWP. Explorez ces rubriques pour étendre votre mise en œuvre :

<CardGroup cols={2}>
  <Card title="Faire une requête à une API protégée" icon="plug" href="/docs/fr-ca/quickstart/backend/nodejs#call-your-api">
    Utilisez votre jeton d’accès pour authentifier les requêtes vers une API backend
  </Card>

  <Card title="Jetons d’actualisation" icon="rotate" href="/docs/fr-ca/secure/tokens/refresh-tokens">
    Maintenez les sessions utilisateur après le redémarrage de l’application
  </Card>

  <Card title="Organizations" icon="building" href="/docs/fr-ca/manage-users/organizations">
    Prenez en charge les applications B2B multilocataires
  </Card>

  <Card title="Personnaliser Universal Login" icon="paintbrush" href="/docs/fr-ca/authenticate/login/auth0-universal-login">
    Adaptez la page de connexion d’Auth0 à votre image de marque
  </Card>

  <Card title="Role-Based Access Control" icon="shield-halved" href="/docs/fr-ca/manage-users/access-control/rbac">
    Contrôlez les permissions des utilisateurs en fonction de leurs rôles
  </Card>
</CardGroup>

***

<div id="additional-resources">
  ## Ressources supplémentaires
</div>

<CardGroup cols={3}>
  <Card title="Auth0 OIDC Client" icon="github" href="https://github.com/auth0/auth0-oidc-client-net">
    Code source du SDK et documentation sur GitHub
  </Card>

  <Card title="OpenID Connect" icon="book" href="/docs/fr-ca/authenticate/protocols/openid-connect-protocol">
    Découvrez le fonctionnement d’OpenID Connect avec Auth0
  </Card>

  <Card title="Bonnes pratiques relatives aux jetons d’accès" icon="key" href="/docs/fr-ca/secure/tokens/access-tokens">
    Bonnes pratiques de sécurité pour les jetons d’accès
  </Card>
</CardGroup>