This article was cross-posted from Rightpoint’s new RPLabs blog – be sure to check it out!

In one of my previous writings, I talked about building an “API Button” that could execute a web request to our API. In my example, we called a Goal Celebration API, which triggered some smart lights and music in my basement. However, the whole point of our API Button is that it’s extremely flexible – we can use it to call any Web API. In this post, we’ll walk through how to use the API Button as a Microsoft Flow trigger.

Background

I was thinking of how can we improve API Button’s usability without adding too much extra maintenance. After all, not everyone wants to take apart their button, update LUA code, and manually re-deploy every time there’s an update to their business logic. Enter Microsoft Flow.

The idea is that I’d have my button call a lightweight Web API (hosted using the Azure Function free plan). Then, with just a little mapping and preparation, I can send the request over to my Flow. It actually ended up being a much simpler process than I expected. Start to finish, I was able to complete these steps in about 30 minutes.

Setting up our Flow

From a configuration standpoint, I think it’s actually easier to begin at the end of our workflow and work our way back to the start. First, let’s set up a new Microsoft Flow at flow.microsoft.com. If you’ve used IFTTT before, you’ll notice that Microsoft Flow is similar, with triggers and actions. To start, click My Flows and then Create from blank. This will walk us through the process of creating a new Flow.

First, we’ll be prompted to select a trigger. For our trigger, we’re going to select Request – When a HTTP request is received. This allows the Flow to be invoked by a POST request. For the action on our Flow, we can select whatever task we’d like – the whole idea here is that we can have Flow trigger anything we’d like. For testing purposes, I selected Send an email. When I was finished, my configuration looked like this.

Don’t forget to copy the HTTP POST URL from this step.  We’ll need it so that we can invoke it from our Web API.

Calling our Flow trigger via API

Next, we’re going to create a function that triggers our Flow via a POST request inside a Web API. I did this via .NET hosted in an Azure Function, however, you may implement it however it’s most convenient to you. Here’s a sample code block for my Web API Controller:

using System.Collections.Generic;
using System.Configuration;
using System.Net.Http;
using System.Threading.Tasks;
using System.Web.Http;

namespace ButtonPressFlowAPI.Controllers
{
    [RoutePrefix("api")]
    public class ButtonPressFlowApiController : ApiController
    {
        private readonly string _flowApiAddress = ConfigurationManager.AppSettings["FlowApiAddress"];

        [HttpGet]
        [Route("flow/{ip}")]
        public async Task<HttpResponseMessage> CallFlowApi(string ip)
        {
            var message = $"The API was triggered from IP Address {ip}";
            var values = new Dictionary<string, string>()
            {
                { "message", message }
            };

            var client = new HttpClient();

            var result = await client.PostAsJsonAsync(_flowApiAddress, values);
            return result;
        }
    }
}

Now that we’ve got our Web API up and running, we can test that our API is calling Flow correctly via a quick Postman test. To do so, we simply open Postman, enter our API’s URL and send a GET request. Alternatively, since we’re only performing a GET request, you could just open a new tab in your browser and enter the URL.

If everything worked properly, shortly after our API is triggered, we’ll receive an e-mail that states, “The API was triggered from IP Address 127.0.0.1”.

Configuring the button

Now that we have our API working properly, we can configure our API Button accordingly. This is simply a matter of modifying our code to use our new Azure Function URL and perform a GET request:

#include <esp8266httpclient.h>

local ssid = "Bill Wi The Science Fi"
local password = "IAmNotTellingYou"

wifi.sta.config {ssid=ssid, pwd=password}

-- Config
local button_pin = 3     --> Pin D3
local count = 0

-- init GPIO pin properly
-- some hardware might not need the "gpio.PULLUP" part, mine does
gpio.mode(button_pin, gpio.INT, gpio.PULLUP)

-- Function calls API
function callApi ()
    local ip = wifi.sta.getip()
    print(ip)
    http.get("http://azure.function.url.here/api/flow/"..ip,
        function(statusCode, data)
            if (statusCode < 0) then
                print("HTTP request failed")
            else
                print(code, data)
            end
        end)
end

-- define a callback function named "goalBtn", short for "pin callback"
function btnPress()
    print("Button Press!")
    callApi()
end

-- register a button event
-- that means, what's registered here is executed upon button event "up"
gpio.trig(button_pin, "up", btnPress)

Fun fact: My Wi-Fi password in college actually was “IAmNotTellingYou”.  Trying to explain that to friends was always an ordeal.

What else?

Now that we have our API Button configured properly, it’s simply a matter of connecting the button to the Internet (as we’ve done before), pressing the button and receiving an e-mail shortly after. Although this is meant to be a very basic example, we can easily apply these concepts to a more advanced Flow. However, since we are using Flow instead of performing tasks programmatically, our logic can be easily maintained without digging through code.

Additionally, we can leverage this model to apply to other scenarios outside of Flow.  In fact, now that our API Button is calling an Azure Function, we can modify this model to call any external service that we can reach with .NET.  For example, instead of calling Flow, we could be calling IFTTT.  Or, better yet, we can roll our own API (as we did with the Goal Celebration API), where our options are nearly limitless.  Here are a few fun ideas my colleagues and I had along the way:

• DIY Photo Booth – Press a button, call an API that’s connected to a Wi-Fi enabled camera. The camera snaps a picture and uploads it to a cloud service. You could even set up a touch screen so users can enter their e-mail address to receive a link after the upload completes.
• Find My Phone – Press a button, call an API that connects to a native app installed on your phone to play a ringtone.
• “Away Mode” – Press a button while leaving the house, and perform a series of smart home tasks, such as:
  • Set the thermostat to a conservative temperature
  • Turn off the lights
  • Turn off the speakers
  • Turn off the smart TV
  • Lock the front door
  • Remote start and warm up the car

Hopefully, this might inspire you to create your own API Button, either with Flow or a custom API, to help make life a little easier. Have some ideas or questions? Leave them in the comments below!