Working with the ChatBox

If you are running an application where you have access to your visitor's details, such as their name and e-mail address, you can input that information directly into the chatbox. This means that whenever a new chat is started, you'll know exactly who you're talking to.

// create the chatbox the same as before
var chatbox = new NatterlyChatbox('<YOUR SITE TOKEN>');
// Add visitor details

// name and emailAddress are required
chatbox.visitor.name = '<visitor name here>';
chatbox.visitor.emailAddress = '<visitor email address here>';

// You can also add any custom data relating to the visitor
chatbox.customData.accountNumber = "123456";
chatbox.customData.something = "Whatever you like";

If you decide to add visitor details to the chat then name and emailAddress are required fields. The custom fields are completely optional, and will appear in the agent interface along with the chat.

How to trust who you are talking to

Users can add their own details into the chatbox, so how can you trust the customer you are chatting to is who they say they are? You can achieve this by signing your visitor's details.

Natterly uses JSON Web Tokens (JWT) to verify that a user is who they say they are. Instead of providing a name and email as in the example above, you provide a signed JWT which contains this information in the payload, along with an exp property. This exp property is a timestamp describing when the token should expire, expressed as a unix timestamp in seconds. You should make your tokens short lived - no more than a few minutes.

// The payload for your visitor would look something like this
{
  "name": "<Your visitors name>",
  "email_address": "<Your visitors email address>",
  "exp": 1500917598896
}

// The payload for your custom data could look like this
{
  "account number": "123456",
  "something": "Whatever you like",
  "exp": 1500917598896
}

If you choose to provide custom data, it must also be signed in order for your visitor to be marked as verified.

You need to generate these JWT tokens on your server, using the signing key you'll find in the sites list of your Natterly admin area, under "Security options". There are plenty of libraries available to help you do this in all commonly used languages - check out jwt.io to find the right one for you.

Once you have generated your token on your server, it is simply a case of plugging that token into the Natterly chatbox:

chatbox.visitor = "<your generated visitor JWT>";
chatbox.customData = "<your generated customData JWT>";

Now, when you get chats you can be sure that your customers are who they say they are, as you'll see the "Trusted" tick on chats in your admin interface.

If you have any trouble setting this up, please start a chat with us and we can help you through it!

Car left 1 Car left 2 Car left 3 Car left 4 Car right 1 Car right 2 Car right 3
Windmill Windmill Windmill