DEV Community

Kathryn DiPippo
Kathryn DiPippo

Posted on

Using Slack for phone two-factor-authentication with help from Twilio

For several months at my position, I worked with an online platform that solely utilized text messages for two-factor authentication (otherwise abbreviated 2FA). Security is vital, but security can also be increasingly annoying when the website forces logouts every 15 minutes or you frequently change location around the office and prefer to leave your phone locked in your desk.

The intent of this workaround is not to reduce security but to make it more personally convenient and discourage disabling the security entirely. I may not have my phone on me, but I'm definitely with my work laptop with Slack open.

The High-Level Pipeline

This procedure assumes two things:

  • The platform you want to use this procedure against allows for simple phone number TFA. You would receive a text message with a number or random character string code that you would type into the verification entry.
  • The platform allows Twilio-type numbers. This is not the case with every platform that uses phone number 2FA! Your mileage may vary.

The high-level steps that will be broken down in this walkthrough:

  1. Obtain a Twilio phone number
  2. Create webhook listener in Slack
  3. Create phone webhook in Twilio
  4. Update your 2FA phone number on the web platform with the Twilio phone number

We will be updating the 2FA phone number with the Twilio number last - in the event the platform requires a confirmation text message immediately upon changing. However, it may be useful to perform this step earlier in case there is a restriction against programmable Twilio-based phone numbers are mentioned in the earlier bullet points.

Obtain a Twilio Phone Number

Twilio is a cloud communications platform as a service (CPaaS) that allows software developers to programmatically make and receive phone calls, send and receive text messages, and perform other communication functions using its web service APIs. We will be using it as the pipeline connecting your platform to Slack.

When you create a Twilio account, you'll be given a single Twilio phone number with a limited amount of trial usage. However, despite how frequently I was logging into the platform I set this up for, it took over a year for the base free trial limits to be utilized - and after that, a single $15 payment has lasted far beyond that.

Additional phone numbers on this account may require additional purchases.

By the end of this step, you will now have a Twilio phone number complete with an area code. Copy this for later.

Create webhook listener in Slack

Navigate back to your Slack instance. Please check out Slack's walkthrough for setting up an incoming webhook before continuing. The page will guide you with how to make a Slack App and the permissions necessary. I recommend setting the webhook's destination to your own private DMs as opposed to a channel.

By the end of this step, you will now also have a Slack webhook URL formatted similarly to https://hooks.slack.com/services/???/???/???. Copy this for later.

Create phone webhook in Twilio Studio

Twilio Studio is a visual editor for building communications workflows. We will be using this as the brain to take messages sent to our Twilio phone number to a webhook. This step is performed before you change your phone number in the event the platform will send a confirmation text after applying the switch.

  • While logged into the Twilio platform, navigate to https://www.twilio.com/console/studio/dashboard. You can also navigate to Studio by selecting the icon with 3 dots on the left menu and select "Studio" that appears under the "Runtime" subheading.
  • Under "Recent Flows" select the button to "Create new flow".
  • For "Flow Name", I named my own flow "SMS Notification", but feel free to name it something with greater identification for its purpose. Select "Next".
  • Scroll down in the available templates to the option "Import from JSON". Select this box and then select "Next".
  • Copy the below JSON snippet into the text box that appears on this screen. Before continuing, change the value on line 45 for the webhook url from the placeholder I've put to the URL you generated as part of the second step.


{
  "description": "A New Flow",
  "states": [
    {
      "name": "Trigger",
      "type": "trigger",
      "transitions": [
        {
          "next": "post_to_slack",
          "event": "incomingMessage"
        },
        {
          "event": "incomingCall"
        },
        {
          "event": "incomingRequest"
        }
      ],
      "properties": {
        "offset": {
          "x": 0,
          "y": 0
        }
      }
    },
    {
      "name": "post_to_slack",
      "type": "make-http-request",
      "transitions": [
        {
          "event": "success"
        },
        {
          "event": "failed"
        }
      ],
      "properties": {
        "offset": {
          "x": 50,
          "y": 150
        },
        "method": "POST",
        "content_type": "application/json;charset=utf-8",
        "body": "{\"text\": \"{{trigger.message.Body}}\"}",
        "url": "https://hooks.slack.com/services/???/???/???"
      }
    }
  ],
  "initial_state": "Trigger",
  "flags": {
    "allow_concurrent_calls": true
  }
}


Enter fullscreen mode Exit fullscreen mode

Clicking next will create the below end result:
Screen Shot 2021-05-07 at 1.37.31 PM

This studio flow is its own webhook to listen for SMS triggers and forward the message to a Slack webhook. To connect this implementation to your phone number:

  • Go back to the left menu and select "Phone Numbers" under the "Super Network" subheading.
  • Click on the phone number you are going to use for this Platform -> Twilio -> Slack pipeline.
  • Scroll to the bottom of the "Configure" page to the "Messaging " section.
    • "Configure With" should be set to "Webhooks, TwiML Bins, Functions, Studio, or Proxy"
    • Change the "A Message Comes In" dropdown to "Studio Flow"
    • Change the dropdown directly to the right to the name of the studio flow you created just earlier.
    • Select "Save" at the bottom of the page.

You have now finished setting up Twilio for this phone number to trigger a Twilio-facing webhook to fire off a Slack webhook.

Update your 2FA phone number on the web platform with the Twilio phone number

Last but not least, update the platform with your new phone number. You should now be seeing a Slack message pop in every time you need to perform 2FA and enter an SMS code.

Screen Shot 2021-05-07 at 2.10.42 PM

Hope this tutorial was helpful! Feel free to comment with any questions or updates to this procedure.

Top comments (0)