Identificar usuarios conectados en Messenger

Notiondesk Messenger puede identificar a los usuarios que han iniciado sesión en su aplicación.

La identificación utiliza un token de usuario de corta duración generado por su backend. Su frontend pasa este token al SDK de Messenger (Notiondesk) cuando se inicializa Messenger.

Esto evita que las credenciales de autenticación confidenciales queden expuestas en el código del navegador.

Antes de empezar

Necesitas:

• Notiondesk Messenger instalado con el paquete @notiondesk-so/messenger-js-sdk

• La autenticación ya está implementada en su aplicación.

• Un backend que puede generar un token de usuario Notiondesk

• Tu secreto de la aplicación Notiondesk

Nunca exponga su secreto de aplicación Notiondesk en JavaScript de frontend, componentes de React, variables de entorno enviadas al navegador o repositorios públicos.

Cómo funciona la identificación de usuarios

El flujo de autenticación es:

1. Un usuario inicia sesión en tu aplicación.

2. Tu frontend solicita un token de usuario Notiondesk a tu backend.

3. Tu sistema backend firma un token de corta duración para ese usuario autenticado.

4. Tu backend devuelve el token firmado al navegador.

5. Tu sitio web o aplicación pasa el token a Notiondesk Messenger

6. Messenger reconoce al visitante como el usuario correspondiente.

Tu sistema backend debe determinar la identidad del usuario a partir de la sesión autenticada de tu aplicación. No confíes en un ID de usuario proporcionado directamente por el navegador.

Paso 1: Crea una clave secreta para la aplicación.

Ve a Configuración → Acceso en Notiondesk y crea un secreto de aplicación.

Almacene el secreto en una variable de entorno del servidor, por ejemplo:

NOTIONDESK_APP_SECRET

La clave secreta de la aplicación se muestra solo una vez, al crearse. Cópiela y guárdela de forma segura cuando aparezca.

Puedes administrar y rotar tus secretos de aplicación desde Configuración → Acceso .

Nunca agregues el secreto de la aplicación a:

• JavaScript de frontend

• Componentes cliente de React o Vue

• Variables del entorno público

• Paquetes de navegador

• Repositorios públicos

Paso 2: Firma un token de usuario en tu backend.

Genera el token de usuario desde tu backend después de que tu aplicación haya autenticado al usuario actual.

Los tokens de usuario Notiondesk utilizan HS256 y deben contener las siguientes declaraciones:

Utilice user_id como identificador de usuario. No utilice sub en lugar de user_id.

También puede proporcionar información del usuario, como por ejemplo:

• email

• name

Mantén los tokens con una vida útil corta y genéralos únicamente en tu servidor.

Notiondesk proporciona ejemplos de firma específicos para cada lenguaje en la configuración de Messenger, como Node.js, Python, PHP y Ruby. Utilice el ejemplo que aparece en su panel de control de Notiondesk en lugar de firmar tokens mediante código del navegador.

Paso 3: Pasa el token a Messenger

Una vez que tu servidor haya generado el token, pásalo a tu instalación de Messenger.

Instalación estándar de sitio web

Si instalaste Messenger usando el script estándar, proporciona el token firmado con data-user-token:

Reemplazar:

<script
  async
  src="https://static.notiondesk.help/messenger/widget.js"
  data-messenger-id="YOUR_MESSENGER_ID"
  data-user-token="YOUR_SIGNED_TOKEN">
</script>

• YOUR_MESSENGER_ID con tu ID de Messenger

• YOUR_SIGNED_TOKEN con el token generado por tu backend para el usuario actual.

No incluyas el token de un usuario directamente en la plantilla estática de un sitio web. El token debe generarse para el usuario autenticado actual.

SDK de JavaScript/TypeScript

Obtén el token firmado de tu backend y pásalo a initNotiondesk:

El endpoint /api/notiondesk-token es un ejemplo. Utilice la ruta de backend que corresponda a su aplicación.

React y Next.js

Pasa el token firmado a NotiondeskProvider:

El token se puede obtener desde tu servidor después de que el usuario se haya autenticado.

El secreto de la aplicación Notiondesk nunca debe estar disponible para el componente cliente.

Paso 4: Validar el token

Antes de publicar, utilice la herramienta de validación de tokens disponible en la configuración de su Messenger Notiondesk.

Pega un token que tu servidor backend acaba de generar.

Notiondesk comprueba el token con tus Secretos de aplicación activos y muestra la información del usuario que Messenger puede leer de él.

El token utilizado para la validación se comprueba, pero no se almacena.

La validación es útil para detectar:

import { initNotiondesk } from "@notiondesk-so/messenger-js-sdk";

const userToken = await fetch("/api/notiondesk-token").then((response) =>
  response.ok ? response.text() : null,
);

const notiondesk = await initNotiondesk({
  messengerId: "YOUR_MESSENGER_ID",
  userToken,
});

<NotiondeskProvider
  messengerId="YOUR_MESSENGER_ID"
  userToken={userToken}
>
  {children}
</NotiondeskProvider>

• Faltan reclamaciones obligatorias

• Un user_id incorrecto

• Un site_uuid incorrecto

• Tokens caducados

• Fichas firmadas con la clave secreta incorrecta

• Firmas no válidas

Actualizar un token de usuario

Los tokens de usuario deben tener una duración limitada.

Si su aplicación recibe un token actualizado mientras Messenger ya está inicializado, actualice la configuración de Messenger:

No es necesario crear otra instancia de Messenger solo para actualizar el token de usuario.

Gestionar el cierre de sesión

Borra el usuario identificado cuando alguien cierre sesión en tu aplicación.

Puedes eliminar el token actual:

O bien, destruir la instancia de Messenger por completo:

Asegúrese de que se haya borrado la identidad del usuario anterior antes de que otro usuario inicie una sesión en el mismo navegador.

Cargar Messenger solo para usuarios autenticados

Identificar a un usuario y decidir si Messenger debe estar disponible son cuestiones distintas.

Si Messenger solo debe cargarse para los usuarios que hayan iniciado sesión, mantenga esa comprobación de permisos dentro de su aplicación.

Por ejemplo, con React:

El uso del servicio de mensajería anónima puede permanecer habilitado si la experiencia de soporte debe estar disponible tanto para visitantes como para clientes registrados.

mejores prácticas de seguridad

Al identificar usuarios en Notiondesk Messenger:

notiondesk.updateConfig({
  userToken: refreshedUserToken,
});

notiondesk.updateConfig({
  userToken: null,
});

notiondesk.destroy();

<NotiondeskProvider
  messengerId="YOUR_MESSENGER_ID"
  enabled={currentUser.isAuthenticated}
  userToken={userToken}
>
  {children}
</NotiondeskProvider>

• Mantén tu aplicación en secreto en el servidor.

• Firma los tokens solo en tu backend.

• Utilice HS256

• Incluya todas las reclamaciones requeridas.

• Determina user_id a partir de tu sesión autenticada del lado del servidor.

• Mantén los tokens con una vida útil corta.

• Nunca incluyas tokens de usuario directamente en el código de la interfaz.

• Actualizar los tokens cuando sea necesario

• Borrar el token actual cuando un usuario cierre sesión.

• Cambia la clave secreta de tu aplicación si crees que ha quedado expuesta.

Solución de problemas

notiondesk.updateConfig({
  userToken: null,
});