Skip to content
AnnA Docs

How to use the authentication hash

After generating the HASH for a corporate user, it can be used in the URL of the AnnAWeb component that will be embedded on the client’s page.

  • Component URL: The query string will consist of the generated HASH and, if applicable, an AnnA command to be executed when the chat opens.

Example of HTML embedding on a client’s page

<div id="annaChat">
    #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;
  <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>
    function openChat() {
      document.getElementById("chatWindow").style.display = "block";
      document.getElementById("openChat").style.display = "none";
      var frame = document.createElement("iframe");
      frame.src = "YOUR_GENERATED_CHATURL"; = "AnnAChatBox";
      frame.frameborder = "0"; = "440px"; = "600px";

    function closeChat() {
      document.getElementById("chatWindow").style.display = "none";
      document.getElementById("openChat").style.display = "block";