Consuming an Open API and JSON in Power Apps – 101

It’s been a while since I wrote anything too technical, and I’ve had a chance during this lockdown to brush up on some stuff I haven’t really played with in Power Apps,  so  thought I would look at something a little different….. connecting and consuming an Open API, and consuming the results in a Power App. 

Before I get started, there is also a video to go with this article

 There are plenty of open API’s you could use to have a play around, but I decided to use the one from CoinGecko, which gives lots of options for real time Cryptocurrency prices. You don’t need to sign up to it, and there’s no authentication required, which makes life easier if this is your first venture.

If you navigate to the CoinGecko API site, you’ll see the complete list of options, and get a chance to test out your requests right there. For example the first, and most basic is to ping the api.

So for the example we’re going to build, let’s keep it nice and simple. A Power App that retrieves the current prices for Bitcoin in 3 currencies, then allows you to choose your preferred currency, your holding, and show your live value.

Firstly lets create the Flow that gets the data from the CoinGecko API. Go to flow.microsoft.com and log in. Once logged in, go to your flows and click New –> Instant – from blank

You’ll then get the opportunity to choose your trigger, and in this case we want to choose PowerApps, as an action in our PowerApp will call the flow and API

Once you’ve clicked create, your flow will open, and the PowerApps trigger will be shown as the first step

Before we go any further, lets just step through the process that we’re going to do. This is the finished flow

So if we break it down in to simple steps……. The Power App calls the flow. this then uses the HTTP action to call the API. The JSON results are Parsed, and the Responses captured.

This then gives us the resulting data to be consumed in the Power App.

So let’s break it down. Firstly that HTTP Step. If I open up that step this is what you’ll see

So the Method we’re going to use here is GET – because we’re getting data! Seriously though, if you want to know more about these methods, then check out this.

So the URI is where we form our request, and in this case it’s a really simple request for the Price of Bitcoin in 3 currencies – USD, GBP and EUR.

Since theres no Authentication for this API, we can easily see if this request works by posting that URI in a web browser

So the results you see there are in a JSON format. We now need to Parse them, and break them down in to their parts so we can consume and use them in a readable format.

Here we add the Parse JSON action.

So firstly you’ll see that we want to pick up the Body as Content – that’s the payload or data we are retrieving. The Schema may seem a little daunting, but there’s a neat little trick here……. “Generate from sample”

In this, we can just paste in the returned data that we got before in our test with the URL, and the flow will just generate the schema for you!

Finally we just add the Response action, and you’ll see it’s almost identical to the Parse – just with the addition of the status code of 200 which effectively means OK. This then allows the response to be consumed in your Power App

So, that should be your flow created. Don’t forget to name it and save it. Next let’s create a simple Power App and consume that data. 

Go to make.powerapps.com and create a new Canvas app from blank. The first thing we’ll do is add a button – for this simple example the button is going to call the flow which in turn calls the CoinGecko api. I’ve just renamed mine to “Update Prices” .

Now there’s a few things we want to do in order to grab those prices. In the formula box I have added the following

ClearCollect(getrates,GetCoinGecko.Run())

I’m not going to go into all the details of this but essentially we are creating a collection, calling it “getrates” and the data that feeding it is coming via the flow we previously created (Mine is named “GetCoinGecko”

If you want to check your flow is working, just check your collection

I have also added a few labels….. 3 to identify the currency, and 3 to hold the data we pull back

so far then we have a mechanism for getting the data from the API via flow, and triggered by the button. it’s being stored in the collection. We now have to show it in the label fields.

In the formula for the label for GBP I have added the following

First(getrates).bitcoin.gbp

This formula calls the first record in the collection and in this case the GBP value and displays it

• 

Repeat for the USD and EUR data, and there you have it!

Have a play…… why not add a drop down and option to put your holding to show your value (I wish I had 100!)