Identificar usuários conectados no Messenger Notiondesk

Notiondesk O Messenger pode identificar usuários que estão conectados ao seu aplicativo.

A identificação utiliza um token de usuário de curta duração gerado pelo seu backend. Seu frontend passa esse token para o SDK do Messenger quando o Messenger é inicializado.

Isso impede que credenciais de autenticação confidenciais sejam expostas no código do navegador.

Antes de começar

Você precisa de:

• Notiondesk Messenger instalado com o pacote @notiondesk-so/messenger-js-sdk

• A autenticação já está implementada em seu aplicativo.

• Um backend que pode gerar um token de usuário Notiondesk

• Seu segredo do aplicativo Notiondesk

Nunca exponha o segredo do seu aplicativo Notiondesk em JavaScript do frontend, componentes React, variáveis ​​de ambiente enviadas para o navegador ou repositórios públicos.

Como funciona a identificação do usuário

O fluxo de autenticação é o seguinte:

1. Um usuário inicia sessão no seu aplicativo.

2. Seu frontend solicita um token de usuário Notiondesk do seu backend

3. Seu sistema de backend assina um token de curta duração para esse usuário autenticado.

4. Seu servidor retorna o token assinado para o navegador.

5. Seu site ou aplicativo passa o token para o Messenger Notiondesk

6. O Messenger reconhece o visitante como o usuário correspondente.

Seu servidor deve determinar a identidade do usuário a partir da sessão autenticada do aplicativo. Não confie em um ID de usuário fornecido diretamente pelo navegador.

Passo 1: Crie um segredo para o aplicativo

Acesse Configurações → Acesso em Notiondesk e crie um Segredo de Aplicativo.

Armazene o segredo em uma variável de ambiente do lado do servidor, por exemplo:

NOTIONDESK_APP_SECRET

A chave secreta do aplicativo é exibida apenas uma vez, quando ele é criado. Copie e guarde-a em local seguro quando ela aparecer.

Você pode gerenciar e alternar seus Segredos de Aplicativo em Configurações → Acesso .

Nunca adicione o Segredo do Aplicativo a:

• JavaScript de front-end

• Componentes de cliente React ou Vue

• Variáveis ​​do ambiente público

• Pacotes de navegador

• Repositórios públicos

Etapa 2: Assine um token de usuário no seu backend

Gere o token do usuário no seu backend depois que o seu aplicativo autenticar o usuário atual.

Os tokens de usuário Notiondesk usam HS256 e devem conter as seguintes declarações:

Use user_id como identificador de usuário. Não use sub em vez de user_id.

Você também pode fornecer informações do usuário, tais como:

• email

• name

Mantenha os tokens com vida útil curta e gere-os apenas em seu servidor.

O Notiondesk fornece exemplos de assinatura específicos para cada linguagem na sua configuração do Messenger, para linguagens como Node.js, Python, PHP e Ruby. Use o exemplo fornecido no seu painel do Notiondesk em vez de assinar tokens no código do navegador.

Passo 3: Passe o token para o Messenger

Assim que o seu servidor gerar o token, passe-o para a sua instalação do Messenger.

Instalação padrão de sites

Se você instalou o Messenger usando o script padrão, forneça o token assinado com data-user-token:

Substituir:

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

• __PRESERVADO_27__ com seu ID do Messenger

• YOUR_SIGNED_TOKEN com o token gerado pelo seu backend para o usuário atual

Não insira o token do usuário diretamente no código-fonte de um modelo de site estático. O token deve ser gerado para o usuário autenticado no momento.

SDK JavaScript/TypeScript

Obtenha o token assinado do seu backend e passe-o para initNotiondesk:

O endpoint /api/notiondesk-token é um exemplo. Use a rota de backend que corresponde à sua aplicação.

React e Next.js

Passe o token assinado para NotiondeskProvider:

O token pode ser obtido do seu backend após o usuário ter se autenticado.

O segredo do aplicativo Notiondesk nunca deve estar disponível para o componente cliente.

Etapa 4: Validar o token

Antes de entrar em funcionamento, use a ferramenta de validação de token disponível na configuração do seu Messenger.

Cole o token que seu backend acabou de gerar.

Notiondesk verifica o token em relação aos seus Segredos de Aplicativo ativos e exibe as informações do usuário que o Messenger pode ler a partir dele.

O token usado para validação é verificado, mas não armazenado.

A validação é ú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>

• Falta de declarações obrigatórias

• Um user_id incorreto

• Um valor incorreto de site_uuid

• Tokens expirados

• Tokens assinados com a chave secreta errada

• Assinaturas inválidas

Atualizar token de usuário

Os tokens de usuário devem ter curta duração.

Se o seu aplicativo receber um token atualizado enquanto o Messenger já estiver inicializado, atualize a configuração do Messenger:

Você não precisa criar outra instância do Messenger apenas para atualizar o token do usuário.

Gerenciar logout

Limpe o usuário identificado quando alguém sair do seu aplicativo.

Você pode remover o token atual:

Ou destrua completamente a instância do Messenger:

Certifique-se de que a identidade do usuário anterior seja apagada antes que outro usuário inicie uma sessão no mesmo navegador.

Carregar o Messenger somente para usuários autenticados

Identificar um usuário e decidir se o Messenger deve estar disponível são questões distintas.

Se o Messenger só deve ser carregado para usuários autenticados, mantenha essa verificação de permissão dentro do seu aplicativo.

Por exemplo, com React:

O uso do Messenger anônimo pode permanecer ativado se a sua experiência de suporte precisar estar disponível tanto para visitantes quanto para clientes conectados.

Melhores práticas de segurança

Ao identificar usuários no Messenger:

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

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

notiondesk.destroy();

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

• Mantenha seu aplicativo em segredo no servidor.

• Assine os tokens somente no seu backend.

• Use HS256

• Inclua todas as declarações obrigatórias.

• Determine user_id da sua sessão autenticada no servidor.

• Mantenha os tokens com vida útil curta.

• Nunca insira tokens de usuário diretamente no código do frontend.

• Atualize os tokens quando necessário.

• Limpar o token atual quando um usuário fizer logout.

• Gire o Segredo do seu Aplicativo se você acredita que ele foi revelado.

Solução de problemas

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