This post is a part of series of Leverage collaboration between PowerApps and Azure API Management. In previous post, we have enabled our PowerApps to access your Web APIs via API Management. As next step, we will enable Developer Portal on Azure API Management to widely publish your Web API for "citizen developers". This step accelerates to establish ecosystems.
- No.1: Setup Power Apps "custom connectors" to simply call your Web APIs via API Management
- No.2: Enable Developer portal for API Management to expose your Web APIs as ecosystem - this post!
- No.3: Authentication and authorization with Azure AD
- No.4: Enterprise network usage
Most IT departments want to establish ecosystems by publishing their Web APIs. Azure API Management is a perfect solution to achieve the objective. Azure API Management enables citizen developers leverage the Web API to optimize or automate their business. Citizen developers can check API specs, publish keys, test or run Web APIs anytime on API Management. By publishing your Web APIs on Developer Portal, citizen developers can retrieve your Web API with various applications or flows not only Power Platform. But Developer Portal isn't enabled initially, so we will enable it and publish Web APIs on it as first step.
Enable Developer Portal on API Management
Open Portal overview menu on your API Management and Click Developer portal, because you haven't setup any contents on your developer portal. You can find a simple page just after opening your developer portal. In this example, I have just updated top page text as containing my name to prepare for publishing as my developer portal.
You're ready to publish your developer portal now, so go back to Portal overview menu on your API Management. You can find enabled Publish button for developer portal, so click the button.
Enable Azure AD authentication in addition to publish developer portal. Citizen developers are authenticated with their Azure AD tenants in most cases, so we can make more useful by establishing Single Sign-On(SSO).
Service Principal for API Management will be automatically generated on your Azure AD tenant after enabling SSO. Users for your Web APIs will be required consent for your Azure AD administrator. Open your service principal on your Azure AD tenant and grant admin consent for the service principal.
Create and publish as a product with your Web API. Open your Web API setting page and choose products which you want to include your Web APIs as packages to publish for citizen developers.
Enable Cross-Origin Resource Sharing(CORS) to allow your WEB API users to access on developer portal. Note that your Power Apps can't access your Web APIs right after enabling this setting - how to fix this issue has been described bottom on this article.
Access developer portal as a citizen developer
Open your developer portal and you will be required to sign-in. Login your citizen developer credential with Azure AD. Subscribe a product on developer portal, so you can pick up keys to access your Web APIs as a citizen developer.
Fix CORS issue to call your Web API from Power Apps
It's required to allow preflight requests from Power Apps to your API Management. You have already enabled CORS but API Management hasn't allowed preflight requests except for your developer portal, so you need additional setting. Open your Web API setting and put information.
<policies>
<inbound>
<base />
<cors allow-credentials="true">
<allowed-origins>
<origin>https://your-apim-name.developer.azure-api.net</origin>
<origin>https://flow.microsoft.com</origin>
<origin>https://your-powerapps-region.create.powerapps.com</origin>
<origin>https://apps.powerapps.com</origin>
<origin>https://make.powerapps.com</origin>
</allowed-origins>
<allowed-methods preflight-result-max-age="300">
<method>*</method>
</allowed-methods>
<allowed-headers>
<header>*</header>
</allowed-headers>
<expose-headers>
<header>*</header>
</expose-headers>
</cors>
</inbound>
<backend>
<base />
</backend>
<outbound>
<base />
</outbound>
<on-error>
<base />
</on-error>
</policies>
You can confirm your regional id on preflight requests by using browser developer tools like here - you can use jp if your environment is Japan.
Now, your Power Apps can access your Web APIs via API Management again! As next step, you can configure additional settings on API Management. API Management offers "advanced request throttling" to avoid unexpected error caused by massive request to backend systems. Setup quota or rate-limit policy for your backend Web APIs.
https://docs.microsoft.com/azure/api-management/api-management-sample-flexible-throttling
https://docs.microsoft.com/azure/api-management/api-management-access-restriction-policies
