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:
- Ao inicializar o Huggy Chat sem o objeto de configuração $_Huggy
- 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>
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
Property | Type | Description | Default | |
---|---|---|---|---|
contextID | 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. | ||
... | HuggyChatConfig | Todas as propriedades presentes em HuggyChatConfig são herdadas por HuggyChatInit. |
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:
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 //-->
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'
})
2
3
4
5
6
Huggy.init
recebe como parâmetro um objeto HuggyChatInit