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

> Describe el flujo de trabajo con el SDK auth0-spa-js para admitir la gestión de sesiones multisitio.

# Gestionar sesiones multisitio con el SDK de Auth0

<div id="short-lived-sessions">
  ## Sesiones de corta duración
</div>

Este flujo de trabajo muestra cómo debe implementarse el SDK auth0-spa-js para admitir la gestión de sesiones multisitio. En este escenario, se asume que el tiempo de espera de inactividad de <Tooltip tip="Inicio de sesión único (SSO): servicio que, después de que un usuario inicia sesión en una aplicación, inicia automáticamente su sesión en otras aplicaciones." cta="Ver glosario" href="/es/docs/glossary?term=SSO">SSO</Tooltip> del inquilino está configurado en 300 segundos y que la expiración del <Tooltip tip="ID Token: credencial destinada al propio cliente, en lugar de para acceder a un recurso." cta="Ver glosario" href="/es/docs/glossary?term=ID+Token">ID Token</Tooltip> de cada aplicación SPA está configurada en 150 segundos. Esto se considera una sesión de corta duración.

<div id="sdk-features">
  ### Funcionalidades del SDK
</div>

<div id="pkce-flow">
  #### Flujo PKCE
</div>

Para todos los métodos para obtener un ID Token o <Tooltip tip="Token de acceso: credencial de autorización, en forma de cadena opaca o JWT, que se usa para acceder a una API." cta="Ver glosario" href="/es/docs/glossary?term=Access+Token">Token de acceso</Tooltip>, el SDK gestiona todos los detalles del flujo Proof Key for Code Exchange. No se requiere ninguna configuración ni esfuerzo adicional para que funcione.

<div id="deep-linking">
  #### Enlaces directos
</div>

Para mejorar la experiencia del usuario, el SDK incluye un parámetro `appState` para el método `loginWithRedirect()`. Los detalles de la aplicación actual se incluyen como parte de la solicitud al servidor de autenticación y se devuelven cuando la autenticación se completa correctamente, lo que permite que el usuario continúe su flujo sin interrupciones.

En el Quickstart, el componente `PrivateRoute` establece un parámetro de estado `targetUrl`, y la función `onRedirectCallback` de `index.js` extrae este valor para redirigir al usuario cuando se completa la autenticación.

<div id="token-storage">
  #### Almacenamiento de tokens
</div>

Para almacenar los tokens devueltos de la forma más segura posible, todos los tokens se guardan en una caché local. El ID Token y el Token de acceso se almacenan en pares, y los valores de <Tooltip tip="Audiencia: identificador único de la audiencia de un token emitido. Se denomina aud en un token; su valor contiene el ID de una aplicación (ID de cliente) para un ID Token o de una API (Identificador de API) para un Token de acceso." cta="Ver glosario" href="/es/docs/glossary?term=audience">audiencia</Tooltip> y scope se usan para recuperar los tokens cuando sea necesario.

Además, los tokens de la caché se eliminan en cuanto expira el ID Token o el Token de acceso, de modo que, si un token está en la caché, puede asumirse que sigue siendo válido.

<div id="call-apis">
  #### Llamar a APIs
</div>

El método `getTokenSilently()` se usa para aprovechar primero la caché de tokens y, si no hay ninguno, inicia un iframe invisible para obtener un token nuevo. Para ello, todas las solicitudes a APIs pueden usar este método para construir el encabezado Bearer sin necesidad de lógica adicional para gestionar tokens expirados.

En la Quickstart, la vista `ExternalService` realiza una solicitud a la API de Express mediante esta funcionalidad.

<div id="warn-users-to-continue-their-sessions">
  #### Avisar a los usuarios para que continúen con sus sesiones
</div>

Si un usuario no ha realizado ninguna acción que haga que se actualice la sesión de Auth0, Auth0 recomienda que muestres un aviso para que el usuario elija continuar explícitamente con su sesión.

Este enfoque permite que la sesión quede inactiva si el usuario ya no está presente, pero, en caso contrario, proporciona una forma de activar la renovación silenciosa del token para que pueda continuar con su sesión sin que se le vuelvan a pedir credenciales.

Para obtener más información sobre los temporizadores de inactividad y las ventanas modales de tiempo de espera, consulta [URL de cierre de sesión específicas de la aplicación](/es/docs/manage-users/sessions/configure-session-lifetime-settings).

<div id="example-workflow">
  ### Flujo de ejemplo
</div>

1. Autenticación inicial
2. Mantener la sesión de Auth0
3. SSO sin interrupciones
4. solicitar al usuario que extienda la sesión
5. El usuario cierra sesión explícitamente en la aplicación
6. El usuario vuelve a la aplicación inicial después de cerrar sesión

<div id="initial-authentication">
  #### Autenticación inicial
</div>

1. Se abre una nueva pestaña
2. Se solicita iniciar sesión
3. El usuario introduce sus credenciales
4. Se establece la cookie de SSO (con vencimiento)
5. Se realiza el intercambio de tokens

<Frame>
  <img src="https://mintcdn.com/translations/Dcx0M11uuptU53TX/docs/images/cdy7uua7fh8z/2voC3vs36CJJlpDu4xl06Y/310fe5afe79ad7d083833baa2690dfa4/initial-authentication.png?fit=max&auto=format&n=Dcx0M11uuptU53TX&q=85&s=4f51098c0b8f844858d9c464393d96e3" alt="Diagrama del flujo de autenticación inicial" width="1500" height="1346" data-path="docs/images/cdy7uua7fh8z/2voC3vs36CJJlpDu4xl06Y/310fe5afe79ad7d083833baa2690dfa4/initial-authentication.png" />
</Frame>

<div id="maintain-auth0-session">
  #### Mantener la sesión de Auth0
</div>

1. El usuario solicita datos de un recurso protegido
2. Se llama a `getTokenSilently()`
3. Se recupera el recurso
4. El usuario actualiza los datos del recurso protegido
5. Se llama a `getTokenSilently()`

   1. Se abre un iframe
   2. Se realiza el intercambio del token
6. Se actualiza el recurso

<Frame>
  <img src="https://mintcdn.com/translations/c0RQ9V0YAcT0-8l5/docs/images/cdy7uua7fh8z/7CI29ouvhuJ4TFC1G2C5n8/4d2bd0c9372a6cc16e75fc76f438a0bd/maintain-auth0-session.png?fit=max&auto=format&n=c0RQ9V0YAcT0-8l5&q=85&s=0b4232fbfdf4359e2290b8100a72258e" alt="Diagrama de mantenimiento de una sesión" width="1500" height="1839" data-path="docs/images/cdy7uua7fh8z/7CI29ouvhuJ4TFC1G2C5n8/4d2bd0c9372a6cc16e75fc76f438a0bd/maintain-auth0-session.png" />
</Frame>

<div id="seamless-sso">
  #### SSO sin interrupciones
</div>

1. El usuario accede a una ruta privada
2. Comprueba con `isAuthenticated()`
3. Si devuelve `false`, `loginWithRedirect()`

<Frame>
  <img src="https://mintcdn.com/translations/3nS3prIggmJG9TUI/docs/images/cdy7uua7fh8z/38heJlnN0letWMVhpTtXad/4d4127150fb818522ea29eea28ccc00e/seamless-sso.png?fit=max&auto=format&n=3nS3prIggmJG9TUI&q=85&s=5be4dbdc1a3e26c45f8195c092ec3a59" alt="Diagrama del flujo de SSO sin interrupciones para las sesiones" width="1500" height="1633" data-path="docs/images/cdy7uua7fh8z/38heJlnN0letWMVhpTtXad/4d4127150fb818522ea29eea28ccc00e/seamless-sso.png" />
</Frame>

<div id="prompt-user-to-extend-session">
  #### Solicitar al usuario que extienda la sesión
</div>

1. A los 240 segundos, muestre un modal de 60 segundos para pedir al usuario que mantenga activa la sesión
2. Si decide mantener la sesión, `getTokenSilently()`

<Frame>
  <img src="https://mintcdn.com/translations/6GE5Z24GDCZehiJ9/docs/images/cdy7uua7fh8z/6kH2G3oclCfSudwd0hJEUM/70651da37771c9945c5a34dcad409d9f/prompt-user-extend-session.png?fit=max&auto=format&n=6GE5Z24GDCZehiJ9&q=85&s=82396b75a3239be57569f04f465b2d6f" alt="Diagrama en el que se solicita a un usuario que mantenga una sesión" width="1500" height="1870" data-path="docs/images/cdy7uua7fh8z/6kH2G3oclCfSudwd0hJEUM/70651da37771c9945c5a34dcad409d9f/prompt-user-extend-session.png" />
</Frame>

<div id="user-explicitly-logs-out-of-application">
  #### El usuario cierra sesión explícitamente en la aplicación
</div>

1. El usuario decide cerrar sesión
2. Se llama a `logout()`

   1. Se borra la caché de tokens
   2. Se llama a `/oidc/logout`
   3. Se borra la cookie de SSO y se eliminan los datos de la sesión
   4. Se redirige al usuario a la página de cierre de sesión

<Frame>
  <img src="https://mintcdn.com/translations/pvjQqAy3EB2TK6NP/docs/images/cdy7uua7fh8z/4b55FKM2vZBoskXTPY4nxs/1a9e69437677f2cfac9a3d8e6bff7ffe/user-explicitly-logs-out-of-app.png?fit=max&auto=format&n=pvjQqAy3EB2TK6NP&q=85&s=c91d63541b687a25cc827afb2c6fa003" alt="Diagrama de un usuario cerrando sesión" width="1500" height="1194" data-path="docs/images/cdy7uua7fh8z/4b55FKM2vZBoskXTPY4nxs/1a9e69437677f2cfac9a3d8e6bff7ffe/user-explicitly-logs-out-of-app.png" />
</Frame>

<div id="user-returns-to-initial-application-after-logging-out">
  #### El usuario vuelve a la aplicación inicial después de cerrar sesión
</div>

1. El usuario solicita datos de un recurso protegido
2. Se llama a `getTokenSilently()`
3. Comportamiento según la aplicación

<Frame>
  <img src="https://mintcdn.com/translations/3nS3prIggmJG9TUI/docs/images/cdy7uua7fh8z/3geXGwsXkIgFkwopoGoLMx/01685b6b8e8473c6ce6f26e59b402cf3/user-returns-to-initial-app.png?fit=max&auto=format&n=3nS3prIggmJG9TUI&q=85&s=dc23f4e3b518b9b980cfd37daa05f34e" alt="Diagrama del usuario que vuelve a la aplicación después de cerrar sesión" width="1500" height="1046" data-path="docs/images/cdy7uua7fh8z/3geXGwsXkIgFkwopoGoLMx/01685b6b8e8473c6ce6f26e59b402cf3/user-returns-to-initial-app.png" />
</Frame>

<div id="long-lived-sessions">
  ## Sesiones de larga duración
</div>

Auth0 admite sesiones de larga duración para planes empresariales. Con las sesiones de larga duración, puede configurar límites de sesión con hasta 100 días de inactividad (`idle timeout`) y hasta un año de duración total (`absolute timeout`). Si maneja plazos trimestrales, mensuales o de otro tipo, esto le permite reducir la fricción para los usuarios finales y proporcionar acceso a contenido y funciones de bajo riesgo. Además, las empresas de medios pueden aprovechar las sesiones de larga duración para mejorar la experiencia de usuario mediante un acceso fluido al contenido. También puede optar entre sesiones de larga duración y validación de contraseña en función de sus requisitos de experiencia de usuario y seguridad.

Los detalles del flujo de trabajo cambian en el caso de una sesión de larga duración, en la que la sesión de la aplicación probablemente sea más corta que la sesión de [inicio de sesión único (SSO)](/es/docs/authenticate/single-sign-on).

Para obtener más información, consulte [Configurar límites de duración de la sesión](/es/docs/manage-users/sessions/configure-session-lifetime-settings) y [Actualizar la duración del token de acceso](/es/docs/secure/tokens/access-tokens/update-access-token-lifetime).
