Comm100’s Chatbot allows your customers to interact with a Chatbot to receive information about products or services quickly and efficiently. 

However, you may need to extend the capabilities of our Chatbot by connecting it to your own database for more personalized and dedicated service.

Now, with the latest update, our Chatbot can send data to your own web application using a “Webhook”. A Webhook is a custom web callback query used to provide real-time information.

To set up these new personalized questions, you can supply Chatbot with a URL of the web application to receive the Webhook data and return the relevant information to our Chatbot service.

Step by Step Instructions

1. Log in to your Comm100 account.
2. From the left navigation menu, go to Bot > Chatbot.
3. Select a Chatbot from the drop-down list and go to Custom Answers.
4. Click Intents. 
5. Click New Intent or edit an existing Intent.
   Here, we choose to edit an existing Intent.
   
   The Edit Intent page appears.
6. Drag the Trigger a webhook action card to the flow builder area.
   
   
7. Finally, select the POST method and enter the URL for your web application to receive chat data.
   

Webhook Settings

You can click the Show all settings link on the Trigger a webhook card to further customize the webhook settings.  The Webhook drawer appears where you can do the following:

1. Edit POST or GET method of webhook URL.
2. Turn on the Authorization Required toggle and select the authorization credential. 
3. Add webhook header.
4. Add Additional Post Body JSON. In case you want to exclude the default pre-defined data in webhook body, turn on the Exclude predefined data in body toggle key.
5. Add variable to save the webhook response.
6. Input response code to action.
7. Click OK.

Data Sent to Your Web Application

Through the designated URL, your web application will receive the variables and their values from the chat sessions. The data that will be passed to your web application will include the “Fields” in the Pre-chat Window, Custom Variables, Variable of Visitors, Last Message from Visitors, and Matched Intents.

Your web application will then process the received data, generate and send us the result.

Below is an example of the data in JSON format that will be sent to your server:
  {
    "Visitor":{
        "browser":"Google Chrome 29.0.1547.76",
        "chats":2,
        "city":"Vancouver",
        "company":"Comm100",
        "country":"Canada",
        "current_browsing":"https://www.comm100.com/",
        "custom_fields":[
            {
            "field_id":5000001,
            "name":"order_id",
            "value":"1780064"
            },
            {
            "field_id":5000002,
            "name":"bill_amount",
            "value":"500.00"
            }
        ],
        "custom_variables":[
            {
            "name":"user_login",
            "value":"facebook"
            },
            {
            "name":"have_sales",
            "value":"yes"
            }
        ],
        "department":"livechat",
        "email":"allon@comm100.com",
        "first_visit_time":"/Date(13584868423)/",
        "id":1024768,
        "ip":"192.168.8.1",
        "keywords":"comm100",
        "landing_page":"https://www.comm100.com/livechat/",
        "language":"en_us",
        "name":"allon",
        "operating_system":"Windows 7",
        "page_views":3,
        "phone":"12983782710",
        "product_service":"livechat",
        "referrer_url":"http://www.google.com/q=comm100",
        "screen_resolution":"1440*900",
        "search_engine":"Google",
        "state":"British Columbia",
        "status":1,
        "time_zone":"UTC-08:00",
        "visit_time":"/Date(13584868542)/",
        "visits":5,
        "ssoId": ""
    },
    "FormValues": [
        {
            "label": "account",
            "value": "sam"
        },
        {
            "label": "password",
            "value": "1234"
        }
    ]
  }

Properties Explained

Visitor Status Description

Data Received from Your Server and Chatbot Answers

We accept the data returned in JSON format. Here are examples of how the data is formatted and what Chatbot answers back with:

Customer Requests Text

{
 "messages": [
   {"text": "Welcome to Comm100!"},
   {"text": "How can I help you?"}
 ]
}

Chatbot will send text message as an answer to your customers in the Chat Window.

Customer Requests Image

{
  "messages": [
    {
      "attachment": {
        "type": "image",
        "payload": {
          "url": "https://petersapparel.parseapp.com/img/item101-Comm100_logo.png"
        }
      }
    }
  ]
}

Chatbot will show the preview of the image directly in the Chat Window.

Customer Requests File

{
  "messages": [
    {
      "attachment": {
        "type": "file",
        "payload": {
          "url": "https://testing.comm100.com/Comm100-Live-Chat-Feature- List.pdf"
        }
      }
    }
  ]
}

When your server returns a file attachment, Chatbot will provide a link for your visitors to download.