Build a Multi-platform Chatbot with Botkit
Tags: Chatbots, Slackbot, Microsoft Teams, Botkit, Nodejs

You may have used Botkit to build chatbots for any of the supported platforms, such as Slack or Teams. It is also possible to target more than one platform simultaneously.

Botkit provides templates and documentation for setting up a application on each of its supported platforms. We will show how to setup a Botkit app that will support both Slack and Teams at the same time. It will also work with additional or other platforms of your choice.

Single Platform Botkit Application

First start off with a Botkit application for a single platform. Here we will use a minimal Slack Application which we have created before. This is a simplified form of the default application created when using the Yeoman template provided by Botkit and selecting Slack platform, with only minimal functionalities kept.

More details on Botkit or creating a Slack application can be found in this post where I created a Slack application using Botkit (which also runs on AWS Lambda).

Create Bot for Second Platform (Teams)

You can create the bot for your target platform and skip this section if you are not targeting Teams.

To create a Teams Bot, we need to use the MS Bot Framework. We can follow the steps provided by Botkit at https://botkit.ai/docs/v4/provisioning/teams.html to set up a teams bot.

An App ID and Password needs to be obtained and App ID needs to be added to the bot configuration. The Messaging endpoint will be configured later.

MS Bot Framework Bot Configuration

Register a new app when you click on “Create Microsoft App ID and password”.

The App password can be generated as a client secret.

Save both the Bot and App created. Now when you navigate to the newly created bot, there is an option to test the bot on the top right. This will be sufficient for testing purposes. You can continue following the instructions provided by Botkit to install the bot into teams later.

Multi-platform Botkit Application

We can first rename the environment variables which were previously used for Slack, and add the additional variables necessary for a teams bot. You can use any preferred Webhook URI.

# Slack Config

SLACK_WEBHOOK_URI=/api/slack/events

SLACK_CLIENT_SIGNING_SECRET=

SLACK_BOT_TOKEN= # Teams config

TEAMS_WEBHOOK_URI=/api/teams/messages

TEAMS_APP_ID=

TEAMS_APP_PASSWORD=

Create an Express server which will be used by both the Slack and Teams Botkit Controllers.

// Create an express server with json and urlencoded body parsing

const webserver = express();

webserver.use((req, res, next) => {

req.rawBody = '';

req.on('data', function (chunk) {

req.rawBody += chunk;

});

next();

});

webserver.use(bodyParser.json());

webserver.use(bodyParser.urlencoded({ extended: true }));

Setup the Slack Controller, using the webserver previously created.

// Adaptor for Slack

const slackAdaptor = new SlackAdapter({

// REMOVE THIS OPTION AFTER YOU HAVE CONFIGURED YOUR APP!

enable_incomplete: true,

// The following options are sufficient for a single team application

// parameters used to secure webhook endpoint

verificationToken: process.env.SLACK_VERIFICATION_TOKEN,

clientSigningSecret: process.env.SLACK_CLIENT_SIGNING_SECRET,

// auth token for a single-team app

botToken: process.env.SLACK_BOT_TOKEN

}); // Use SlackEventMiddleware to emit events that match their original Slack event types.

slackAdaptor.use(new SlackEventMiddleware()); // Controller for Slack

const slackController = new Botkit({

webhook_uri: process.env.SLACK_WEBHOOK_URI,

adapter: slackAdaptor,

webserver: webserver

});

Setup the controller for teams, also using the webserver previously created. The default Botkit adaptor supports Botframework, thus there is no need to use an adaptor for Teams.

// Controller for Teams

const teamsController = new Botkit({

webhook_uri: process.env.TEAMS_WEBHOOK_URI,

adapterConfig: {

appId: process.env.TEAMS_APP_ID,

appPassword: process.env.TEAMS_APP_PASSWORD,

},

webserver: webserver

});

Create the folders feature/common , features/slack , features/teams for features for both or each platform. You can now start creating common features for both platforms or separately for each platform.

// load developer-created local custom feature modules.

// Load common features for slack and teams

slackController.loadModules(__dirname + '/features/common');

teamsController.loadModules(__dirname + '/features/common');

// Load platform specific features seperately

slackController.loadModules(__dirname + '/features/slack');

teamsController.loadModules(__dirname + '/features/teams')

Here is the full script which we now have.

Start the script and you have an application with two endpoint URIs which can be used by both Slack and Teams.

Slack Webhook endpoint online: http://127.0.0.1:3000/api/slack/events

Teams Webhook endpoint online: http://127.0.0.1:3000/api/teams/messages

Development and Testing with Ngrok

You can test your features locally using ngrok. Start the local server and run the ngrok service with ngrok http 3000 after installing it.

The URL provided by ngrok can be used to setup the necessary request URLs in both Slack and Botframework.

You can now test your features on both platforms.

Testing in Botframework

If you are considering to deploy your Botkit application on AWS Lambda, do check out my other post.