Se você está usando o Web Widget (clássico) com a sua conta do Chat, pode configurar seu widget para autenticar os visitantes em todas as páginas carregadas usando a API do JavaScript e o token JWT.
Este artigo se aplica a clientes que usam as seguintes versões do chat em tempo real:
- Zendesk Chat na fase 4 – apenas Chat ou com Support
- Zendesk Chat na fase 3 – com a experiência do Chat integrado no Web Widget (clássico)
Se você está usando o Zendesk Chat na fase 3 (apenas Chat), consulte Ativação de visitantes autenticados no widget do Chat.
Para identificar a versão do Chat que você está usando, consulte Determinação da versão de sua conta do Zendesk Chat.
Este artigo inclui os tópicos a seguir:
Visão geral
Com a nova API do JavaScript e token JWT, você pode configurar seu widget para autenticar os visitantes em todas as páginas carregadas.
Ao configurar o Web Widget (clássico) para usar visitantes autenticados, você aproveita os seguintes benefícios:
- Maior confiança e segurança para seus visitantes/clientes e agentes de que a pessoa do outro lado da conversa é real.
- Suporte para tráfego por diferentes domínios. Se você estiver inserindo o widget em vários domínios ou vinculando a serviços com hospedagem externa (por exemplo, o Shopify), autenticar o visitante trará as informações desses diferentes domínios até a plataforma do Chat, dando mais contexto aos agentes.
- Suporte para identificação por diferentes dispositivos/navegadores. Quando a ID personalizada é especificada na chamada de autenticação, o visitante pode ser reconhecido como sendo a mesma pessoa mesmo se ele mudar de dispositivo ou navegador.
- Possibilidade de apresentar conversas de chats anteriores para o visitante no widget
Geração de um novo segredo compartilhado do Chat
Como gerar um segredo compartilhado:
- No painel do Zendesk Chat, acesse Configurações > Widget > aba Segurança do widget.
- Clique no botão Gerar abaixo da seção Autenticação do visitante:
Como essa é uma configuração de segurança, seu segredo compartilhado deve ser gerado, copiado e colado em uma mensagem informativa para sua equipe de engenheiros, ou diretamente em sua base de códigos, de uma só vez. Ele não deve ser inserido no navegador:
Gerar um novo segredo compartilhado revogará o token antigo. Se você acha que seu segredo compartilhado não é mais seguro, gere um novo. Se você precisar alterar o segredo sempre, deve programar a geração para quando o Chat estiver offline, pois isso desconecta os visitantes do widget por 5 minutos.
Após gerar o segredo compartilhado, use-o para criar um token JWT (aprenda mais sobre JWT), que você adicionará ao seu trecho do Web Widget.
Criação do token JWT
Como criar um token JWT e adicionar o código ao trecho do Chat independente
- Crie uma carga de dados do lado do servidor para o token de JWT. As seguintes informações são necessárias:
- name: nome do cliente
- e-mail: e-mail do cliente
- external_id: cadeia de caracteres alfanumérica; é um identificador exclusivo do cliente. Após o valor ser definido para o cliente, ele não pode ser alterado. Recomendamos que você use a ID de usuário exclusiva do seu sistema nesse campo. Por exemplo, user-123456.
- iat: valor inteiro do carimbo de data e hora atual, em segundos. Algumas funções em linguagens específicas como, por exemplo, Date.now() do JavaScript, retorna milissegundos, portanto, não esqueça de converter para segundos. A autenticação Iat para o Chat permite até dois minutos de distorção do relógio.
- exp: valor inteiro do carimbo de data e hora atual, em segundos. Esse valor indica a validade desse token JWT. O valor máximo permitido é de até 7 minutos do valor de iat.
- Use as amostras de código abaixo para encontrar um modelo que atenda às suas necessidades de linguagem.
- Use a API zESetting Javascript com a chave `webWidget.authentication.chat.jwtFn` para fornecer uma função que gera um novo JWT sempre que é invocada. Segue um exemplo de código:
window.zESettings = { webWidget: { authenticate: { chat: { jwtFn: function(callback) { fetch('JWT_TOKEN_ENDPOINT').then(function(res) { res.text(jwt).then(function(jwt) { callback(jwt); }); }); } } } } };
Observação: o jwtFn pode ser chamado várias vezes ao longo de uma sessão de chat para obter um novo JWT e validar a identidade do visitante pela sessão.
Amostras de código
Seu token precisa ser gerado dinamicamente do lado do servidor no carregamento da página. Encontre o modelo abaixo que atenda às suas necessidades de linguagem. Personalize a amostra como desejar, certificando-se de substituir #{details} com suas próprias informações.
Se nenhuma dessas amostras atender às suas necessidades, o JWT tem uma lista mais extensa de bibliotecas de JWT para explorar.
Ruby
Primeiramente, instale ruby-jwt.
Se você estiver usando Rubygems:
gem install jwt
Se estiver usando o Bundler, adicione o seguinte ao seu arquivo gem:
gem 'jwt'
Depois, gere um token usando o segredo compartilhado:
require 'jwt'
payload = {
:name => "#{customerName}",
:email => "#{customerEmail}",
:iat => timestamp,
:external_id => "#{externalId}"
}
token = JWT.encode payload, "#{yourSecret}"
NodeJS
Instale jsonwebtoken:
npm install jsonwebtoken --save-dev
Depois, gere um token usando o segredo compartilhado:
var jwt = require('jsonwebtoken');
var payload = {
name: '#{customerName}',
email: '#{customerEmail}',
iat: #{timestamp},
external_id: '#{externalId}'
};
var token = jwt.sign(payload, '#{yourSecret}');
Python
Instale python-jose:
pip install python-jose
Gere um token usando o segredo compartilhado:
from jose import jwt
var payload = {
'name': '#{customerName}',
'email': '#{customerEmail}',
'iat': #{timestamp},
'external_id': '#{externalId}'
}
token = jwt.encode(payload, '#{yourSecret}'
PHP
Baixe PHP-JWT:
composer require firebase/php-jwt
Gere um token usando o segredo compartilhado:
use \Firebase\JWT\JWT;
$payload = {
'name' => '#{customerName}' ,
'email' => '#{customerEmail}',
'iat' => #{timestamp},
'external_id' => '#{externalId}'
};
$token = JWT::encode($payload, '#{yourSecret}');
Elixir
Adicione ‘json_web_token_ex’ ao seu arquivo ‘mix.exs’:
defp deps do
[{:json_web_token, "~> 0.2"}]
end
Gere um token usando o segredo compartilhado:
data = %{
name: "#{customerName}",
email: "#{customerEmail}",
iat: "#{timestamp}",
external_id: "#{externalId}"
}
options = %{ key: "#{yourSecret}" }
jwt = JsonWebToken.sign data, options
Sair
Se você quiser desconectar o visitante autenticado, precisará usar a API do JavaScript zE.logout. Para saber mais sobre a API, clique aqui.
Sobre a experiência do agente com visitantes autenticados
Há algumas atualizações no painel do Chat quando um agente começa a conversar por chat com um visitante autenticado.
Primeiro, o agente reconhece que o visitante é autenticado pela marca de verificação verde que sobrepõe o avatar do visitante:
O agente também poderá notar que não pode editar o nome e o e-mail do visitante, pois essas informações verdadeiras são enviadas pela API do JavaScript.
Por último, banir um visitante autenticado significa que ele não poderá acessar o widget de Chat por dispositivos e navegadores.
Sobre a experiência do Web Widget (clássico) com visitantes autenticados
A experiência dos visitantes autenticados no widget do Chat é um pouco diferente. Primeiro: sua informação é somente-leitura e não pode ser modificada usando o widget ou as APIs do JavaScript.
Segundo: as sessões de chat em andamento são sincronizadas pelos dispositivos quando o visitante está autenticado. Isso permite que ele mude de computador/navegador durante uma sessão, o que não é possível no momento.
Terceiro: não há recurso de chat em janela pop-out para os visitantes autenticados porque não é possível verificar a identidade por esse tipo de janela (visto que a experiência está hospedada em nosso domínio zopim.com).
Por último, o visitante autenticado poderá ver conversas anteriores no widget rolando o mouse pelo log de chat. Para saber mais sobre o suporte ao histórico de conversas para visitantes autenticados, clique aqui.