API support in Azure Static Web Apps with Azure Functions

Azure Static Web Apps provides serverless API endpoints via Azure Functions. By using Azure Functions, APIs dynamically scale based on demand, and include the following features:

Azure Static Web Apps APIs are supported by two possible configurations:

  • Managed functions: By default, the API of a static web app is an Azure Functions application managed and deployed by Azure Static Web Apps associated with some restrictions.

  • Bring your own functions: Optionally, you can provide an existing Azure Functions application of any plan type, which is accompanied by all the features of Azure Functions. With this configuration, you're responsible to handle a separate deployment for the Functions app.

The following table contrasts the differences between using managed and existing functions.

Feature Managed Functions Bring your own Functions
Access to Azure Functions triggers Http only All
Supported Azure Functions runtimes Node.js 12
.NET Core 3.1
Python 3.8
All
Supported Azure Functions hosting plans Consumption Consumption
Premium
Dedicated
Integrated security with direct access to user authentication and role-based authorization data
Routing integration that makes the api route available to the web app securely without requiring custom CORS rules.
Durable Functions programming model
Managed identity
Azure App Service Authentication and Authorization token management
API functions available outside Azure Static Web Apps

Configuration

API endpoints are available to the web app through the api route.

Managed functions Bring your own functions
While the api route is fixed, you have control over the folder location of the managed functions app. You can change this location by editing the workflow YAML file located in your repository's .github/workflows folder. Requests to the api route are sent to your existing Azure Functions app.

Troubleshooting and logs

Logs are only available if you add Application Insights.

Managed functions Bring your own functions
Turn on logging by enabling Application Insights on your static web app. Turn on logging by enabling Application Insights on your Azure Functions app.

Constraints

Managed functions Bring your own functions
  • Triggers are limited to HTTP.
  • The Azure Functions app must either be in Node.js 12, .NET Core 3.1, or Python 3.8.
  • Some application settings are managed by the service, therefore the following prefixes are reserved by the runtime:
    • APPSETTING_, AZUREBLOBSTORAGE_, AZUREFILESSTORAGE_, AZURE_FUNCTION_, CONTAINER_, DIAGNOSTICS_, DOCKER_, FUNCTIONS_, IDENTITY_, MACHINEKEY_, MAINSITE_, MSDEPLOY_, SCMSITE_, SCM_, WEBSITES_, WEBSITE_, WEBSOCKET_, AzureWeb
  • You are responsible to manage the Functions app deployment.

Next steps