Chat

The chat window, <voxio-chat>, talks to the same flow as your voice widgets. It opens with the agent's greeting and keeps the conversation when the visitor reloads.

#Add the chat

Mount the chat with your flow key:

1<script src="https://cdn.jsdelivr.net/npm/voxioagent@2.0.0/dist/voxio.js"
2        data-flow-key="YOUR_FLOW_KEY" data-widget="chat" defer></script>

Replace YOUR_FLOW_KEY with your flow key, from the flow's Overview in the dashboard.

A chat launcher appears in the corner. Opening it shows the agent's greeting.

#Options

flowKeystringrequired

Your flow key.

configPartial<ChatbotConfig>

The look and text of the window, such as botName, welcomeMessage, placeholder, primaryColor and chatWidth.

draggableboolean

Lets the visitor drag the launcher. It snaps to an edge and remembers the spot.

environment"standard" | "gpu"

The deployment. See Servers and environments.

debugboolean

Prints diagnostics to the console.

#Read the messages

To follow the conversation from your own code, subscribe to it:

1const off = chat.onMessage((message) => console.log(message));
2
3chat.getMessages();   // everything so far
4chat.sessionId;       // the conversation's session id
5chat.destroy();       // ends the session and removes the chat

Call off() to stop listening.

#Next steps

• Customising widgets: match the chat to your brand.
• Webhooks: receive each conversation on your server.