Início Rápido
1. Injetando o script
Para realizar a instalação, é necessário adicionar uma tag script
ao final do seu arquivo HTML utilizando um dos canais de distribuição. Há duas formas principais de fazer isso:
- Diretamente pelo HTML:
<!-- Adicionar dentro do body após todo o código -->
<script src="https://chatbot-api.handtalk.me/api/1.0.0/ht-api-sdk.min.js"></script>
- Utilizando Javascript:
const script = document.createElement("script");
script.src = "https://chatbot-api.handtalk.me/api/1.0.0/ht-api-sdk.min.js";
document.body.appendChild(script);
Independente do método, quando o script for carregado, a classe HTApi
vai estar disponível no objeto global window
.
Dica: Aguardar carregamento do script
Se você tentar instanciar a classe HTApi
imediatamente após a inserção da tag script
, pode receber um erro informando que a classe não está disponível. Isso ocorre, pois o carregamento do script não é síncrono. Para corrigir isso, recomendamos utilizar o segundo método de injeção de script e utilizar a função onload
para aguardar a conclusão do carregamento e assim, garantir que a classe HTApi
esteja disponível.
const script = document.createElement("script");
script.src = "https://chatbot-api.handtalk.me/api/1.0.0/ht-api-sdk.min.js";
document.body.appendChild(script);
script.onload = () => {
// Inicie a biblioteca aqui
};
2. Instanciando a classe
Agora que a biblioteca foi carregada em seu código, só resta instanciar a classe HTApi
e utilizar os seus métodos. No código abaixo, vamos instanciar o HTApi
com o mínimo de informações necessárias, iniciar a biblioteca e realizar uma tradução simples:
const htapi = new window.HTApi({ token: "SEU TOKEN" });
htapi.active();
// Simula um tempo de carregamento da biblioteca
setTimeout(() => {
htapi.translate("Olá mundo!");
}, 2000);
3. Exemplo completo
Juntando todos os techos de código teremos algo parecido com o exemplo abaixo:
const script = document.createElement("script");
script.src = "https://chatbot-api.handtalk.me/api/1.0.0/ht-api-sdk.min.js";
document.body.appendChild(script);
script.onload = () => {
const htapi = new window.HTApi({ token: "SEU TOKEN" });
htapi.active();
// Simula um tempo de carregamento da biblioteca
setTimeout(() => {
htapi.translate("Olá mundo!");
}, 2000);
};