2020-11-04

Easiio web chat with Amazon Lex Bot

The chatbot is a hot topic these days as AI technology becomes better and better. According to reports, over 80 percent of businesses are considering implementing a chatbot on their website in the near future. A chatbot can reduce the human support and sales work by moving repetitive tasks to be completed by machine, in this case, the AI chatbot. In the future, the mixture of AI chatbots with human customer service and sales will be adopted to reduce support costs and improve customer satisfaction. With a chatbot, companies can support customers 24/7 and 365 days a year without significantly increasing the cost.

Many great bot frameworks available such as Amazon Lex, Microsoft Azure AI LUIS, Google DialogFlow, IBM Watson, etc. In this blog, we will show how to use these BOT framework to build a chatbot using Amazon Lex as an example.

Amazon Lex is a service for building conversational interfaces into any application using voice and text. Amazon Lex provides the advanced deep learning functionalities of automatic speech recognition (ASR) for converting speech to text, and natural language understanding (NLU) to recognize the intent of the text, to enable you to build applications with highly engaging user experiences and lifelike conversational interactions.

Easiio Webchat and Chatbot Integration

Easiio provides a cloud call center and website chatbot and live chat service. For the website chatbot and live chat interface. It provides a very flexible application framework for integration with any third-party application using API. For example, it can integrate with CRM, customer support software, and practically any service that provides API access, including the chatbot API such as Amazon Lex.

Amazon Lex chatbot integration data flow diagram.

Now, let's get start with the implementation of the Amazon Lex bot with Easiio web chat.

In this blog, we just follow the Amazon Lex customer service workshop example in the GitHub repository. This GitHub example demonstrates the use of the Amazon Lex customer service example configuration with either Twilio SMS integration or Amazon's own Amazon Connect. There are four steps in the sample from GitHub.

We will follow the first two steps to create the Amazon Lex customer service bot. After that, we will use a little different two steps to complete the connecting with the Easiio website chatbot.

1. Setup Amazon Lex example

In this step, we complete the first step of chatbot in Lex and enable it to answer customer's questions about the purchasing of an international phone plan while traveling. For details of the instruction, please see the link on GitHub.

Follow the GitHub example, Module 1: Build a chatbot in Amazon Lex and handle informational queries. In this module, we prepare the resource for the Lex Bot. Then, create the Lex bot. Following by creating the first intent. Configure the slots, the parameters you can define to capture inputs from your customer. Finally, configure sample utterances. See the image of the Amazon Lex configuration interface.

Setup Amazon Lex example and resource.

2. Configure the handling details

Follow the step of the sample Module 2: Handle customer requests to subscribe to services.

In this module you will build on the Lex chatbot you started in module 1 and add abilities for it to subscribe users to additional services your company offers -- in this case, international plans you can add on to your existing phone plan for travel.

Follow the instructions from Module 2. It has four steps to complete setup this Travel Phone Plan Bot.

  • Add intent to apply international plans to the user's account
  • Add intent to verify user identity
  • Configure fulfillment for adding international plans
  • Test full flow
Add the intent to handle user request in Amazon Lex

At the completion of this step, we are able to test the configuration using the chat testing tool inside the Amazon Lex portal to make sure the Bot is working correctly.

3. Create the API interface to the bot

From the step 3, we do a little different from the sample which showing integration to Twilio. Instead, we create a HTTP base JSON API for us to talk to the bot.

We follow the instruction of this amazon blog on the integration of Lex with any bot service. Using AWS API Gateway to create an HTTPS endpoint. By doing these steps, we are exposing the Lex bot to the external applications via Amazon API gateway. Applications can call these API's via curl command line or HTTP calls from applications.

First, we create a Lambda function to handle the API call and return the correct message format for Easiio website chat. Please see the code example below.

var AWS = require('aws-sdk');

exports.handler = (event, context, callback) => {
	try {
	
		var time;
		console.log("event: " + event.body);
		if (event.body) {

        var	body = JSON.parse(event.body); 
            console.log("phone: " + body.phone);
    	}
		
		//	************************
		//	validate and filter bad/empty messages
		//	************************
		if(body == null){
			var error = new Error("Cannot process message without a Body.");
			callback(error);
		} 
		****************************************************************/
		else {
		
			//	************************
			//	Message is valid so now we prepare to pass it along to the Lex API.
			//	************************
			AWS.config.region = 'us-east-1';
			var lexruntime = new AWS.LexRuntime();
			var userNumber = body.uuid;
			var message = body.text;
			var params = {
			  botAlias: process.env.BOT_ALIAS,
			  botName: process.env.BOT_NAME,
			  inputText:message,
			  userId: userNumber,
			  sessionAttributes: {
			  }
			};
			lexruntime.postText(params, function(err, data) {
			  if (err) {
					console.log(err, err.stack); // an error occurred
			  		var responseMessage = '[ { "id": 1, "action": "play", "text": "Sorry, lex bot ran into a problem at our end." }]';
		      		callback(err, responseMessage);
				} else {
					console.log(data);           // got something back from Amazon Lex
					var responseMessage = '[ { "id": 1, "action": "play", "text": "' + data.message + '" }]';
	        		callback(null, responseMessage);
				}
			});
		}
	} catch(e) {
		console.log(e);
		callback(e);
	}
};

Then, we configure the API gateway with an interface point to the Lambda function we created above. See the image for the detailed configuration.

Configure the Amazon API gateway to point to the correct Lambda function

We can test the gateway via the curl command like example below. Please replace the "xxxxxxx" with the actual url from your configuration portal.

curl -v -X POST \
  'https://xxxxxxxxxxx.execute-api.us-east-1.amazonaws.com/test/LexTwilioIntegration' \
  -H 'content-type: application/json' \
  -H 'day: Thursday' \
  -d '{"uuid": "9255488396", "text": "I am traveling to Japan"}'

It should return something like following, which means the Bot is talking through the API gateway correctly.

.......
* Connection #0 to host xxxxxxxxxx.execute-api.us-east-1.amazonaws.com left intact
[ { "id": 1, "action": "play", "text": "We have 2 plans for China. Basic is $10 with 20 GB data, 100 call minutes, 100 texts. Premium is $60 with unlimited data, call and text. Which plan would you like to add?" }

4. Connect Easiio ITR to the Amazon Lex bot.

Last step, we need to use the API gateway exposed API to allow Easiio ITR bot API to interact with Amazon Lex bot. To use Easiio website chat plugin for Amazon Lex Bot integration.

First, you need to signup an Easiio account, which is free for the website chat feature. Please use the signup link to signup.

Second, configure a Visual ITR using the Advanced Configuration->Visual IVR menu to create a new ITR (Interactive Text Response). See the ITR instruction for how to create ITR. We use the ITR already created and add a Curl (HTTP API call) element. Curl is an API call to an external HTTPS API, the response from the API will be play directly to the chat windows as a response by the Lex Bot.

Create the Curl element inside the ITR editor.

Make sure to configure the Curl command to have the correct URL point to Amazon API gateway, we created in the last session. Also, the set the mode to Repeat for the Curl element. Repeat means it will repeatedly call the Curl until exit the bot session. See follow picture for details of the configuration.

Configure the Curl to use Amazon Lex Bot exposed by the Amazon API gateway.

After configuring the chatbot, we can test it through the Easiio testing demo site https://www.easiio.com/demo. See the testing result below.

Chatbot testing UI on Easiio demo website

Click the "Amazon Chat Bot" menu, then start by texting "What is the plan available?". See the chat flow below. It works as expect and similar to the results as using the curl command line.

Chatbot chat flow through Amazon API gateway and Easiio webchat interface

Conclusion:

In this blog, we show how to integrate Amazon Lex Bot with Easiio website chatbot/live chat plugin. It works nicely with relatively easy configuration steps. If you already have the Amazon Lex bot configured, it is very easy to use Easiio website chatbot/live chat platform to allow your website visitor to use the Amazon Lex bot. That means you can build one chatbot and use it with your website, Twilio SMS, Amazon phone interface, and many different channels. Easiio website chatbot and live chat also support live chat with agents with many distribution algorithms and many advanced contact center features. Signup for free and experience the power of the Easiio website chatbot/live chat tool and make your website customer service and sales a very successful operation.

Easiio also provides powerful call center software and business phone systems. Please check the website and signup.