Introducción

Este tutorial aborda la configuración segura de un servidor para MusePublic Art Studio, una herramienta de generación de imágenes basada en IA. El objetivo es implementar acceso mediante HTTPS para cifrar las comunicaciones y configurar el intercamibo de recursos entre orígenes (CORS) para permitir la integración con aplicaciones web externas.

El enfoque se centra en utilizar Nginx como proxy inverso, gestionando certificados SSL y ajustes de CORS para facilitar el despliegue en entornos de producción.

Requisitos previos

• MusePublic Art Studio ya desplegado y accesible en el puerto local 8080.
• Un dominio con registro DNS apuntando a la dirección IP del servidor.
• Acceso a la línea de comandos en un sistema Linux con privilegios de administrador.

Instalación de Nginx

Comience instalando Nginx si aún no está presente en el sistema. Utilice el gestor de paquetes correspondiente.

sudo apt update
sudo apt install nginx -y
sudo systemctl start nginx
sudo systemctl enable nginx

Obtención de certificados SSL

Para entornso de producción, use Let's Encrypt para obtener certificados gratuitos. Para pruebas, genere un certificado autofirmado.

Certificado con Let's Encrypt:

sudo apt install certbot python3-certbot-nginx -y
sudo certbot --nginx -d servidor.ejemplo.com
sudo certbot certificates

Certificado autofirmado (para desarrollo):

sudo mkdir -p /etc/nginx/certs
sudo openssl req -x509 -nodes -days 365 -newkey rsa:2048 \
-keyout /etc/nginx/certs/clave_privada.key \
-out /etc/nginx/certs/certificado.crt

Configuración del proxy inverso

Cree un archivo de configuración de sitio para Nginx. Redirija el tráfico HTTP a HTTPS y proxyfique las solicitudes a la aplicación local.

sudo nano /etc/nginx/sites-available/arte_studio

Añada el siguiente contenido, ajustando el dominio y las rutas de certificados según sea necesario:

server {
    listen 80;
    servidor_nombre servidor.ejemplo.com;
    return 301 https://$servidor_nombre$request_uri;
}

server {
    listen 443 ssl;
    servidor_nombre servidor.ejemplo.com;

    ssl_certificate /etc/letsencrypt/live/servidor.ejemplo.com/fullchain.pem;
    ssl_certificate_key /etc/letsencrypt/live/servidor.ejemplo.com/privkey.pem;
    # Para certificado autofirmado:
    # ssl_certificate /etc/nginx/certs/certificado.crt;
    # ssl_certificate_key /etc/nginx/certs/clave_privada.key;

    ssl_protocols TLSv1.2 TLSv1.3;
    ssl_ciphers ECDHE-RSA-AES256-GCM-SHA512;
    ssl_prefer_server_ciphers off;
    ssl_session_cache shared:SSL:10m;

    location / {
        proxy_pass http://127.0.0.1:8080;
        proxy_set_header Host $host;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        proxy_set_header X-Forwarded-Proto $scheme;
        proxy_connect_timeout 300s;
        proxy_read_timeout 300s;
        proxy_http_version 1.1;
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection "upgrade";
    }

    location ~* \.(js|css|png|jpg|svg)$ {
        proxy_pass http://127.0.0.1:8080;
        expires 30d;
        add_header Cache-Control "public";
    }

    access_log /var/log/nginx/arte_studio.access.log;
    error_log /var/log/nginx/arte_studio.error.log;
}

Habilite el sitio y reinicie Nginx:

sudo ln -s /etc/nginx/sites-available/arte_studio /etc/nginx/sites-enabled/
sudo nginx -t
sudo systemctl reload nginx

Configuración de CORS

Para permitir solicitudes desde otros dominios, agregue encabezados CORS en la sección de proxy. Modifique el bloque de ubicación anterior.

location / {
    proxy_pass http://127.0.0.1:8080;
    proxy_set_header Host $host;
    proxy_set_header X-Real-IP $remote_addr;
    proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
    proxy_set_header X-Forwarded-Proto $scheme;

    # Encabezados CORS
    add_header 'Access-Control-Allow-Origin' '$http_origin' always;
    add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS' always;
    add_header 'Access-Control-Allow-Headers' 'Content-Type, Authorization' always;
    add_header 'Access-Control-Allow-Credentials' 'true' always;

    if ($request_method = 'OPTIONS') {
        add_header 'Access-Control-Allow-Origin' '$http_origin';
        add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS';
        add_header 'Access-Control-Allow-Headers' 'Content-Type, Authorization';
        add_header 'Access-Control-Max-Age' 86400;
        add_header 'Content-Length' 0;
        return 204;
    }
}

Para restringir el acceso a dominios específicos, ajuste el origen permitido:

set $origen_permitido "";
if ($http_origin ~* "^https://(app1\.ejemplo\.com|app2\.ejemplo\.com)$") {
    set $origen_permitido $http_origin;
}
add_header 'Access-Control-Allow-Origin' $origen_permitido always;

Verificación y pruebas

Valide la configuración y pruebe la funcionalidad.

Verificar sintaxis de Nginx:

sudo nginx -t
sudo systemctl status nginx

Probar acceso HTTPS:

curl -I https://servidor.ejemplo.com
curl -v https://servidor.ejemplo.com 2>&1 | grep "SSL"

Probar CORS:

curl -X OPTIONS -H "Origin: https://app.ejemplo.com" \
-H "Access-Control-Request-Method: POST" \
-I https://servidor.ejemplo.com

Solución de problemas comunes

• Error 502 Bad Gateway: Verifique que MusePublic Art Studio esté ejecutándose en el puerto 8080. Use netstat -tlnp | grep 8080 para confirmar.
• Certificado no válido: Revise las rutas de los certificados en la configuración de Nginx y los permisos de los archivos.
• CORS bloqueado: Inspeccione los encabezados de respuesta con curl y revise los registros de error de Nginx en /var/log/nginx/.

Para mejorar el rendimiento, considere ajustar los buffers de proxy y habilitar compresión Gzip en la configuración de Nginx.