> ## 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.

# Agrega el inicio de sesión a tu aplicación UWP

> Integra Auth0 con tu aplicación de Universal Windows Platform mediante el 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">
  # Agrega el inicio de sesión a tu aplicación UWP
</div>

Esta guía muestra cómo integrar Auth0 con una aplicación de Universal Windows Platform (UWP) mediante el SDK Auth0.OidcClient.UWP. Al finalizar, tu aplicación permitirá iniciar sesión, cerrar sesión y mostrar la información del perfil del usuario.

Esta guía usa la versión 1.x de `Auth0.OidcClient.UWP`.

***

<div id="prerequisites">
  ## Requisitos previos
</div>

Antes de empezar, necesitarás lo siguiente:

* **Visual Studio 2019 (16.11+) o Visual Studio 2022** con la carga de trabajo "Universal Windows Platform Development" instalada
* **Windows 10 SDK 10.0.16299** o una versión posterior (se instala con la carga de trabajo de UWP)
* **Una cuenta de Auth0** ([regístrate gratis](https://auth0.com/signup))

***

<div id="get-started">
  ## Primeros pasos
</div>

<Steps>
  <Step title="Configura tu aplicación de Auth0" stepNumber={1}>
    Debes configurar una aplicación de Auth0 en tu Auth0 Dashboard para que tu aplicación UWP pueda conectarse.

    1. Ve al [Auth0 Dashboard](https://manage.auth0.com/) e inicia sesión
    2. En la barra lateral izquierda, ve a **Applications > Applications**
    3. Selecciona **Create Application**
    4. Introduce un nombre para tu aplicación (por ejemplo, "My UWP App")
    5. Selecciona **Native** como tipo de aplicación
    6. Selecciona **Create**
    7. Ve a la pestaña **Settings** en la página de detalles de la aplicación
    8. Anota tu **Domain** y **Client ID** en la parte superior de la página; los necesitarás en tu código

    <Note>
      Anota los valores de Domain y Client ID; los necesitarás más adelante
    </Note>

    A continuación, configura la URL de callback:

    1. En la pestaña **Settings**, desplázate hacia abajo hasta **Application URIs**
    2. En el campo **Allowed Callback URLs**, introduce: `https://{yourDomain}/mobile`
       * Ejemplo: `https://mycompany.auth0.com/mobile`
    3. En el campo **Allowed Logout URLs**, introduce la misma URL: `https://{yourDomain}/mobile`
    4. Selecciona **Save Changes**

    <Note>
      El patrón de URL de callback `https://{yourDomain}/mobile` es el estándar de Auth0 para aplicaciones nativas. Tu aplicación UWP gestionará automáticamente la redirección; no necesitas ninguna configuración personalizada.
    </Note>
  </Step>

  <Step title="Crea tu proyecto de UWP" stepNumber={2}>
    Si ya tienes un proyecto UWP, ve al paso 3.

    1. Abre Visual Studio
    2. Selecciona **File > New > Project**
    3. Busca "UWP" y selecciona **Blank App (Universal Windows)**
    4. Asigna un nombre a tu proyecto (por ejemplo, "Auth0Sample")
    5. Selecciona **Next**
    6. En "Minimum version," selecciona **Windows 10 (versión 1909)** o una versión posterior
    7. En "Target version," selecciona la última disponible (actualmente, Windows 11)
    8. Selecciona **Create**

    Visual Studio crea tu proyecto UWP con los archivos básicos `MainPage.xaml` y `MainPage.xaml.cs`.
  </Step>

  <Step title="Instala el SDK de Auth0" stepNumber={3}>
    Agrega el paquete NuGet Auth0.OidcClient.UWP a tu proyecto.

    **Con la interfaz de usuario del Administrador de paquetes (recomendado):**

    1. Haz clic con el botón derecho en tu proyecto en el Explorador de soluciones
    2. Selecciona **Manage NuGet Packages**
    3. Ve a la pestaña **Browse**
    4. Busca "Auth0.OidcClient.UWP"
    5. Selecciona la versión más reciente y haz clic en **Install**
    6. Acepta cualquier aviso sobre dependencias

    **O con la consola del Administrador de paquetes:**

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

    **O bien con la CLI de dotnet:**

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

    Verifica que la instalación se haya completado sin errores. Si aparece algún mensaje de error, comprueba tu conexión a Internet y vuelve a intentarlo.
  </Step>

  <Step title="Añade el inicio y cierre de sesión a tu página principal" stepNumber={4}>
    Ahora añadirás botones para iniciar y cerrar sesión en tu aplicación. Actualiza `MainPage.xaml` y `MainPage.xaml.cs`.

    Primero, actualiza `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>
    ```

    Ahora, actualiza `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}";
                }
            }
        }
    }
    ```

    Reemplaza los marcadores de posición en el código:

    * `{yourDomain}` - Tu dominio de Auth0 (p. ej., `mycompany.auth0.com`)
    * `{yourClientId}` - El ID de cliente de tu aplicación de Auth0
    * `Auth0Sample` - El nombre real de tu proyecto (debe coincidir con el nombre de tu proyecto UWP)
  </Step>

  <Step title="Ejecuta la aplicación" stepNumber={5}>
    Pulsa **F5** o selecciona **Debug > Start Debugging** para iniciar la aplicación.

    **Comportamiento esperado:**

    1. La aplicación UWP se inicia y muestra un botón de "Login"
    2. Tocas **Login** → Se abre una ventana del navegador con la página de inicio de sesión de Auth0
    3. Introduce tus credenciales de Auth0 (o crea una cuenta de prueba)
    4. Después de iniciar sesión, el navegador se cierra automáticamente
    5. La aplicación muestra tu nombre y correo electrónico
    6. El botón cambia a "Logout"
    7. Tocas **Logout** → El navegador se abre brevemente y luego se cierra
    8. El botón vuelve a mostrar "Login"

    <Tip>
      Si la página de inicio de sesión no aparece, comprueba que tu Domain y ClientId sean correctos, que la Allowed Callback URL del panel de Auth0 coincida con `https://{yourDomain}/mobile` y que tu conexión a internet funcione correctamente.
    </Tip>
  </Step>
</Steps>

<Check>
  **Comprobación**

  Ahora tienes una experiencia de inicio de sesión con Auth0 totalmente funcional en tu aplicación UWP.
</Check>

***

<div id="troubleshooting">
  ## Solución de problemas
</div>

<AccordionGroup>
  <Accordion title="La página de inicio de sesión no se abre">
    **Problema:** Problema de conectividad de red o configuración no válida.

    **Solución:**

    1. Comprueba tu conexión a Internet
    2. Verifica que tu Domain sea exactamente correcto (p. ej., `mycompany.auth0.com`)
    3. Verifica que tu ClientId sea exactamente correcto (sin espacios ni errores tipográficos)
    4. Asegúrate de estar ejecutando Windows 10 (Fall Creators Update) o una versión posterior
  </Accordion>

  <Accordion title="Error de discrepancia en la URL de callback">
    **Problema:** La URL de redirección de tu aplicación de Auth0 no coincide con la que aparece en tu código.

    **Solución:**

    1. Ve a Auth0 Dashboard > Applications > Your App > Settings
    2. Desplázate hasta "Application URIs"
    3. Comprueba que "Allowed Callback URLs" contenga: `https://{yourDomain}/mobile`
    4. Verifica que coincida exactamente con el `RedirectUri` de tu código
    5. Haz clic en **Save Changes** si hiciste algún cambio
  </Accordion>

  <Accordion title="La aplicación se cierra después de iniciar sesión">
    **Problema:** Faltan directivas `using` o hay referencias de espacio de nombres incorrectas.

    **Solución:**

    1. Asegúrate de tener `using Auth0.OidcClient;` al principio de MainPage.xaml.cs
    2. Vuelve a compilar la solución (Build > Rebuild Solution)
  </Accordion>

  <Accordion title="Error de concesión no válida durante el inicio de sesión">
    **Problema:** Tu token de actualización ha expirado o las credenciales en caché no son válidas.

    **Solución:**

    1. Toca **Logout** para borrar los tokens en caché
    2. Toca **Login** de nuevo y vuelve a autenticarte
    3. Si el problema persiste, ve a Auth0 Dashboard y borra los tokens de actualización de tu aplicación
  </Accordion>

  <Accordion title="No se muestra información del usuario">
    **Problema:** No se solicitó el scope `profile`, por lo que los claims del usuario no están disponibles.

    **Solución:**

    1. Actualiza tus Auth0ClientOptions para solicitar el scope `profile`:
       ```csharp theme={null}
       var options = new Auth0ClientOptions
       {
           Domain = "{yourDomain}",
           ClientId = "{yourClientId}",
           Scope = "openid profile email" // Añade esta línea
       };
       ```
    2. Cierra sesión y vuelve a iniciarla para obtener los scopes actualizados
  </Accordion>
</AccordionGroup>

***

<div id="next-steps">
  ## Próximos pasos
</div>

Ahora tienes una integración de Auth0 funcional en tu aplicación UWP. Explora estos temas para ampliar tu implementación:

<CardGroup cols={2}>
  <Card title="Llamar a una API protegida" icon="plug" href="/es/docs/quickstart/backend/nodejs#call-your-api">
    Usa tu token de acceso para autenticar solicitudes a una API de backend
  </Card>

  <Card title="Tokens de actualización" icon="rotate" href="/es/docs/secure/tokens/refresh-tokens">
    Mantén las sesiones de los usuarios entre reinicios de la aplicación
  </Card>

  <Card title="Organizaciones" icon="building" href="/es/docs/manage-users/organizations">
    Compatibilidad con aplicaciones B2B multiempresa
  </Card>

  <Card title="Personalizar Universal Login" icon="paintbrush" href="/es/docs/authenticate/login/auth0-universal-login">
    Haz que la página de inicio de sesión de Auth0 refleje tu marca
  </Card>

  <Card title="Control de acceso basado en roles" icon="shield-halved" href="/es/docs/manage-users/access-control/rbac">
    Controla los permisos de los usuarios según sus roles
  </Card>
</CardGroup>

***

<div id="additional-resources">
  ## Recursos adicionales
</div>

<CardGroup cols={3}>
  <Card title="Cliente OIDC de Auth0" icon="github" href="https://github.com/auth0/auth0-oidc-client-net">
    Código fuente y documentación del SDK en GitHub
  </Card>

  <Card title="OpenID Connect" icon="book" href="/es/docs/authenticate/protocols/openid-connect-protocol">
    Aprende cómo funciona OpenID Connect con Auth0
  </Card>

  <Card title="Prácticas recomendadas para los tokens de acceso" icon="key" href="/es/docs/secure/tokens/access-tokens">
    Prácticas recomendadas de seguridad para los tokens de acceso
  </Card>
</CardGroup>