Compatibilidad de API en Azure Static Web Apps con Azure App Service

Azure App Service es una plataforma administrada para hospedar aplicaciones web que ejecutan código en servidores. Azure App Service admite muchos entornos de ejecución y marcos, como Node.js, ASP.NET Core, PHP, Java y Python.

Al vincular la aplicación web de Azure App Service a la aplicación web estática, las solicitudes a la aplicación web estática con una ruta que comienza por /api se enrutan a la misma ruta en la aplicación Azure App Service.

De forma predeterminada, cuando una aplicación de App Service está vinculada a una aplicación web estática, la aplicación App Service solo acepta solicitudes que se envían a través de la aplicación web estática vinculada. Una aplicación Azure App Service solo se puede vincular a una sola aplicación web estática a la vez.

Todos los planes de hospedaje Azure App Service están disponibles para su uso con Azure Static Web Apps.

Las opciones de API para Static Web Apps incluyen los siguientes servicios de Azure:

Para más información, consulte la Información general de APIs.

Nota:

La integración con App de Azure Service requiere el plan Estándar de Static Web Apps.

La integración de back-end no se admite en entornos de solicitud de incorporación de cambios de Static Web Apps.

Requisitos previos

Para vincular una instancia de App Service a la aplicación web estática, debe tener un recurso de App Service existente y una aplicación web estática.

Resource Descripción
Azure App Service Si aún no tiene una, siga los pasos descritos en la guía Creación de una aplicación web en Azure .
Aplicación web estática existente Si aún no tiene una, siga los pasos de la guía de introducción para crear una aplicación web estática Sin plataforma.

Ejemplo

Considere una instancia de servicio de App de Azure existente que expone un punto de conexión a través de la siguiente ubicación.

https://my-web-app.azurewebsites.net/api/getProducts

Una vez vinculado, puede acceder a ese mismo punto de conexión a través de la ruta de acceso api desde la aplicación web estática, como se indica en esta dirección URL de ejemplo.

https://red-sea-123.azurestaticapps.net/api/getProducts

Ambas direcciones URL apuntan al mismo punto de conexión de API. El punto de conexión de App Service debe tener el /api prefijo, ya que Static Web Apps coincide con las solicitudes realizadas en /api y proxies toda la ruta de acceso al recurso vinculado.

Para vincular una aplicación web como back-end de API para una aplicación web estática, siga estos pasos:

  1. En Azure Portal, vaya a la aplicación web estática.

  2. Seleccione APIs en el menú de navegación.

  3. Busque el entorno al que desea vincular la instancia de API Management. Seleccione Vínculo.

  4. En Backend resource type(Tipo de recurso back-end), seleccione Web App (Aplicación web).

  5. En Subscription (Suscripción), seleccione la suscripción que contiene la aplicación Azure App Service que desea vincular.

  6. En Resource name (Nombre del recurso), seleccione la aplicación Azure App Service.

  7. Seleccione Vínculo.

Una vez completado el proceso de vinculación, las solicitudes a las rutas que comienzan por /api se enrutan a la aplicación de App Service vinculada.

Administración del acceso a Azure App Service

La aplicación App Service está configurada con un proveedor de identidades denominado Azure Static Web Apps (Linked) que solo permite el tráfico que se realiza mediante proxy a través de la aplicación web estática. Para que la aplicación de App Servicesea accesible para otras aplicaciones, actualice su configuración de autenticación para agregar otro proveedor de identidades o cambie la configuración de seguridad para permitir el acceso no autenticado.

Para desvincular una aplicación web desde una aplicación web estática, siga estos pasos:

  1. En Azure Portal, vaya a la aplicación web estática.

  2. Seleccione APIs en el menú de navegación.

  3. Busque el entorno que desea desvincular y seleccione el nombre de la aplicación web.

  4. Seleccione Unlink (Desvincular).

Una vez completado el proceso de desvinculación, las solicitudes a las rutas que comienzan por /api ya no están enrutados a la aplicación de App Service vinculada.

Nota:

Para evitar exponer accidentalmente la aplicación de App Service al tráfico anónimo, el proveedor de identidades creado por el proceso de vinculación no se elimina automáticamente. Puede eliminar el proveedor de identidades denominado Azure Static Web Apps (Linked) [Azure Static Web Apps (vinculado)] de la configuración de autenticación de App Service aplicación.

Eliminación de la autenticación del recurso de App Service

Para permitir que el recurso de App Service reciba tráfico anónimo, siga estos pasos para quitar el proveedor de identidades:

  1. En Azure Portal, vaya al recurso de App Service.

  2. Seleccione Autenticación en el menú de navegación.

  3. En la lista de proveedores de identidades, elimine el proveedor de identidades relacionado con el recurso Static Web Apps.

  4. Seleccione Quitar autenticación para quitar la autenticación y permitir el tráfico anónimo al recurso de App Service.

El recurso de App Service ahora puede recibir tráfico anónimo.

Pasos siguientes