Skip to Content

Fetch Data from Public API to Your AppGyver Application

test
0 %
Fetch Data from Public API to Your AppGyver Application
Details

Fetch Data from Public API to Your AppGyver Application

Requires Customer/Partner License
October 21, 2021
Created by
September 20, 2021
Configure your application to fetch records from a public API when a food item is scanned, using a Get Record command, which first needs to be configured.

You will learn

  • How to configure your application to fetch records from a public API
  • How to configure data variables.
QR code

Prerequisites

In the previous tutorial, you learned how to connect your application to a public API. From here, you now need to configure the application to read specific information from that API once a barcode has been scanned. This again uses the Get Record HTTPS request, but this time that request is triggered with a logic flow.


Step 1: Remove alert component

Open your draft application in your AppGyver Composer account, displaying your barcode scanner app.

As you no longer need your application to send an alert, as this was just used as a test, you need to start by removing the alert component in your logic flow.

To do this, click your Scan button and then click Show Logic for Button1.

Show logic for button 1

Remove the Alert component from your logic panel, as this is no longer needed.

Remove alert component
Log on to answer question
Step 2: Add Get Record component

You now need to add your new logic flow for what should happen after the barcode has been scanned. For your application, you want the barcode scanner to fetch data from the data resource you configured in the previous tutorial.

To do this, using the core logic options, scroll down to Data – Get Record and then drag and drop this into the logic editor.

Add Get Record component

Add a connector from the top Scan QR/barcode option to the Get Record option, indicating the flow of logic in your application.

Add connector
Log on to answer question
Step 3: Edit binding

Once the logic flow is set, you need to bind the information to the output of the scanner node.

To do this, Select the Get Record element and, using the properties panel, click Currently bound to: Static text, opening the binding options screen.

Currently bound options

Click Output value of another node.

Output value edit

Configure the binding to the following:

  • Select logic node – Scan QR/barcode
  • Select node output – Scan QR/barcode / QR barcode content

Then click Save.

The Get Record flow function should now be able to fetch data for any food barcode you scan with your application.

Edit binding
Log on to answer question
Step 4: Add data variables

You now need to configure your application to store the data it receives. To do this, you need to add data variables.

To do this, switch to the Variables view.

Switch to variables view

Click Data Variables.

Data variables

Click Add Data Variable.

Add data variables

Select your Open Food Facts variable.

Select open food facts

As the barcode will be for a single product, select Data variable type – Single data record.

Select single data record

Data variables come with default logic that fetches new information every five seconds, however your app should only fetch information when a barcode is scanned. As a result, you need to remove the default logic. To do this, click Show Logic for Empty Page.

Click show logic button

Then delete the default logic by highlighting it and pressing the delete button on the keyboard.

Delete default logic

Click Save.

Save logic

The data variables are now configured for your application.

Log on to answer question
Step 5: Set data variable for scan button

Now click View to switch back to your application interface view. From here, you will need to add the final piece to your logic flow.

Change view

To do this, click your Scan button to open the relevant logic panel.

Scan button logic

Using the core logic options, scroll down to Variables – Set Data Variables and then drag and drop this into the logic editor.

Set Data Variable

Add a connector from the top Get record option to the Set data variable option.

Add connector

Now, click the Set data variable element and click Currently bound to: object with properties.

Currently bound

Select Output value of another node and then choose the following:

  • Select logic node: Get record
  • Select node output: Record
Link text e.g., Destination screen

Then click Save to save this logic.

Save the logic

Click Save to save your draft application.

Link text e.g., Destination screen

The logic has now been added to your draft application.

When will your app fetch new information from the API?
×

Next Steps

Back to top