06. Capturando informações de contexto do site para personalizar a conversa do Web Chat

Por padrão, durante a inicialização, o Web Chat envia informações do contexto do site onde ele está integrado. Todas essas informações estão agrupadas dentro da variável website, podendo ser acessada a partir dos seguintes atributos:

url: url do site.
hostname: hostname do site.
path: path do site.
rawQueryParams: dado bruto dos parâmetros query string da página.
queryParams: parâmetros query string separados em “nome” e “valor"do parâmetro.
referrer: agrupamento das informações referentes à página que continha o link para o site onde o Web Chat está integrado. É similar à variável website e possui os seguintes atributos:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
{
  "url": "https://www.empresa-xyz.com/produtos/X-Produto?utm_source=google",
  "hostname": "www.empresa-xyz.com",
  "path": "/produtos/X-Produto",
  "rawQueryParams": "utm_source=google",
  "queryParams": {
    "utm_source": "google",
  },
  "referrer": {
    "url": "https://www.google.com.br/",
    "hostname": "www.google.com.br",
    "path": "/",
    "rawQueryParams": "",
    "queryParams": {}
  }
}

Para acessar algum desses atributos diretamente no fluxo da conversa do chatbot, por exemplo, basta utilizar a diretiva #{session['website']} - respeitando a hierarquia da variável. Exemplo:

#{session['website']['queryParams']['utm_source']} ou somente #{website.queryParams.utm_source}: retornará o valor google.
#{session['website']['referrer']['hostname']} ou #{website.referrer.hostname}: retornará o valor www.google.com.br.

Essas informações ficarão na variável extra dentro de website.

Para enviar informações extras para o chatbot, é necessário adicionar o campo extraData durante a integração do Web Chat em seu site, conforme exibido abaixo.

1
2
3
4
5
6
<script src="https://static.zenvia.com/embed/js/zenvia-chat.min.js"></script>
<script>
  new ZenviaChat('id-do-chat-aqui')
    .extraData({ campoA: 'valor A', campoX: 'valor de X', outroCampo: { campoInterno: "um valor qualquer" }})
    .build();
</script>

Vale salientar que o campo extraData pode assumir qualquer estrutura, pois é um objeto JavaScript ou pode ser somente uma string.

Para acessar os dados extras no chatbot, basta utilizar a diretiva #{session['website']['extra']}, respeitando a hierarquia do objeto enviado. Exemplo:

#{session['website']['extra']['outroCampo']['campoInterno']} retornará um valor qualquer.

Como podemos ajudar?