Custom Slack Integrations With ASP.Net Web API

Slack is one of the internet’s golden children right now. If you are not familiar with it, Slack is a platform for facilitating communication and collaboration amongst your teams. Aside from just chat, Slack allows for file uploading and sharing as well as integrations with many popular services such as Dropbox, GitHub, IFTTT, JIRA, Twitter and many, many others.

For example, if your team uses GitHub for source control and issue tracking, you could configure the GitHub integration to post to a Slack channel whenever there is activity on an issue.

That’s great, but what if your team has some custom data store or service that you would like to integrate with Slack? Maybe a timesheet app you would like to query from Slack by typing in “/timesheet John Smith” to find out how many hours John has clocked this week? Well Slack actually makes it fairly easy to do this.

Slack offers an integration called “Slash Commands”. This integration can be configured to send data to a URL that you specify such as an ASP.Net MVC Web API. Your service can then return data to Slack either as a response to the user that initiated the request or as a post to the entire channel.

For this example, we are going to create a slash command that will return a random YouTube video for a specified search term. The syntax for using this command will be:

/youtube [searchTerm]

The first step is to setup the command in Slack. You will be asked to enter the command. In this case enter “/youtube”. Then enter your service URL, and select the method for Slack to send data to your service – either GET or POST.

capture

 

Slack also generates a Token for your new command. This token will be sent with all requests so you can use it to validate that requests coming into your service were actually generated from your command.

Optionally you can also provide autocomplete help text and a descriptive label.

capture

Once you are happy with everything, click the “Save Integration” button.

As I mentioned in the title, we are going to send our Slack command to an ASP.Net Web API controller. So… let’s open up Visual Studio and create a new Web API project. Right-click on the Controllers folder and add a new Web API controller matching the name you specified when you setup the slash command.

When your command is invoked, Slack will hit your service URL with the following parameters:

token
team_id
channel_id
channel_name
user_id
username
command
text

So depending on the template you selected, either create or edit the Get method in your API controller to accept those parameters:

capture

The last two parameters, command and text, tell us the slash command the user specified in Slack as well as the text they entered along with it.

The body of our control method is very straightforward:

capture

We are using a switch statement so we can easily handle additional commands from the same controller method. I’m then using my own YouTube library to do a search with the text parameter passed into the method and then selecting a random video.

If our Slash Command only needed to return the video URL as a message back to the user that initiated the command, our API method would just return the URL as text. In this case, however, we want to actually post the URL back to the Slack room. This requires us to setup an additional Slack integration called a WebHook. When you setup your WebHook, you will receive a custom URL. You will use this URL to post a JSON string with the data we are sending back to Slack. At a minimum this is just some text. Optionally we can (and will in this example) specify a username, icon, and the channel to send the post to.

The format for this JSON looks like this:

capture

The most important thing to note is that if you include a URL in your text response, you must enclose it in <>.

After you post this data back to your WebHook URL, you should see something like this show up in your Slack channel:

capture

Advertisements

About Andrew Long

Web developer, Windows Phone developer: http://bit.ly/andrewlongWP, IBM Bluemix Evangelist: http://bit.ly/bluemixtrial
This entry was posted in ASP.Net, Computers and Internet and tagged , , , . Bookmark the permalink.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s