Inicializar programaticamente e SPAs

O Huggy Chat funciona com frameworks do tipo Vue, React, Angular, Svelte e outros. Entretanto, possa ser que seja necessário algumas alterações. A instalação comum do Huggy Chat, em que se copia o código disponibilizado no painel e coloca no HTML, necessita do acesso ao arquivo HTML. Para ela funcionar, é necessário inserir o código de instalação no arquivo HTML que recebe o build do framework (geralmente o public/index.html ou static/index.html que os frameworks disponibilizam).

Quando não se tem acesso à esse arquivo ou simplesmente você quer inicializar o Huggy Chat via API, é necessário usar o Huggy.init.

Huggy.init(HuggyChatInit?)

Permite inicializar o Huggy Chat programaticamente. Esse método é disponibilizado pela API somente quando o objeto de configuração $_Huggy não é fornecido ou Huggy.logout é chamado e o Huggy Chat não é recarregado. O parâmetro { HuggyChatInit } é opcional. Os casos de uso são:

  1. Ao inicializar o Huggy Chat sem o objeto de configuração $_Huggy
  2. Ao executar o método Huggy.logout(false). Saiba mais sobre o Huggy.logout

No caso 1. é útil em SPAs ou quando você precisa inicializar o Huggy Chat em outro momento. Ao invés de acrescentar o código de instalação e ele iniciar automaticamente, você vai apenas inserir o script do Huggy Chat:

<script src="https://js.huggy.chat/widget.min.js"></script>
1

Quando ele é inicializado e não existe o objeto de configuração $_Huggy no window, ele disponibiliza o método Huggy.init na API.

Nesse caso, o único método disponível em toda a API é o Huggy.init

Utilizando

Há 2 maneiras de inicializar programaticamente. Você pode declarar o objeto de configuração do Huggy Chat window.$_Huggy=HuggyChatInit e chamar o Huggy.init() sem parâmetros. Assim, ele vai procurar o objeto de configuração previamente declarado.

Note que o objeto de configuração nesse caso é um específico para inicialização programática, o HuggyChatInit

A outra é inicializar o Huggy.init(HuggyChatInit) passando a configuração específica.

Em ambos os casos, após a execução do Huggy.init, o Huggy Chat é devidamente carregado e o método deixa de existir.

HuggyChatInit

PropertyTypeDescriptionDefault
contextIDstringID de contexto. Você pode encontrá-lo no script de inicialização presente no código de instalação do seu Huggy Chat, fornecido pela nossa plataforma durante a configuração do canal.
...HuggyChatConfigTodas as propriedades presentes em HuggyChatConfig são herdadas por HuggyChatInit.
<a href="#contextid">contextID</a>
string

ID de contexto. Você pode encontrá-lo no script de inicialização presente no código de instalação do seu Huggy Chat, fornecido pela nossa plataforma durante a configuração do canal.

Default:


...
HuggyChatConfig

Todas as propriedades presentes em HuggyChatConfig são herdadas por HuggyChatInit.

Default:


contextID

O contextID é um hash único que é necessário para o funcionamento do Huggy Chat. Se você estiver utilizando a forma comum que é inserindo o código de instalação disponível no canal de configuração da sua conta, você não precisa se preocupar porque ele já está incluindo.

Esse parâmetro só é importante para quem utiliza o Huggy Chat programaticamente via Huggy.init.

Esse hash é encontrado no código de instalação do Huggy Chat, nas configurações de canal. Vou pegar como exemplo o código usado na seção instalando









 



<!-- Init code Huggy Chat  //-->
<script>
  var $_Huggy = {
    defaultCountry: '+55',
    widget_id: '0001',
    company: "0001"
  };
  
  (function(i,s,o,g,r,a,m){ i[r]={context:{id:'8551dbde3f168db249381597eea81c71'}};a=o;o=s.createElement(o); o.async=1;o.src=g;m=s.getElementsByTagName(a)[0];m.parentNode.insertBefore(o,m); })(window,document,'script','https://js.huggy.chat/widget.min.js?v=8.0.0','pwz');
</script>
<!-- End code Huggy Chat  //-->
1
2
3
4
5
6
7
8
9
10
11

Na linha em destaque, que é a inicialização do script, observamos a chamada do script do nosso CDN e o hash contextID 8551dbde3f168db249381597eea81c71

Neste caso, reformulando o código padrão de instalação para uso com o Huggy.init ficaria assim:





 


Huggy.init({
  defaultCountry: '+55',
  widget_id: '0001',
  company: "0001",
  contextID: '8551dbde3f168db249381597eea81c71'
})
1
2
3
4
5
6

Huggy.init recebe como parâmetro um objeto HuggyChatInit

Tipos