Setting Up Twilio Web Chat Client

This section goes through setting up a sample web chat client with Twilio. This is meant to serve as an example and is not an out of the box production ready client.

Web chat from the Agent Dashboard depends on the configuration of a web-based chat service. The following steps describe how to configure a sample chat client to integrate with Twilio and enable web chat for the agent. These steps are not meant to set up a production-ready chat client, but rather just to set up an example using a sample demo client from Twilio.

Appian Objects Used for Web Chat

The following are important Appian objects used for web chat.

  • "ICC_WS_TWIL_chatEndpoint" object is a Web API used as the callback URL.
  • "Create Chat Channel" is a process model which runs when the Web API is called. This process model creates a “Channel” in the Twilio console and sends an automated reply back to the initiating user.

Twilio Console Setup

  1. Navigate to the Twilio Programmable Chat Dashboard.
  2. Navigate to your “Appian Chat Service” under "Chat Services"
    • Select "Webhooks" from the left panel
    • Scroll down to “Post-Event Webhooks"
    • Add the Callback URL specific to your ICC app (https://serviceaccountusername:serviceaccountpassword@<Your-Appian-URL>/suite/webapi/chat)
      • Note: Confirm your service account has access to the Web API object in Appian.
    • Set it as HTTP POST
    • Check the box titled onChannelAdded

Configure Sample Chat Client

Twilio provides an easy to use basic chat client that you can use to test your configuration. Download Twilio's demo chat client to get started. Follow the associated readme file which will direct you on how to add in the correct credentials.

  1. Check to see if you have node.js installed by running npm install in Git Bash (Windows) or your terminal window (Linux/Mac)
  2. Run ‘npm start’ in your terminal window
  3. Open the Agent Dashboard on a browser tab and set your agent status to "Chat"
  4. On a separate browser tab, navigate to localhost:8080
  5. Start a conversation in your chat client
  6. You should see a chat conversation start in your Agent Dashboard. If the conversation does not start, please troubleshoot through the Twilio Console
Open in Github Built: Fri, Jun 03, 2022 (01:08:29 PM)

On This Page

FEEDBACK