/ /

/ /

SDK de dispositivos Atlas

Web SDK

Gestión de usuarios

Autenticar un usuario - SDK web

Los SDK de dispositivos Atlas están obsoletos. Consulte Página de desuso para más detalles.

Overview

El SDK Web proporciona a los desarrolladores una API unificada para autenticar a los usuarios de las aplicaciones con cualquier proveedor de autenticación. Los usuarios inician sesión proporcionando las credenciales de autenticación de un proveedor determinado y el SDK administra automáticamente los tokens de autenticación y actualiza los datos de los usuarios conectados.

Inicia sesión

Anónimo

El El proveedoranónimo permite a los usuarios iniciar sesión en su aplicación con cuentas efímeras que no tienen información asociada.

Para iniciar sesión, cree una credencial anónima y pásela a App.logIn():

async function loginAnonymous() {
  // Create an anonymous credential
  const credentials = Realm.Credentials.anonymous();
  // Authenticate the user
  const user = await app.logIn(credentials);
  // `App.currentUser` updates to match the logged in user
  console.assert(user.id === app.currentUser.id);
  return user;
}
const user = await loginAnonymous();

Correo electrónico/Contraseña

El proveedor de autenticación de correo electrónico/contraseña permite a los usuarios iniciar sesión en su aplicación con una dirección de correo electrónico y una contraseña.

Para iniciar sesión, cree una credencial de correo electrónico/contraseña con la dirección de correo electrónico y la contraseña del usuario y pásela a App.logIn():

async function loginEmailPassword(email, password) {
  // Create an email/password credential
  const credentials = Realm.Credentials.emailPassword(email, password);
  // Authenticate the user
  const user = await app.logIn(credentials);
  // `App.currentUser` updates to match the logged in user
  console.assert(user.id === app.currentUser.id);
  return user;
}
const user = await loginEmailPassword("joe.jasper@example.com", "passw0rd");

Llave API

El proveedor de autenticación de clave API permite que los procesos del servidor accedan a su aplicación directamente o en nombre de un usuario.

Para iniciar sesión con una clave API, cree una credencial de clave API con una clave API de servidor o usuario y pásela a App.logIn():

async function loginApiKey(apiKey) {
  // Create an API Key credential
  const credentials = Realm.Credentials.apiKey(apiKey);
  // Authenticate the user
  const user = await app.logIn(credentials);
  // `App.currentUser` updates to match the logged in user
  console.assert(user.id === app.currentUser.id);
  return user;
}
const user = await loginApiKey(REALM_API_KEY.key); // add previously generated API key

Función personalizada

El proveedor de autenticación de funciones personalizadas le permite gestionar la autenticación de usuarios ejecutando una función que recibe una carga útil de información arbitraria sobre un usuario.

Para iniciar sesión con el proveedor de funciones personalizadas, cree una credencial de función personalizada con un objeto de carga útil y pásela a App.logIn():

async function loginCustomFunction(payload) {
  // Create a Custom Function credential
  const credentials = Realm.Credentials.function(payload);
  // Authenticate the user
  const user = await app.logIn(credentials);
  // `App.currentUser` updates to match the logged in user
  console.assert(user.id === app.currentUser.id);
  return user;
}
const user = await loginCustomFunction({ username: "ilovemongodb" });

JWT personalizado

El proveedor de autenticación JWT personalizado le permite gestionar la autenticación de usuarios con cualquier sistema de autenticación que devuelva un token web JSON.

Para iniciar sesión, cree una credencial JWT personalizada con un JWT del sistema externo y páselo a App.logIn():

async function loginCustomJwt(jwt) {
  // Create a Custom JWT credential
  const credentials = Realm.Credentials.jwt(jwt);
  // Authenticate the user
  const user = await app.logIn(credentials);
  // `App.currentUser` updates to match the logged in user
  console.assert(user.id === app.currentUser.id);
  return user;
}
const user = await loginCustomJwt("eyJ0eXAi...Q3NJmnU8oP3YkZ8");

Autenticación de Facebook

El proveedor de autenticación de Facebook te permite autenticar a los usuarios a través de una app de Facebook usando su cuenta de Facebook. Puedes usar el flujo de autenticación integrado o autenticarte con el SDK de Facebook.

Importante

Habilitar el proveedor de autenticación de Facebook

Para iniciar sesión un usuario con su cuenta de Facebook existente, debe configurar y habilitar el proveedor de autenticación de Facebook para su aplicación.

Importante

No almacene las URL de las imágenes de perfil de Facebook

Las URL de las fotos de perfil de Facebook incluyen el token de acceso del usuario para otorgar permiso a la imagen. Para garantizar la seguridad, no guardes una URL que incluya el token de acceso del usuario. En su lugar, accede a la URL directamente desde los campos de metadatos del usuario cuando necesites obtener la imagen.

Utilice el flujo OAuth 2.0 integrado de Facebook

El SDK web de Realm incluye métodos para gestionar el proceso OAuth 2.0 y no requiere la instalación del SDK de Facebook. El flujo integrado sigue tres pasos principales:

Llamas a app.logIn() con una credencial de Facebook. La credencial debe especificar una URL para tu aplicación que también figure como URI de redireccionamiento en la configuración del proveedor.

// The redirect URI should be on the same domain as this app and
// specified in the auth provider configuration.
const redirectUri = "https://app.example.com/handleOAuthLogin";
const credentials = Realm.Credentials.facebook(redirectUri);
// Calling logIn() opens a Facebook authentication screen in a new window.
const user = await app.logIn(credentials);
// The app.logIn() promise will not resolve until you call `Realm.handleAuthRedirect()`
// from the new window after the user has successfully authenticated.
console.log(`Logged in with id: ${user.id}`);

Se abre una nueva ventana con la pantalla de autenticación de Facebook, donde el usuario autentica y autoriza la aplicación. Una vez completado el proceso, la nueva ventana redirige a la URL especificada en la credencial.

Llamas a Realm.handleAuthRedirect() en la página redirigida, lo que almacena el token de acceso de Atlas App Services del usuario y cierra la ventana. La ventana original de la aplicación detectará automáticamente el token de acceso y finalizará el inicio de sesión del usuario.

// When the user is redirected back to your app, handle the redirect to
// save the user's access token and close the redirect window. This
// returns focus to the original application window and automatically
// logs the user in.
Realm.handleAuthRedirect();

Autenticarse con el SDK de Facebook

Puedes utilizar el SDK oficial de Facebook Para gestionar la autenticación del usuario y el flujo de redirección. Una vez autenticado, el SDK de Facebook devuelve un token de acceso que puedes usar para finalizar el inicio de sesión del usuario en tu aplicación.

// Get the access token from the Facebook SDK
const { accessToken } = FB.getAuthResponse();
// Define credentials with the access token from the Facebook SDK
const credentials = Realm.Credentials.facebook(accessToken);
// Log the user in to your app
await app.logIn(credentials);

Autenticación de Google

El proveedor de autenticación Google le permite autenticar usuarios mediante un proyecto de Google utilizando su cuenta de Google existente.

Nota

Habilitar el proveedor de autenticación de Google

Para autenticar un usuario de Google, debe configurar el proveedor de autenticación de Google.

Iniciar sesión como usuario de Google en tu aplicación es un proceso de dos pasos:

Primero, autentica al usuario con Google. Puedes usar una biblioteca como Google One Tap para una experiencia optimizada.
En segundo lugar, el usuario inicia sesión en su aplicación con un token de autenticación devuelto por Google tras la autenticación exitosa.

Autenticarse con Google One Tap

Nota

Requiere OpenID Connect

Google One Tap solo admite la autenticación de usuarios mediante OpenID Connect. Para que los usuarios de Google inicien sesión en tu aplicación web, debes habilitar OpenID Connect en la configuración del proveedor de autenticación de App Services.

Google One Tap es un SDK de Google que permite a los usuarios registrarse o iniciar sesión en un sitio web con un solo clic (o toque).

Ejemplo

Flujo básico de un toque de Google

Este ejemplo muestra cómo configurar la autenticación de Google con App Services en una aplicación web muy básica. La aplicación solo contiene un archivo index.html.

index.html

<!DOCTYPE html>
<html lang="en">
  <head>
    <title>Google One Tap Example</title>
  </head>
  <body>
    <h1>Google One Tap Example</h1>
    <!-- The data-callback HTML attribute sets the callback function that is run
      when the user logs in. Here we're calling the handleCredentialsResponse JavaScript
      function defined in the below script section to log the user into App Services.
    -->
    <div
      id="g_id_onload"
      data-client_id="<your_google_client_id>"
      data-callback="handleCredentialsResponse"
    ></div>
  </body>
  <!-- Load Atlas App Services -->
  <script src="https://unpkg.com/realm-web/dist/bundle.iife.js"></script>
  <!-- Load Google One Tap -->
  <script src="https://accounts.google.com/gsi/client"></script>
  <!-- Log in with Realm and Google Authentication -->
  <script async defer>
    const app = new Realm.App({
      id: "<your_realm_app_id>",
    });
    // Callback used in `data-callback` to handle Google's response and log user into App Services
    function handleCredentialsResponse(response) {
      const credentials = Realm.Credentials.google({ idToken: response.credential });
      app
        .logIn(credentials)
        .then((user) => alert(`Logged in with id: ${user.id}`));
    }
  </script>
</html>

Utilice el flujo integrado de Google OAuth 2.0

Nota

No utilice OpenID Connect para el flujo integrado de Google OAuth 2.0

OpenID Connect no funciona con App Services: Flujo de Google OAuth 2.0 integrado. Si desea usar OpenID Connect con el SDK web de Realm, utilice el flujo de autenticación con Google One Tap.

El SDK web de Realm incluye métodos para gestionar el proceso OAuth 2.0 y no requiere la instalación de un SDK de Google. El flujo integrado sigue tres pasos principales:

Llama a app.logIn() con una credencial de Google. La credencial debe especificar una URL para tu aplicación que también figure como URI de redireccionamiento en la configuración del proveedor.
Se abre una nueva ventana con la pantalla de autenticación de Google, donde el usuario autentica y autoriza la aplicación. Una vez completado el proceso, la nueva ventana redirige a la URL especificada en la credencial.
Llama a Realm.handleAuthRedirect() en la página redirigida, que almacena el token de acceso de App Services del usuario y cierra la ventana. La ventana original de la aplicación detectará automáticamente el token de acceso y finalizará el inicio de sesión del usuario.

Ejemplo

Flujo básico de inicio de sesión web

Este ejemplo muestra cómo configurar la autenticación de Google con App Services en una aplicación web muy básica. La aplicación contiene los siguientes archivos:

.
├── auth.html
└── index.html

index.html

<!DOCTYPE html>
<html lang="en">
  <head>
    <title>Google Auth Example</title>
  </head>
  <body>
    <h1>Google Auth Example</h1>
    <button id="google-auth">Authenticate!</button>
  </body>
  <!-- Load Realm -->
  <script src="https://unpkg.com/realm-web/dist/bundle.iife.js"></script>
  <!-- Log in with App Services and Google Authentication -->
  <script>
    const app = new Realm.App({
      id: "<Your-App-ID>",
    });
    const authButton = document.getElementById("google-auth");
    authButton.addEventListener("click", () => {
      // The redirect URL should be on the same domain as this app and
      // specified in the auth provider configuration.
      const redirectUrl = "http://yourDomain/auth.html";
      const credentials = Realm.Credentials.google({ redirectUrl });
      // Calling logIn() opens a Google authentication screen in a new window.
      app
        .logIn(credentials)
        .then((user) => {
          // The logIn() promise will not resolve until you call `handleAuthRedirect()`
          // from the new window after the user has successfully authenticated.
          console.log(`Logged in with id: ${user.id}`);
        })
        .catch((err) => console.error(err));
    });
  </script>
</html>

auth.html

<!DOCTYPE html>
<html lang="en">
  <head>
    <title>Google Auth Redirect</title>
  </head>
  <body>
    <p>Redirects come here for Google Authentication</p>
  </body>
  <script>
    Realm.handleAuthRedirect();
  </script>
</html>

Importante

Limitaciones de redirección de OAuth 2.0 incorporada para Google

Debido a los cambios en los requisitos de verificación de aplicaciones OAuth, el 2.0 proceso OAuth integrado presenta limitaciones al autenticar usuarios de Google. Si utiliza el flujo de redirección de inicio de sesión de Google mediante el flujo de redirección de App Services, un máximo de 100 usuarios de Google podrán autenticarse mientras la aplicación esté en desarrollo, pruebas o pruebas, y todos los usuarios verán una notificación de aplicación no verificada antes de autenticarse.

Para evitar estas limitaciones, le recomendamos que utilice un SDK oficial de Google para obtener un token de acceso de usuario como se describe anteriormente.

Autenticación de Apple

El proveedor de autenticación Apple permite autenticar a los usuarios mediante Sign-in con Apple. Se puede usar el flujo de autenticación incorporado o autenticarse con el SDK de Apple.

Nota

Habilitar el proveedor de autenticación de Apple

Para autenticar a un usuario de Apple, debe configurar el proveedor de autenticación Apple.

Utiliza la funcionalidad incorporada de Apple OAuth 2.0

El SDK web de Realm incluye métodos para gestionar el proceso OAuth 2.0 y no requiere la instalación del SDK de Apple JS. El flujo integrado sigue tres pasos principales:

Llamas a app.logIn() con una credencial de Apple. La credencial debe especificar una URL para tu aplicación que también figure como URI de redireccionamiento en la configuración del proveedor.

// The redirect URI should be on the same domain as this app and
// specified in the auth provider configuration.
const redirectUri = "https://app.example.com/handleOAuthLogin";
const credentials = Realm.Credentials.apple(redirectUri);
// Calling logIn() opens an Apple authentication screen in a new window.
const user = app.logIn(credentials);
// The logIn() promise will not resolve until you call `Realm.handleAuthRedirect()`
// from the new window after the user has successfully authenticated.
console.log(`Logged in with id: ${user.id}`);

Se abre una nueva ventana con la pantalla de autenticación de Apple, donde el usuario autentica y autoriza la aplicación. Una vez completado el proceso, la nueva ventana redirige a la URL especificada en la credencial.

Se llama a Realm.handleAuthRedirect() en la página redirigida, que almacena el token de acceso de App Services del usuario y cierra la ventana. Tu ventana original de la aplicación detectará automáticamente el acceso token y completará el inicio de sesión del usuario.

// When the user is redirected back to your app, handle the redirect to
// save the user's access token and close the redirect window. This
// returns focus to the original application window and automatically
// logs the user in.
Realm.handleAuthRedirect();

Autenticarse con el SDK de Apple

Puedes usar el SDK oficial de Iniciar sesión con Apple JS para gestionar la autenticación del usuario y el flujo de redirección. Una vez autenticado, el SDK de Apple JS devuelve un token de ID que puedes usar para finalizar el inicio de sesión del usuario en tu app.

// Get the ID token from the Apple SDK
const { id_token } = await AppleID.auth.signIn();
// Define credentials with the ID token from the Apple SDK
const credentials = Realm.Credentials.apple(id_token);
// Log the user in to your app
const user = await app.logIn(credentials);

Tip

Si recibe un error Login failed que indica que token contains an invalid number of segments, verifique que esté pasando una versión de cadena codificada en UTF-8del JWT.

Obtener un token de acceso de usuario

Cuando un usuario inicia sesión, Atlas App Services crea un token de acceso que le otorga acceso a su aplicación. El SDK de Realm administra automáticamente los tokens de acceso, los actualiza cuando caducan e incluye un token de acceso válido para el usuario actual con cada solicitud. Realm no actualiza automáticamente el token de actualización. Cuando este caduque, el usuario deberá volver a iniciar sesión.

Si envía solicitudes fuera del SDK, debe incluir el token de acceso del usuario con cada solicitud y actualizar manualmente el token cuando caduque.

Puede acceder y actualizar el token de acceso de un usuario que haya iniciado sesión en el SDK desde su objeto Realm.User, como en el siguiente ejemplo:

// Gets a valid user access token to authenticate requests
async function getValidAccessToken(user) {
  // An already logged in user's access token might be stale. To
  // guarantee that the token is valid, refresh it if necessary.
  await user.refreshAccessToken();
  return user.accessToken;
}

Vencimiento del token de actualización

Los tokens de actualización caducan tras un periodo determinado. Cuando caducan, el token de acceso ya no se puede actualizar y el usuario debe volver a iniciar sesión.

Para obtener información sobre cómo configurar la expiración del token de actualización, consulte Administrar sesiones de usuario en la documentación de App Services.

Cerrar sesión

Para desconectar a cualquier usuario, llama al User.logOut() en su instancia de usuario.

Cerrar sesión del usuario actual:

await app.currentUser.logOut();

Cerrar sesión de usuario por ID de usuario:

const userId = app.currentUser.id;
await app.allUsers[userId].logOut();

Volver

Crear y eliminar usuarios

Administrar usuarios de correo electrónico y contraseña