Compartir vía

Implementación de archivos web estáticos

  • Artículo

Nota:

Los planes de Básico, Estándar y Enterprise quedarán en desuso a partir de mediados de marzo de 2025, con un período de retiro de 3 años. Se recomienda realizar la transición a Azure Container Apps. Para más información, consulte el anuncio de retirada de Azure Spring Apps.

El plan de consumo estándar y dedicado quedará obsoleto a partir del 30 de septiembre de 2024, con un cierre completo al cabo de seis meses. Se recomienda realizar la transición a Azure Container Apps. Para obtener más información, consulte Migrar el plan de consumo y dedicado Azure Spring Apps Standard a Azure Container Apps.

Este artículo se aplica a: ❎ Básico/Estándar ✅ Enterprise

En este artículo se muestra cómo implementar los archivos estáticos en una instancia de plan de Azure Spring Apps Enterprise mediante el paquete de compilación de servidores web Tanzu. Este enfoque es útil si tiene aplicaciones que son exclusivamente para contener archivos estáticos como HTML, CSS o aplicaciones front-end compiladas con el marco de JavaScript que prefiera. Puede implementar directamente estas aplicaciones con un servidor web configurado automáticamente (HTTPD y NGINX) para atender esos recursos.

Requisitos previos

Implementación de archivos estáticos

Nota:

Este artículo se centra en describir las configuraciones de implementación y la resolución de problemas específicos de la implementación de archivos estáticos web. Para comprender los escenarios generales de compilación e implementación del plan Azure Springs Apps Enterprise, consulte la sección Crear un servicio bajo demanda Utilizar Tanzu Build Service y Cómo implementar aplicaciones políglotas.

Puede implementar archivos estáticos en Azure Spring Apps mediante servidores web NGINX o HTTPD de las siguientes maneras:

  • Puede implementar archivos estáticos directamente. Azure Spring Apps configura automáticamente el servidor web especificado para servir los archivos estáticos.
  • Puede crear la aplicación front-end en el marco de JavaScript que prefiera y, a continuación, implementar la aplicación front-end dinámica desde el código fuente. Azure Spring Apps compila la aplicación en contenido estático y usa el servidor web configurado para atender los archivos estáticos.

También puede crear un archivo de configuración del servidor para personalizar el servidor web.

Ejemplos de implementación

Los ejemplos de la CLI de Azure de esta sección muestran la compilación e implementación de archivos estáticos para dos escenarios de registro de contenedor:

  • Registro de contenedor administrado de Azure Spring Apps.
  • Registro de contenedor administrado por el usuario.

Compilar e implementar archivos estáticos directamente

Este sencillo ejemplo despliega archivos estáticos directamente utilizando un archivo de configuración de servidor por defecto autogenerado.

El siguiente comando implementa un archivo estático:

az spring app deploy
    --resource-group <resource-group-name> \
    --service <Azure-Spring-Apps-instance-name> \
    --name <app-name> \
    --source-path <path-to-source-code> \
    --build-env BP_WEB_SERVER=nginx

Para obtener información sobre el uso de variables de entorno, consulte la sección Configurar un archivo de configuración de servidor autogenerado.

Compilación e implementación de la aplicación front-end como contenido estático

En este ejemplo se implementa una aplicación front-end dinámica desde el código fuente.

El comando siguiente implementa una aplicación:

az spring app deploy \
    --resource-group <resource-group-name> \
    --service <Azure-Spring-Apps-instance-name> \
    --name <app-name> \
    --source-path <path-to-source-code> \
    --build-env BP_WEB_SERVER=nginx BP_NODE_RUN_SCRIPTS=build BP_WEB_SERVER_ROOT=build

Compilación e implementación de archivos estáticos mediante un archivo de configuración personalizado

En este ejemplo se implementan archivos estáticos mediante un archivo de configuración de servidor personalizado.

El comando siguiente implementa una aplicación:

az spring app deploy \
    --resource-group <resource-group-name> \
    --service <Azure-Spring-Apps-instance-name> \
    --name <app-name> \
    --source-path <path-to-source-code>

Para más información, consulte la sección Uso de un archivo de configuración de servidor personalizado de este artículo.

Código de ejemplo

Nota:

El código de ejemplo lo mantiene la comunidad de código abierto Paketo.

Los ejemplos de módulos de compilación de Paketo muestran casos de uso comunes para varios tipos de aplicación diferentes, incluidos los siguientes casos de uso:

  • Servir archivos estáticos con un archivo de configuración de servidor predeterminado mediante BP_WEB_SERVER para seleccionar HTTPD o NGINX.
  • Usar el Administrador de paquetes de Node para compilar una Aplicación de React en archivos estáticos a los que puede servir un servidor web. Siga estos pasos:
    1. Defina un script bajo la propiedad scripts del archivo package.json que compila los recursos estáticos listos para producción. Para React, es build.
    2. Averigüe dónde se almacenan los recursos estáticos después de que se ejecute el script de compilación. Para React, los recursos estáticos se almacenan en ./build de manera predeterminada.
    3. Establezca BP_NODE_RUN_SCRIPTS en el nombre del script de compilación.
    4. Establezca BP_WEB_SERVER_ROOT en el directorio de salida de compilación.
  • Proporcionar archivos estáticos con su propio archivo de configuración de servidor, mediante HTTPD o NGINX.

Configurar un archivo de configuración de servidor autogenerado

Puede usar variables de entorno para modificar el archivo de configuración del servidor generado automáticamente. En la tabla siguiente se muestran las variables de entorno admitidas.

Variable de entorno Valor admitido Descripción
BP_WEB_SERVER nginx o httpd Especifica el tipo de servidor web, nginx para Nginx o httpd para el servidor HTTP de Apache. Necesario cuando se usa el archivo de configuración del servidor generado automáticamente.
BP_WEB_SERVER_ROOT Una ruta de acceso de archivo absoluta o una ruta de acceso de archivo relativa a /workspace. Establece el directorio raíz de los archivos estáticos. El valor predeterminado es public.
BP_WEB_SERVER_ENABLE_PUSH_STATE true o false Habilita el enrutamiento de estado de inserción para la aplicación. Independientemente de la ruta solicitada, index.html siempre se sirve. Útil para aplicaciones web de página única.
BP_WEB_SERVER_FORCE_HTTPS true o false Aplica HTTPS para las conexiones de servidor redirigiendo todas las solicitudes para usar el protocolo HTTPS.

No se admiten las siguientes variables de entorno.

  • BP_LIVE_RELOAD_ENABLED
  • BP_NGINX_VERSION
  • BP_HTTPD_VERSION

Uso de un archivo de configuración de servidor personalizado

Puede configurar el servidor web mediante un archivo de configuración de servidor personalizado. En la siguiente tabla se muestra la ruta de acceso del archivo de configuración:

Servidor web Ruta de acceso del archivo de configuración predeterminada Personalización de la ruta de acceso del archivo de configuración del servidor
nginx nginx.conf en la ruta de acceso raíz del código fuente. Use la variable de entorno BP_NGINX_CONF_LOCATION para especificar el nombre del archivo de configuración. Coloque el archivo en la ruta de acceso raíz del código fuente.
httpd httpd.conf en la ruta de acceso raíz del código fuente. No admitida.

El archivo de configuración debe cumplir las restricciones descritas en la tabla siguiente.

Configuración Descripción Configuración de Nginx Configuración de Httpd
Puerto de escucha El servidor web debe escuchar en el puerto 8080. El servicio comprueba la preparación del puerto en TCP y si está en ejecución. Debe usar la variable PORT con plantilla en el archivo de configuración. El número de puerto adecuado se inserta cuando se inicia el servidor web. listen {{PORT}} Listen "${PORT}"
Ruta de acceso al registro Ruta de acceso del registro de configuración a la consola. access_log /dev/stdout, error_log stderr ErrorLog /proc/self/fd/2
Ruta de acceso de archivo con permiso de escritura Al servidor web se le concede permiso de escritura al directorio /tmp. La configuración de la ruta de acceso completa requiere el permiso de escritura en el directorio /tmp. Por ejemplo: client_body_temp_path /tmp/client_body_temp
Tamaño máximo aceptado del cuerpo de la solicitud de cliente El servidor web está detrás de la puerta de enlace. El tamaño máximo aceptado del cuerpo de la solicitud de cliente se establece en 500 m en la puerta de enlace y el valor del servidor web debe ser inferior a 500 m. client_max_body_size debe ser inferior a 500 m. LimitRequestBody debe ser inferior a 500 m.

Enlaces de módulos de compilación

La implementación de archivos estáticos en el plan Enterprise de Azure Spring Apps admite el enlace buildpack de Dynatrace. No se admite el enlace de módulos de compilación htpasswd.

Para más información, consulte Cómo configurar la integración de APM y los certificados de CA.

Errores comunes de compilación e implementación

La implementación de archivos estáticos en una instancia de Azure Spring Apps Enterprise puede generar los siguientes errores de compilación comunes:

  • ERROR: No buildpack groups passed detection.
  • ERROR: Please check that you're running against the correct path.
  • ERROR: failed to detect: no buildpacks participating

La causa principal de estos errores es que no se especifica el tipo de servidor web. Para resolver estos errores, establezca la variable BP_WEB_SERVER de entorno en nginx o httpd.

En la tabla siguiente se describen los errores de implementación comunes al implementar archivos estáticos en el nivel Enterprise de Azure Spring Apps.

Mensaje de error Causa principal Solución
112404: Exit code 0: purposely stopped, please refer to https://aka.ms/exitcode No se pudo iniciar el servidor web. Valide el archivo de configuración del servidor para ver si hay un error de configuración. A continuación, compruebe si el archivo de configuración cumple las restricciones descritas en la sección Usar de un archivo de configuración de servidor personalizado.
mkdir() "/var/client_body_temp" failed (13: Permission denied) El servidor web no tiene permiso de escritura en la ruta de acceso especificada. Configure la ruta de acceso en el directorio /tmp; por ejemplo: /tmp/client_body_temp.

Pasos siguientes