Image Recognition In WhatsApp Chatbot - Using Twilio & Azure Function App

This article is the final article in the 3-part series for Image Recognition in WhatsApp Chatbot. The first article, LUIS – Create a Conversation App discussed more on creating a service in Azure for LUIS. The second article Image Recognition in WhatsApp Chatbot - Using Azure AI continued on to create models and Image Recognition service on Visual Studio. This last article focuses on using Twilio and Azure function app to develop the WhatsApp Chatbot.  

Twilio 

Twilio offers the service of cloud communication platform (CPaaS) to enable developers to make and receive phone calls programmatically, send and receive messages in text format as well as perform numerous other communication functionalities through web service APIs. Applications can be built and integrated with Twilio through various SDKs and APIs from various languages such as C#/.NET, PHP, Ruby, Python, Apex, and Java.  

Integration Features provided by Twilio include Text Messages, Voice Messages, Video Calls, WhatsApp Messages, and many more. Developers can integrate their applications with features provided by Twilio easily and reliably.  

Twilio API for WhatsApp 

The Twilio API allows access to the WhatsApp Business API which is extremely simple to use and implement. Developers can conveniently test and design their apps in a sandbox environment. Howsoever, this is currently in Preview version but is available on different platforms and support numerous programming languages. One can access the Twilio API for WhatsApp from this link.  

Let us learn to setup our Twilio to connect to WhatsApp Bot.  

Step 1 

First of all, we need to access the Twilio Dashboard and Select WhatsApp which is currently in Beta state.  

Step 2 

Next, we activate our Sandbox.  

Step 3 

Now, we are inside the Twilio Console.  

Here, to connect to the sandbox, we need to send specific WhatsApp message from our device to the specific number assigned.  

Step 4 

Once, that is done, our Twilio WhatsApp is connected.  

Now, Click on Next until you reach the Sandbox Configuration.  

Step 5 

Add Twilio package to our application – Microsoft.Azure.WebJobs.Extensions.Twilio 

Step 6 

Now, we write our code to Receive Message ReceiveMessage.cs where we compose our process of receiving messages from the Twilio app depending upon which service we need to use ie. LUIS app in case of Text message for Weather bot and Image Recognition Service in case of image being uploaded.  

Source: Luis Beltran

The Twilio message is received through TwilioService.cs and is obtained via the GetTwilioMessage call.  

Step 7 

Next, we compose or reply to the user through the return value in HttpResponseMessage.  

Source: Luis Beltran

Step 8  

This solution is an Azure Function Project hence we publish it as Azure Functions App. But first, let us get a brief insight about Azure Functions.   

To learn more about WhatsApp Bot Creation using LUIS, Computer Vision with Twilio, watch this video.  

Azure Functions 

Azure Functions is the popular serverless compute platform on Microsoft Azure, supporting rapid integration with the Microsoft suite of products. Azure Functions is an event-driven serverless compute platform which enables complex orchestration difficulties to be solved easily. Using Triggers and Bindings, services can be integrated. Applications can be deployed and scaled flawlessly in the cloud with Azure functions. Depending on the workload volume, the infrastructure scales automatically. Building, debugging, deploying, and monitoring are all possible with ease with the built-in DevOps capabilities supported by the Azure Functions. It supports multiple programming languages from C#, Python, Java, or Node.js. With the use of Azure Functions, it can drastically minimize the time to solve problems compared to traditional approaches thus saving the time of developers and duration to provide service to the clients. 

Triggers  

Triggers on Azure Functions are the cause for a function to execute. The trigger specifies the process function is invoked and a function can only contain one trigger.  

Binding 

Binding plays a role in providing data to function as parameters. It can connect in multiple ways such as input binding, output bindings, and even both. Binding simply declares the process of connecting resources to function.  

To learn more about Azure Functions, you can read it in Azure Serverless.  

Here using the power of Serverless Computing, we can setup the HTTP trigger or timer trigger in a way such that, every hour or weekly some code will execute. The possibilities are literally endless. In a JSON file we setup the image, type of the trigger, path, connection, and direction of the message flow. In the blobTrigger, we setup the incoming image and the outgoing message will be processed via Blob.  

Henceforth, we publish it using the Azure Service as Azure Function App for Windows.  

Step 9 

Now, as we have published it, we’ll get a URL in Azure. Let us click, the resource ImageBot.  

Let us select Functions, and we will see the receive message function here.  

Step 10 

Next, we select Code + Test.  

We’ll then obtain the function URL.  

This, URL is what we’ll use in Twilio.  

Step 11 

Now let us check out Twilio Sandbox. Here, we can see our azure function web hook within the Sandbox configuration in Twilio for WhatsApp.  

Next, in the Message incoming HTTP Post, we paste the function URL we obtained from Azure.  

Finally, we are all set to go. 

Step 12 

We can now test in our Twilio WhatsApp Sandbox Bot.  

If we send a message, such as “What is the weather in Zlin”, we’ll obtain the current weather which is Cloudy with real time temperature.  

Next, let's send an image of a cat. 

We can see, we obtained Tags such as Mammal, Animal, Cat, Domestic Cat with Confidence values. Numerous other parameters were also obtained that we had setup in our service. Moreover, we can see the Faces, Celebrities, and Landmarks values are null as there would be no logical confidence for those segments.   

Conclusion

Thus, in this article, we learned how to connect Twilio, WhatsApp and use the Azure Functions to setup the WhatsApp Bot. This concludes our final goal of creating a WhatsApp bot for Image Recognition. Moreover, we also included LUIS in our app on top of Computer Vision. We showcased how we received confidence values with the object detected and recognition performed through a simple message posted via WhatsApp. This application has huge use cases for numerous businesses out there that can automate this process of having to message and reply to simple tedious questionnaires.  When a User posts a message, it comes to Twilio and it calls the Azure Functions as it is connected and in Azure Functions, we have made the decision to call for LUIS for text messages and in the case of Image, we use the Computer Vision service. After processing, message is sent to Twilio and then back to the User. This is how a WhatsApp Bot can be made for Image Recognition enabled with LUIS service and Computer Vision.