Azure recently announced the preview of new API backend options in Azure Static Web Apps. Developers can now create an end-to-end authenticated application calling APIs hosted on Azure App Service, Azure Container Apps, or Azure API Management.
Static Web Apps (SWA) is an Azure service that automatically builds and deploys full-stack web apps directly from a code repository, with GitHub and AzureDevOps integration. A common requirement of web applications is to call backend APIs for data and services and the SWA APIs functionality provides integrated security with direct access to user authentication and role-based authorization data. Annina Keller, software engineer at Microsoft, explains:
You can link any of these resources to your static web app’s production or named preview environments. When linked, any requests to a route prefixed with /api is routed to your backend resource. Using a linked backend allows your frontend app to call your API without configuring cross-origin resource sharing (CORS), and it enables Static Web Apps Authentication to work seamlessly and securely with your API.
SWA was already integrated with Azure Functions, allowing developers to deploy an API with the static web app without managing a separate Azure Functions resource. The new options support instead a "bring your own APIs" scenario, integrating a static web application with existing APIs hosted on other Azure services.
Source: https://techcommunity.microsoft.com/t5/apps-on-azure-blog/new-api-backend-options-in-azure-static-web-apps/ba-p/3516882
App Service can be used to host APIs built with frameworks like Flask, Express, Apollo, and ASP.NET, Container Apps to integrate with APIs and microservices running in serverless containers and API Management to aggregate multiple APIs in a unified API gateway. Martyn Coupland, head of DevOps at Transparity, tweets:
This is really big news if you are using SWA or if you are using a single-page application and want to integrate with a backend.
In a separate learning series, Lee Stott, principal cloud advocate manager at Microsoft, explains how to deploy applications with SWA and why the service can be a first step for new developers. Stott writes:
SWA is now one of the best and easiest ways for students to build and deploy web sites and with Azure for Students and you do this for free.
The cloud provider released best practices for SWA and a recording on how to use the SWA CLI. Among the current limitations of the new backend options, each static web app environment can only be configured with one type of backend API at a time, the API route prefix must be /api, WebSocket is not supported (HTTP only) and the maximum duration of each request is 45 seconds.
The new option is only available in the SWA Standard plan. Built-in, managed Azure Functions APIs are available in all plans, including the free one.