Read the release
 

Design REST Power Apps

Ready to get started?

Learn more or sign up for a free trial:

CData API Server

In this article

Related articles


This article shows how to gain real-time, database-like connectivity from mobile and tablet Power Apps.

Microsoft Power Apps provides a drag and drop interface, underpinned by a rich set of formulas, for generating mobile and tablet apps that are connected to data. The CData API Server, when paired with the ADO.NET Provider for REST (or any of 200+ other ADO.NET Providers), extends Power Apps with connectivity to remote data sources, without a need to maintain a separate copy of the data in the Power Apps Common Data Service. The CData API Server provides database-like connectivity for REST, augmenting the functionality of SaaS APIs and NoSQL databases with an in-memory SQL-92 engine.

The CData API Server also supports the Swagger metadata standard, whose UI-generation and code-generation possibilities are utilized across Azure App Service, Power Automate, and Power Apps. With Swagger, Power Apps generates a complete set of formulas for working with REST -- this article shows how to use these formulas to connect your PowerApp to remote REST data.

Set Up the API Server

Follow the steps below to begin producing secure REST OData services:

Deploy

The API Server runs on your own server. On Windows, you can deploy using the stand-alone server or IIS. On a Java servlet container, drop in the API Server WAR file. See the help documentation for more information and how-tos.

The API Server is also easy to deploy on Microsoft Azure, Amazon EC2, and Heroku.

Connect to REST

After you deploy the API Server and the ADO.NET Provider for REST, provide authentication values and other connection properties by clicking Settings -> Connections and adding a new connection in the API Server administration console. You can then choose the entities you want to allow the API Server access to by clicking Settings -> Resources.

See the Getting Started chapter in the data provider documentation to authenticate to your data source: The data provider models REST APIs as bidirectional database tables and XML/JSON files as read-only views (local files, files stored on popular cloud services, and FTP servers). The major authentication schemes are supported, including HTTP Basic, Digest, NTLM, OAuth, and FTP. See the Getting Started chapter in the data provider documentation for authentication guides.

After setting the URI and providing any authentication values, set Format to "XML" or "JSON" and set DataModel to more closely match the data representation to the structure of your data.

The DataModel property is the controlling property over how your data is represented into tables and toggles the following basic configurations.

  • Document (default): Model a top-level, document view of your REST data. The data provider returns nested elements as aggregates of data.
  • FlattenedDocuments: Implicitly join nested documents and their parents into a single table.
  • Relational: Return individual, related tables from hierarchical data. The tables contain a primary key and a foreign key that links to the parent document.

See the Modeling REST Data chapter for more information on configuring the relational representation. You will also find the sample data used in the following examples. The data includes entries for people, the cars they own, and various maintenance services performed on those cars.

Authorize API Server Users

After determining the OData services you want to produce, authorize users by clicking Settings -> Users. The API Server uses authtoken-based authentication and supports the major authentication schemes. You can authenticate as well as encrypt connections with SSL. Access can also be restricted by IP address; Access is restricted to only the local machine by default.

You will also need to enable CORS and then define the following sections by clicking Settings -> Server. As an alternative, you can select the option to allow all domains without '*'.

  1. Access-Control-Allow-Origin: Set this to a value of '*', or the domains you will be calling the API Server from.
  2. Access-Control-Allow-Methods: Set this to a value of "GET,PUT,POST,OPTIONS", or the HTTP methods you will need to use.
  3. Access-Control-Allow-Headers: Set this to "x-ms-client-request-id, authorization, content-type".

Last, you will need to configure the API Server to allow users to authenticate by passing the authtoken as a part of the URL. To do so, navigate to the www/app_data folder in the installation direction and modify the settings.cfg file to add the following line in the [Application] section:

AllowAuthTokenInURL = true

Retrieve the Swagger Metadata

You will use the metadata to create a Custom API connection. You can obtain the Swagger definition by making the following request in your browser and then saving the resulting JSON file:

http://MySite:MyPort/api.rsc/$oas?version=2

Connect to REST Through the API Server

The following procedure shows how to create a simple app that searches remote REST data.

  1. In Microsoft Power Apps, click Custom connectors.
  2. Click Create custom connector and choose Import an OpenAPI file.
  3. Name the connector, browse to the JSON file, and click Continue.
  4. Fill in the relevant General information, ensure that Base URL is of the form /api.rsc/@myauthtoken (where myauthtoken is the AuthToken for a configure API Server user), and click Continue.
  5. Select No authentication for the Authentication type. Click Continue.
  6. Review the Action and Reference definitions and click Create connector.
  7. To test the connector, you will need to create a new connection. Click Test, click New Connection under Connections, and click Create.
  8. Navigate back to the connector from the Custom connectors menu and click Test. From here, you can test the available operations.

Connect the Data Source to a PowerApp

Follow the steps below to connect to REST from a PowerApp:

  1. From the Power Apps main menu, click Create an app and select the on-premises or cloud PowerApp Studio.
  2. Select a blank app (choose Phone layout or Tablet layout).
  3. In the View tab, click Data Sources and click Add data source.
  4. Click the Connection you created to test the connector.

Populate a Gallery

Follow the steps below to create a simple app that can search REST data. You will use Power Apps formulas to bind REST rows to rows in a gallery control.

  1. In the View tab, click Gallery -> Vertical to add a Gallery.

  2. After selecting a gallery, assign the Items property of the gallery to REST data on the Advanced tab of the gallery settings. The formula below will allow you to access columns in the people table.

    ForAll(CDataSwaggerAPI.getAllPeople().value, {my[ personal.name.first ]: [ personal.name.first ], my[ personal.name.last ]: [ personal.name.last ]})

  3. Assign REST columns to UI elements by clicking the element and then setting the Text property (on the Advanced tab of the UI element) to ThisItem.my[ personal.name.first ] or ThisItem.my[ personal.name.last ].

Search REST Data

To filter the records displayed by the gallery, add a TextInput to your Screen, clear the Text property for the TextInput, and set the Items property of the gallery to a formula like the one below, replacing TextInput1 with the name of the TextInput control in your gallery, if necessary:

If(IsBlank(TextInput1.Text), ForAll(CDataSwaggerAPI.getAllPeople().value, {my[ personal.name.first ]: [ personal.name.first ], my[ personal.name.last ]: [ personal.name.last ]}), ForAll(CDataSwaggerAPI.getAllPeople({'$filter':Concatenate("contains([ personal.name.first ],",TextInput1.Text,")")}).value, {my[ personal.name.first ]: [ personal.name.first ], my[ personal.name.last ]: [ personal.name.last ]}))

The formula builds an OData query that the API Server executes against the remote REST data, ensuring that the search is run against the current data without first pulling in every record into the app. You can find more information on the supported OData in the API Server help documentation.

Edit REST Data

Follow the steps below to load an editable screen that shows the fields of the REST record selected in the gallery.

  1. On the Insert tab, click New Screen->Blank and name the screen "Details".
  2. Tie the gallery to the new screen: Select the arrow button in the first entry of the gallery and in the OnSelect field in the Advanced properties, enter the following:

    Navigate( Details, None )
  3. In the Details screen, from the Insert tab, add a label "Id" and another label for the Id value. Set the Text property to BrowseGallery.Selected.Id

For each column you will need to do the following. Note that for Custom APIs form elements cannot detect which requests need to be formulated to the API Server, so you will need to write the data modification formulas manually.

  1. Add a label for the field.
  2. Add a text input from the Text menu to the screen and set the text property to the value from the selected item from the gallery (i.e.: BrowseGallery.Selected.my[ personal.name.first ]).

To give your app basic update functionality and navigation, add Submit and Back buttons:

  1. For the Submit button, set the OnChange property to the following: CDataSwaggerAPI.updatepeople(BrowseGallery.Selected.myId,BrowseGallery.Selected.myId,{[ personal.name.first ]:TextInput1.Text,[ personal.name.last ]:TextInput2.Text})
  2. For the Back button, set the OnSelect field to the following: Navigate( BrowseScreen, None )

Your mobile or tablet app can now browse, search, and update REST data.