Skype Bot Tutorials

In this ChatFlow tutorial, we start by creating a simple Skype bot that echos your message. In addition, we will also show you how to build a more advanced Amazon Book Bot for Skype. Here is an example of the bots function:




By the end of this tutorial, you will be able to:
  • Connect a ChatFlow app to Skype.
  • Understand the Inputs and Outputs of the Skype In and Skype Out Nodes.
  • Configure an Amazon Product Advertising Node
  • Integrate a Split Node

A Simple Echo Bot

Skype Echo Bot Video Tutorial

Here is a video tutorial demonstrating how to configure an Echo Bot to Skype.




1. Create a New Bot for Skype

  1. Visit Microsoft Azure page and sign in with your Microsoft Account.
_images/azure-01-login.png
  1. Once you have logged in, click Create a resource, choose AI + Cognitive services category, click See all, choose Bot Channels Registration service and click Create.
_images/azure-02-resource.png
  1. On Bot Channels Registration form name you bot and click Create.
_images/azure-03-bot-form.png
  1. Once service is deployed, click All resources and choose your bot. Open Settings tab and click Manage next to Microsoft App ID field.
_images/azure-04-manage-creds.png
  1. In the Microsoft Application Registration portal click Create New Password.
_images/azure-05-new-password.png

You’ll see a popup with you password

_images/azure-06-password-created.png

Warning

Copy you App Password onto your clipboard. It is the only time you will be able to see it.

When finished, click Ok.

2. Create a New ChatFlow App

  1. Go to the apps page.
  2. Click on “CREATE NEW APP” button.
_images/new-app1.png
  1. Under “Start with a clean project”, enter your project’s name and click on create. To edit, click on the newly created app’s name in the App List.

    _images/create_echobot1.png
  2. In the Node Library, search for “skype” to filter skype nodes. Drag Skype In and Skype Out into the workspace and connect them.

    _images/theflow.png

    Note

    If the Skype In and Skype Out nodes are not in your Node Library, click on Settings in the right hand corner. A drop down will open. Click on Node Installer:

    _images/settings_install_node2.png

    In the Node Installer, search for Skype. Click on the blue arrow to the right of Skype to add the nodes into your palette:

    _images/addSkypeNodes.png
  3. Double click the Skype In node. Select “Add new skype-controller…” and click the “edit” button.

    _images/editCredentials.png
  4. In the App Password Section, paste in your App’s password from your clipboard.

_images/AppPassword.png
  1. In the App ID section, copy your App’s Microsoft App ID.
_images/AppID.png
  1. Copy the Message Endpoint URL onto your clipboard.
_images/MessagingEndPoint.png

3. Registering Your App

Back in the Microsoft Azure resource settings, paste the Message Endpoint URL from your clipboard to the Message Endpoint URL section and click Save.

_images/azure-09-webhook-paste.png

4. Finishing Up

  1. Double click on the Skype Out node to edit and select your newly created skype configuration.
  2. Click deploy and your Application is ready to go!
_images/deploy2.png

5. Testing

Microsoft provides great tools to test your app. We encourage you to use them.

  1. Choose Channels tab in Microsoft Azure resource settings page and click on Skype icon
_images/azure-10-channels.png
  1. In the new channel settings you can configure you skype bot. When finished, click Save and go back to channels overview.
_images/azure-11-skype-save.png
  1. Click on skype channel.
_images/azure-12-skype-try.png

In the new window click Add to Contacts

_images/azure-13-skype-addcontact.png
  1. Now, when your bot is added to contacts, open message window and send it a message. It should echo back to you.
_images/EchoDemo.png

Skype In and Out Nodes

This section of the tutorial explains the output of the Skype In node and the required formats for the Skype Out node input.

Skype In

The Skype In node receives input from Skype and outputs the following msg:

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
 msg = {
     payload: message.text,
     skype: {
         message: message
         type: "text"/"image",
         activity_type: message.type,
         user: message.from.id,
         user_name: message.from.name,
         identity: message.recipient // your bot id
         conversation: message.conversation.id,
         attachments: array (message.attachments),
         serviceUrl: message.serviceUrl
     },
     kitt: {
         _session_id: message.conversation.id,
         _user_id: message.from.id
     }
 }


                 user: message.from.id,
                 user_name: message.from.name,
                 conversation: message.conversation.id,
                 attachments: array (message.attachments)
               },
       kitt: {
               _session_id: message.conversation.id,
               _user_id: message.from.id
             }
       }
Variable Type Description
payload String Text content of the message
skype.message Object the original raw incoming message
skype.type String Refers to message type. Ususally its value is ‘message’
skype.user String the Skype User ID (determined by Skype)
skype.user_name String the User’s Skype User Name
skype.identity String Skype identity of your bot
skype.conversation String the Skype conversation ID (determined by Skype)
skype.attachments Array Array of attachments attached on the message
skype.serviceUrl Array Skype server hostname to respond incoming message
kitt Object used by the Router node for session management

Hint

For more information check out the Skype Chat Api Reference page.

Skype Out

The Skype Out node sends the message back to Skype. It expects message with the following properties:

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
 msg = {
     payload: message_text,
     skype: {
         type: message_type,
         user: user_id,
         conversation: conversation_id,
         attachments: array,
         identity: identity,
         serviceUrl: serviceUrl
     }
 }
Variable Type Description
payload String Text content of the message
skype.type String Refers to message type. Either ‘message/text’, ‘message/image’, or ‘message/card.carousel’
skype.attachments Array Array of attachments attached on the message
skype.conversation String the Skype conversation ID (determined by Skype)
skype.user String the Skype User ID (determined by Skype)
skype.identity String Skype bot identity (determined by Skype)
skype.serviceUrl String Url for response to be sent (determined by Skype)

Warning

You MUST have either skype.conversation or skype.user in order to send a message back to Skype to your user.

Note

Depending on the message type, certain components of the msg are required. Below is a table highlighting which components are required for the different message types:

Message Type Required Fields
‘text’ payload, skype.type,
‘image’ skype.type, skype.attachments
‘card.carousel’ skype.type, skype.attachments

Hint

For more information check out the Skype Chat Api Reference page.

An Advanced Bot: Amazon Books

In this section of the tutorial, we will walk you through the process of building a Skype Amazon Books Bot which will be able to look up books according to the User’s specifications.

Amazon Books Walkthrough

Here is a video walkthrough transforming a Skype Echo Bot into an Amazon Books Bot.




1. Getting Started

  1. Create a new app in ChatFlow. Click on your new app in the app list.
  2. Once the editor has loaded, drag in a Skype In, Router, Skype Out nodes. Connect them like so:
_images/Flow1.png
  1. Next, drag in an Enter Node and State Node. Connect them.
  • Set the Enter Node’s entrances condition to msg.payload matches regex hello|hi
  • Select Ignore Case
  • Set the State nodes output text to “Hello. I can search books on Amazon for you. Just name a book and I’ll search it for you”
  1. Drag in another Enter Node and State Node. Connect them.
  • Set the Enter Node’s entrance condition to msg.payload matches regex bye|see\syou
  • Select Ignore Case
  • Set the State nodes output text to “See Ya”
  • Check the Dialogue Ends here option

Your flow should now look like this:

_images/Flow2.png

2. Searching for a Book

  1. Drag in an Enter Node and State Node.
  • Set the Enter Node’s entrance condition to msg.payload matches regex ^((?!bye|see\syou|hi|hello).)*$
  • Select Ignore Case
  • Set the State Node’s output text to “OK. Searching…”
  1. Drag in a Function node. Connect it to the previous Enter Node.
  • Name it Search Books
  • Add the following code into the body function:
 1
 2
 3
 4
 5
 6
 7
 8
 9
10
var book=msg.payload;
msg.payload={
    command:"ItemSearch",
    request:{
          "SearchIndex": "Books",
          "Keywords": book,
          "ResponseGroup": "ItemAttributes,Offers"
    }}

return msg;

Note

This function will prepare our payload by formatting into a format accepted by the Amazon Product Advertizing Node.

  1. Drag in a Amazon Product Advertizing Node. Connect it to the Search Books Function node.

Note

To configure the Amazon Product Advertizing node. You must create a Amazon account here.

_images/aws-1.png

Once you have signed up, click on Manage Account.

_images/aws-2.png

Follow the instructions on the Manage Account Page to access you AWS Key and AWS Secret.

_images/aws-3.png

In addition you must become an associate to get your associates tag. For more information about becoming an associate, go to the Becoming an Associate.

Hint

If the Product Advertizing Node is not in your Node Library, install it using the node installer.

  1. To configure the Product Advertizing Node, click on edit next to “Add new AWS Credentials…”.

    _images/product-node-edit.png

    Input the following:

  • AWS ID
  • AWS Secret
  • Associate Tag
_images/add-aws.png

Hint

You can input anything in the Associate Tag field to make it work. But getting it right makes sure you get paid by Amazon correctly.

  1. Next drag in a Switch Node.
  • Name it Is item found?
  • Set the property to msg.payload.ItemSearchResponse.Items.Item.
  • Set the first rule to is null
  • Set the second rule to is not null
  1. Drag in a State Node. Connect it to the first output of the Switch Node.
  • Name it Item not found
  • Set the output text to “Nothing found. Please try again”

Your follow should look like this:

_images/Flow3.png
  1. Drag in a Function Node. Connect it to the Second Output of the Is item found? Switch Node.
  • Name it Search book images
  • Add the following code into the body function:
 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
var items = msg.payload.ItemSearchResponse.Items.Item;

var itemID = []
var newItems = [];

items.forEach(function(item){
    itemID.push(item.ASIN);
    var links=[{
        "type":"openUrl",
        "title":"Details",
        "value": item.DetailPageURL
    }];

    if(item.ItemLinks && item.ItemLinks.ItemLink){
        item.ItemLinks.ItemLink.forEach(function(link){
            if(link.Description=="Add To Wishlist" ||
                link.Description=="All Offers"){
            links.push({
                "type":"openUrl",
                "title":link.Description.replace("All Offers","Buy"),
                "value": link.URL
            });}
        })
    }

    newItems.push({
        id: item.ASIN,
        name: item.ItemAttributes.Title,
        author: item.ItemAttributes.Author ? ((typeof item.ItemAttributes.Author === 'string') ? item.ItemAttributes.Author : item.ItemAttributes.Author.join(', ')) : null,
        price: item.ItemAttributes.ListPrice ?
            item.ItemAttributes.ListPrice.FormattedPrice : null,
        buttons:links
    });
});


global.set('items',newItems)

msg.payload={
    command:"ItemLookup",
    request:{
        ItemId:itemID,
        ResponseGroup:"Images"
    }
}
return msg;
  1. Drag in a Amazon Product Advertizing Node. Connect it to the Function node.
  2. Next drag in a Switch Node.
  • Name it Are images found?
  • Set the property to msg.payload.payload.ItemLookupResponse.
  • Set the first rule to is null
  • Set the second rule to is not null
  1. Connect the first output of the Switch Node to the Item not found State node.

Your flow should look like this:

_images/Flow4.png
  1. Drag in a Function Node. Connect it to the Second Output of the Are images found? Switch Node.
  • Name it Search book images
  • Add the following code into the body function:
 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
var items = msg.payload.ItemLookupResponse.Items.Item;
var oldItems = global.get('items');

var newItems = [];
i=0;
oldItems.forEach(function(item){
    if(items[i].MediumImage)
        item.image = items[i].MediumImage.URL
    newItems.push(item);
    i++;
});

msg.payload = newItems;

var elements = [];
var messages = [];
msg.payload.forEach(function(item){
    msg.skype.type = "message/card.carousel";
    msg.skype.attachments = [{
        "contentType":"application/vnd.microsoft.card.hero",
        "content":{
            "title":item.name,
            "images": [{"url": item.image}],
            "subtitle": "by "+item.author+(item.price?(", from "+item.price):''),
            "buttons": item.buttons
        }
    }];

    msg.payload=null;

    messages.push(JSON.stringify(msg));
});

return {payload:messages.join('>>>>>')};
  1. Add a Split Node. Connect it to the Search book images Function Node. Set the split to >>>>>.

Note

A Split Node will split the payload by specified character(s).

Hint

If the Split Node is not in your Node Library, install it using the node installer.

  1. Add a State Node. Add the following code to the body of the function:
1
2
msg = JSON.parse(msg.payload);
return msg;
  1. When you are finished, click deploy!

Your final flow should look like this:

_images/FinalFlow.png

Feel free to play with the application by importing it to ChatFlow by either:

  • Downloading the json for the application and importing the project on the applications page
  • Using the “Skype - Amazon Books” sample application under “Use a Sample Project” when clicking “CREATE NEW APP” on the applications page.