Search code examples
twiliotwilio-studiotwilio-conversations

Twilio conversation with chatbot


I want to know how to use twilio conversation api with autopilot chatbot. So users start to chat with bot and after answering some questions of bot, the users are hand off to real agent and continue to chat with them. I've already made the conversation using twilio conversation api and chatbot using autopilot. Now I want to know how to integrate them.


Solution

  • Twilio developer evangelist here.

    Twilio Autopilot doesn't have conversations as a supported channel, only programmable chat. For most of these uses cases, I would suggest using Autopilot + Studio + Flex--then you can build just about anything!

    The following workaround is from Twilio Supportability Engineer Adam Taylor:

    1. To create an Autopilot Studio Flow once the Autopilot session ends (i.e. a task is hit without a listen), you can handoff to another widget. You can add a "sendToAgent" indicator in Autopilot's Memory and then use the "Split Based On" widget to check for this indicator, only handing off when appropriate.Studio flow Then an example Autopilot Goodbye Task might look like
    {
        "actions": [
            {
                "say": "Great. Please reach out again if you have any questions. I'm sending you to an agent to finish up."
            },
            {
                "remember": {
                    "sendToAgent": true
                }
            }
        ]
    }
    
    1. Find your Studio flow SID in the Studio console Studio Console
    2. To use Conversations, make sure you have an updated version of Twilio for your Functions! Twilio version in Functions
    3. Then your Function's JS code might look something like
    exports.handler = function(context, event, callback) {
      const client = context.getTwilioClient();
      const conversationSid = event.ConversationSid;
     
      client.conversations
        .conversations(conversationSid)
        .webhooks.create({
          "configuration.flowSid": "FWxxxxxxxxxxxxxxxx", //update your flow sid here
          "configuration.replayAfter": 0,
          target: "studio"
        })
        .then(webhook => {
          let responseObject = { "conversationSid": conversationSid, "webhookSid": webhook.sid };
          callback(null, responseObject);
        })
        .catch(err => {
          callback(error);
        });
    };
    
    1. Paste that Function URL here to configure Conversations Webhook as the Post-Event URL for Conversations. Select "onConversationAdded" as the Post-Webhook that this url will receive. Conversations with Function URL

    2. Configure Conversations for SMS by making sure that the "Handle Inbound Messages with Conversations" Messaging Feature is enabled for your Account here. Configure Conversations

    3. Create a Messaging Service for your Autopilot Studio Flow here to associate the phone number for your Autopilot bot to this messaging service. Associate phone number for your Autopilot bot to this messaging service.

    4. Update Integration Settings so that a new conversation is created when a message arrives at this phone number Integration settings so a new conversation is created when a message arrives at this phone number

    5. Create a Function to remove Studio from a conversation. Make a Function that contains code like this:

    exports.handler = function(context, event, callback) {
      const client = context.getTwilioClient();
      const conversationSid = event.ConversationSid;
      const webhookSid = event.WebhookSid;
     
      client.conversations
        .conversations(conversationSid)
        .webhooks(webhookSid)
        .remove()
        .then(()=> {
          let responseObject = { "conversationSid": conversationSid, "webhookSid": webhookSid };
          callback(null, responseObject);
        })
        .catch(err => {
          callback(error);
        });
    };
    

    and another Function to add a participant to the Conversation

    exports.handler = function(context, event, callback) {
      const client = context.getTwilioClient();
      const conversationSid = event.ConversationSid;
      const handoffTo = event.HandoffTo;
       
      client.conversations
        .conversations(conversationSid)
        .participants
        .create({
           'messagingBinding.address': handoffTo, // the phone number or whatsapp address you want to handoff messaging conversation to
           'messagingBinding.proxyAddress': '+14156632326' // the phone number attached to your messaging service
         })
        .then(participant => {
          let responseObject = { "participantSid": participant.sid, "conversationSid": conversationSid };
          callback(null, responseObject);
        })
        .catch(err => {
          callback(error);
        });
    };
    

    Finally, add Studio Widgets to run these Functions and complete the Handoff. widgets together The first widget is RunFunction - removeStudioWebhook Widget 1 - RunFunction - removeStudioWebhook

    Function Parameters include ConversationSid: {{trigger.message.ConversationSid}} and WebhookSid: {{trigger.message.WebhookSid}} The second widget is RunFunction - addToConversation

    Widget 2 - RunFunction - addToConversation

    Function Parameters include ConversationSid:{{trigger.message.ConversationSid}} and WebhookSid: +15555551212 (the number you want to handoff to) The third one sends the message

    send message widget

    Widget Configuration: MessageBody: Customer {{contact.channel.address}} is connected with Agent Adam. (replace with your Agent Name) and Send Message To: +15555551213 (replace with the number you want to handoff to).

    The Conversations API description says "Basic auto-response and chatbot functionality" as some of the automated features" which means you can build your own chatbot with the help of the Conversations APIs.

    Let me know if this helps at all!