Pular para o conteúdo

Como utilizar o hash de autenticação

Depois de gerar o hash para um usuário corporativo, é possível utilizar na URL do componente AnnAWeb que será integrado na página do cliente

  • URL do componente: A querystring será composta do HASH gerado e caso pertinente, um comando AnnA a ser executado na abertura do chat.

Exemplo HTML AnnA Chat integrado a página do cliente

<div id="annaChat">
<style>
#annaChat .chat-window * {
box-sizing: border-box;
}
#annaChat {
font-family: "Roboto", Verdana;
}
#annaChat .open-chat {
background-color: #555;
color: white;
padding: 16px 20px;
border: none;
cursor: pointer;
opacity: 0.8;
position: fixed;
bottom: 23px;
right: 28px;
width: 10%;
text-align: center;
}
#annaChat .chat-window {
width: 450px;
height: 650px;
display: none;
position: fixed;
bottom: 0;
right: 15px;
border: 3px solid #f1f1f1;
z-index: 9;
}
#annaChat .chat-container {
display: flex;
flex-direction: column;
height: 100%;
padding: 5px;
background-color: #fff;
}
#annaChat .cancel-btn {
display: inline-block;
background-color: transparent;
font-size: 24px;
font-weight: 900;
color: #555;
padding: 0 14px;
border: none;
cursor: pointer;
opacity: 0.8;
text-align: center;
}
#annaChat .chat-title {
display: flex;
justify-content: space-between;
align-items: center;
margin: 5px;
font-size: 16px;
}
#annaChat .text-title {
display: inline-block;
font-weight: bold;
font-size: 18px;
}
</style>
<div class="open-chat" id="openChat" onclick="openChat()">Chat</div>
<div class="chat-window" id="chatWindow">
<div class="chat-container">
<div class="chat-title">
<div class="text-title">AnnA Chat</div>
<div class="cancel-btn" onclick="closeChat()" title="Minimizar">-</div>
</div>
</div>
</div>
<script>
function openChat() {
document.getElementById("chatWindow").style.display = "block";
document.getElementById("openChat").style.display = "none";
var frame = document.createElement("iframe");
frame.src = "YOUR_GENERATED_CHATURL";
frame.id = "AnnAChatBox";
frame.frameborder = "0";
frame.style.width = "440px";
frame.style.height = "600px";
$(".chat-container").append(frame);
}
function closeChat() {
document.getElementById("chatWindow").style.display = "none";
document.getElementById("openChat").style.display = "block";
$("#AnnAChatBox").detach();
}
</script>
</div>