Chatbot - Adding additional context
In Aidbase, you can give your chatbot custom instructions.
This is useful when you want to give your chatbot general instructions to follow.
But sometimes, we want to give the chatbot some additional information dynamically, which can be specific to a given user or a situation.
How it works
If you're using HTML, you can query the DOM node of the Chatbot.
This allows you to assign properties and call methods on the Chatbot.
If you're using React, you can add these properties directly to the <Chat>
component as props.
<ab-chat
id='my-chatbot'
chatbotID='YOUR-CHATBOT-ID'
// ...additional attributes
></ab-chat>
If you don't manually add the <ab-chat>
element, it will be added automatically.
It will have an id "ab-chat" which you can use to query the DOM node:
<ab-chat id="ab-chat"></ab-chat>
Adding additional context through the context
property
// Get the DOM node of the Chatbot
const chatbot = document.getElementById('my-chatbot');
// Add additional context as a string
chatbot.context = "Additional context here";
A context can be up to 5,000 characters long.
Example
// Get the DOM node of the Chatbot
const chatbot = document.getElementById('my-chatbot');
// For the sake of the example, let's say we're
// getting the user's information from an api endpoint.
const userRequest = await fetch('/myapi/user');
const user = await userRequest.json();
const { username, latestOrderID } = user;
chatbot.context = `
The user you are talking to is ${username}. Greet them by name.
If the user asks for a status on their latest order, follow these instructions:
- Ask the user for an order ID.
- If the user responds with "${latestOrderID}", tell them that their order is on its way.
- If they respond with any other order ID, tell them that you couldn't find their order.
`;
The context
property is a string that will be passed to the chatbot as is.
Do not use this to pass any sensitive information.