Compartir a través de

Introducción a la CLI de Azure Static Web Apps

  • Artículo

Importante

Para mejorar la seguridad de las implementaciones desde la CLI de Static Web Apps, se ha introducido un cambio importante que requiere que actualice a la versión más reciente (2.0.2) de la CLI de Static Web Apps el 15 de enero de 2025.

Los sitios web de Azure Static Web Apps se hospedan en la nube y, a menudo, conectan una colección de servicios en la nube. Durante el desarrollo y en cualquier momento que necesite ejecutar la aplicación localmente, necesita herramientas para imitar cómo se ejecuta una aplicación en la nube.

La CLI de Static Web Apps (CLI de SWA) incluye una serie de servicios locales que se aproximan a cómo se ejecutaría la aplicación en Azure, pero en vez de ello se ejecutan exclusivamente en la máquina.

La CLI de Azure Static Web Apps proporciona los siguientes servicios:

  • Un servidor de sitio estático local
  • Un proxy para el servidor de desarrollo del marco front-end
  • Un proxy para los puntos de conexión de API: disponible mediante Azure Functions Core Tools
  • Un servidor ficticio de autenticación y autorización
  • Aplicación de opciones de configuración y rutas locales

Funcionamiento

En el gráfico siguiente se muestra cómo se administran las solicitudes localmente.

Diagrama que muestra el flujo de solicitud y respuesta de la CLI de Azure Static Web App.

Importante

Vaya a http://localhost:4280 para acceder a la aplicación suministrada por la CLI.

  • Las solicitudes realizadas al puerto 4280 se reenvían al servidor adecuado según el tipo de solicitud.

  • Las solicitudes de contenido estático, como HTML o CSS, se administran mediante el servidor interno de contenido estático de la CLI o el servidor del marco de front-end para la depuración.

  • Las solicitudes de autenticación y autorización se administran mediante un emulador, que proporciona un perfil de identidad falso a la aplicación.

  • El entorno de ejecución de Functions Core Tools1 administra las solicitudes a la API del sitio.

  • Las respuestas de todos los servicios se devuelven al explorador como si fueran toda ellas una sola aplicación.

Una vez que inicie la interfaz de usuario y las aplicaciones de API de Azure Functions de forma independiente, inicie la CLI de Static Web Apps y apúntela a las aplicaciones en ejecución mediante el siguiente comando:

swa start http://localhost:<DEV-SERVER-PORT-NUMBER> --api-location http://localhost:7071

Opcionalmente, si usa el comando swa init, la CLI de Static Web Apps examina el código de la aplicación y compila un archivo de configuración swa-cli.config.json para la CLI. Al usar el archivo swa-cli.config.json, puede ejecutar swa start para iniciar la aplicación localmente.

1 La CLI instala automáticamente Azure Functions Core Tools si aún no están en el sistema.

Introducción

Empiece a trabajar con la CLI de Static Web Apps con los siguientes recursos.

Resource Descripción
Instalación de la CLI de Static Web Apps (CLI de SWA) Instale la CLI de Azure Static Web Apps en la máquina.
Configuración del entorno Configure cómo la aplicación lee la información de configuración.
Inicio del emulador de sitios web Inicie el servicio para atender localmente su sitio web.
Inicio del servidor de API local Inicie el servicio para atender localmente los puntos de conexión de API.
Implementación en Azure Implemente la aplicación en producción en Azure.

Nota:

A menudo, los sitios creados con un marco de front-end requieren que una opción de configuración de proxy controle solicitudes correctamente en la ruta api. Al usar la CLI de Azure Static Web Apps el valor de ubicación del proxy es /api y, sin la CLI, el valor es http://localhost:7071/api.

Pasos siguientes

Instalación de la CLI