slicejs-web-framework 2.2.5 → 2.2.7

package/api/index.js

@@ -1,15 +1,19 @@
+// api/index.js - Seguridad automática sin configuración
 import express from 'express';
 import path from 'path';
 import { fileURLToPath } from 'url';
 import { dirname } from 'path';
-import inquirer from 'inquirer';
+import { 
+  securityMiddleware, 
+  sliceFrameworkProtection, 
+  suspiciousRequestLogger
+} from './middleware/securityMiddleware.js';
 
 const __filename = fileURLToPath(import.meta.url);
 const __dirname = dirname(__filename);
 import sliceConfig from '../src/sliceConfig.json' with { type: 'json' };
 
 let server;
-
 const app = express();
 
 // Parsear argumentos de línea de comandos
@@ -22,14 +26,39 @@ const folderDeployed = 'src';
 // Obtener puerto desde sliceConfig.json, con fallback a process.env.PORT
 const PORT = sliceConfig.server?.port || process.env.PORT || 3001;
 
-console.log(`🚀 Starting Slice.js server in ${runMode} mode`);
-console.log(`📁 Serving files from: /${folderDeployed}`);
-
-app.use('/Slice/', express.static(path.join(__dirname, '..', 'node_modules', 'slicejs-web-framework', 'Slice')));
-
-
-// Middleware para servir archivos estáticos
-app.use(express.static(path.join(__dirname, `../${folderDeployed}`)));
+// ==============================================
+// MIDDLEWARES DE SEGURIDAD (APLICAR PRIMERO)
+// ==============================================
+
+// 1. Logger de peticiones sospechosas (solo observación, no bloquea)
+app.use(suspiciousRequestLogger());
+
+// 2. Protección del framework - TOTALMENTE AUTOMÁTICA
+// Detecta automáticamente el dominio desde los headers
+// Funciona en localhost, IP, y cualquier dominio
+app.use(sliceFrameworkProtection());
+
+// 3. Middleware de seguridad general
+app.use(securityMiddleware({
+  allowedExtensions: [
+    '.js', '.css', '.html', '.json', 
+    '.svg', '.png', '.jpg', '.jpeg', '.gif', 
+    '.woff', '.woff2', '.ttf', '.ico'
+  ],
+  blockedPaths: [
+    '/node_modules',
+    '/package.json',
+    '/package-lock.json',
+    '/.env',
+    '/.git',
+    '/api/middleware'
+  ],
+  allowPublicAssets: true
+}));
+
+// ==============================================
+// MIDDLEWARES DE APLICACIÓN
+// ==============================================
 
 // Middleware para parsear JSON y formularios
 app.use(express.json());
@@ -48,6 +77,20 @@ app.use((req, res, next) => {
   }
 });
 
+// ==============================================
+// ARCHIVOS ESTÁTICOS (DESPUÉS DE SEGURIDAD)
+// ==============================================
+
+// Servir framework Slice.js
+app.use('/Slice/', express.static(path.join(__dirname, '..', 'node_modules', 'slicejs-web-framework', 'Slice')));
+
+// Servir archivos estáticos del proyecto
+app.use(express.static(path.join(__dirname, `../${folderDeployed}`)));
+
+// ==============================================
+// RUTAS DE API
+// ==============================================
+
 // Ruta de ejemplo para API
 app.get('/api/status', (req, res) => {
   res.json({
@@ -56,13 +99,57 @@ app.get('/api/status', (req, res) => {
     folder: folderDeployed,
     timestamp: new Date().toISOString(),
     framework: 'Slice.js',
-    version: '2.0.0'
+    version: '2.0.0',
+    security: {
+      enabled: true,
+      mode: 'automatic',
+      description: 'Zero-config security - works with any domain'
+    }
+  });
+});
+
+// Ruta para verificar estado de seguridad
+app.get('/api/security-status', (req, res) => {
+  const host = req.get('Host');
+  
+  res.json({
+    frameworkProtection: {
+      status: 'active',
+      mode: 'automatic',
+      description: 'Allows framework file loading from application, blocks direct browser access',
+      detectedHost: host
+    },
+    blockedPaths: [
+      '/node_modules/*',
+      '/package.json',
+      '/.env',
+      '/.git/*'
+    ],
+    protectedPaths: {
+      directAccessBlocked: [
+        '/Slice/Components/Structural/*',
+        '/Slice/Core/*',
+        '/Slice/Services/*'
+      ],
+      allowedFrom: 'Any request with valid Referer matching current host'
+    },
+    howItWorks: {
+      automatic: true,
+      config: 'No configuration needed',
+      localhost: 'Works automatically',
+      customDomain: 'Works automatically',
+      detection: 'Uses Referer and Host headers'
+    }
   });
 });
 
+// ==============================================
+// SPA FALLBACK
+// ==============================================
+
 // SPA fallback - servir index.html para rutas no encontradas
 app.get('*', (req, res) => {
-  const indexPath = path.join(__dirname, `../${folderDeployed}`,"App", 'index.html');
+  const indexPath = path.join(__dirname, `../${folderDeployed}`, "App", 'index.html');
   res.sendFile(indexPath, (err) => {
     if (err) {
       res.status(404).send(`
@@ -78,83 +165,15 @@ app.get('*', (req, res) => {
   });
 });
 
+// ==============================================
+// INICIO DEL SERVIDOR
+// ==============================================
+
 function startServer() {
   server = app.listen(PORT, () => {
-    // Limpiar consola y mostrar banner de inicio
-    console.clear();
-    showWelcomeBanner();
-    
-    // Información del servidor
-    console.log(`✅ Server running at ${'\x1b[36m'}http://localhost:${PORT}${'\x1b[0m'}`);
-    console.log(`📂 Mode: ${'\x1b[32m'}${runMode}${'\x1b[0m'} (serving from ${'\x1b[33m'}/${folderDeployed}${'\x1b[0m'})`);
-    console.log(`🔄 ${'\x1b[32m'}Development mode${'\x1b[0m'}: Changes in /src are served instantly`);
-    console.log(`🛑 Press ${'\x1b[31m'}Ctrl+C${'\x1b[0m'} to stop\n`);
+    console.log(`🔒 Security middleware: active (zero-config, automatic)`);
+    console.log(`🚀 Slice.js server running on port ${PORT}`);
   });
-
-  // Mostrar menú interactivo después de un momento
-  setTimeout(showInteractiveMenu, 1500);
-}
-
-function showWelcomeBanner() {
-  const banner = `
-${'\x1b[36m'}╔══════════════════════════════════════════════════╗${'\x1b[0m'}
-${'\x1b[36m'}║${'\x1b[0m'}              ${'\x1b[1m'}🍰 SLICE.JS SERVER${'\x1b[0m'}                ${'\x1b[36m'}║${'\x1b[0m'}
-${'\x1b[36m'}║${'\x1b[0m'}            ${'\x1b[90m'}Development Environment${'\x1b[0m'}             ${'\x1b[36m'}║${'\x1b[0m'}
-${'\x1b[36m'}╚══════════════════════════════════════════════════╝${'\x1b[0m'}
-`;
-  console.log(banner);
-}
-
-async function showInteractiveMenu() {
-  while (true) {
-    try {
-      console.log('\n' + '='.repeat(50));
-      
-      const { action } = await inquirer.prompt([
-        {
-          type: 'list',
-          name: 'action',
-          message: '🎛️  Server Control Menu',
-          choices: [
-            '📊 Server Status',
-            '🌐 Open in Browser',
-            '🔄 Restart Server',
-            '🛑 Stop Server'
-          ]
-        }
-      ]);
-
-      if (action === '📊 Server Status') {
-        console.log(`\n📈 Server Status:`);
-        console.log(`   🔗 URL: http://localhost:${PORT}`);
-        console.log(`   📁 Mode: ${runMode}`);
-        console.log(`   📂 Serving: /${folderDeployed}`);
-        console.log(`   ⏰ Uptime: ${Math.floor(process.uptime())}s`);
-      } else if (action === '🌐 Open in Browser') {
-        const { default: open } = await import('open');
-        await open(`http://localhost:${PORT}`);
-        console.log('🌐 Opening browser...');
-      } else if (action === '🛑 Stop Server') {
-        console.log('\n🛑 Stopping server...');
-        server.close(() => {
-          console.log('✅ Server stopped successfully');
-          process.exit(0);
-        });
-        break;
-      } else if (action === '🔄 Restart Server') {
-        console.log('\nRestarting server...');
-        server.close(() => {
-          console.log('Server stopped. Restarting...');
-          startServer();
-        });
-        break;
-      }
-    } catch (error) {
-      // Si hay error con inquirer, continuar sin menú
-      console.log('\n💡 Interactive menu not available - Press Ctrl+C to stop');
-      break;
-    }
-  }
 }
 
 // Manejar cierre del proceso

package/api/middleware/securityMiddleware.js

@@ -0,0 +1,253 @@
+// api/middleware/securityMiddleware.js
+import path from 'path';
+
+/**
+ * Middleware de seguridad para prevenir acceso directo malicioso
+ * pero permitir que la aplicación cargue sus dependencias normalmente
+ */
+export function securityMiddleware(options = {}) {
+  const {
+    allowedExtensions = ['.js', '.css', '.html', '.json', '.svg', '.png', '.jpg', '.jpeg', '.gif', '.woff', '.woff2', '.ttf'],
+    blockedPaths = [
+      '/node_modules',
+      '/package.json',
+      '/package-lock.json',
+      '/.env',
+      '/.git'
+    ],
+    allowPublicAssets = true
+  } = options;
+
+  return (req, res, next) => {
+    const requestPath = req.path;
+    
+    // 1. Bloquear acceso a rutas definitivamente sensibles (configuración, dependencias)
+    const isBlockedPath = blockedPaths.some(blocked => 
+      requestPath.startsWith(blocked) || requestPath.includes(blocked)
+    );
+    
+    if (isBlockedPath) {
+      console.warn(`🚫 Blocked access to sensitive path: ${requestPath}`);
+      return res.status(403).json({
+        error: 'Forbidden',
+        message: 'Access to this resource is not allowed',
+        path: requestPath
+      });
+    }
+
+    // 2. Permitir acceso a assets públicos
+    if (allowPublicAssets) {
+      const publicPaths = ['/assets', '/public', '/images', '/styles'];
+      const isPublicAsset = publicPaths.some(publicPath => 
+        requestPath.startsWith(publicPath)
+      );
+      
+      if (isPublicAsset) {
+        return next();
+      }
+    }
+
+    // 3. Validar extensiones de archivo
+    const fileExtension = path.extname(requestPath).toLowerCase();
+    
+    if (fileExtension && !allowedExtensions.includes(fileExtension)) {
+      console.warn(`🚫 Blocked file type: ${requestPath}`);
+      return res.status(403).json({
+        error: 'Forbidden',
+        message: 'File type not allowed',
+        extension: fileExtension
+      });
+    }
+
+    // 4. Prevenir path traversal attacks
+    const normalizedPath = path.normalize(requestPath);
+    if (normalizedPath.includes('..') || normalizedPath.includes('~')) {
+      console.warn(`🚫 Path traversal attempt: ${requestPath}`);
+      return res.status(403).json({
+        error: 'Forbidden',
+        message: 'Invalid path',
+        path: requestPath
+      });
+    }
+
+    // Todo está bien, continuar
+    next();
+  };
+}
+
+/**
+ * Middleware específico para proteger archivos del framework Slice.js
+ * PERMITE acceso cuando viene desde la propia aplicación (Referer válido)
+ * BLOQUEA acceso directo desde navegador o herramientas externas
+ */
+export function sliceFrameworkProtection(options = {}) {
+  const { 
+    port = 3000, 
+    strictMode = false,
+    allowedDomains = [] // Dominios personalizados permitidos
+  } = options;
+  
+  return (req, res, next) => {
+    const requestPath = req.path;
+
+    // Rutas del framework que requieren verificación
+    const frameworkPaths = [
+      '/Slice/Components/Structural',
+      '/Slice/Core',
+      '/Slice/Services'
+    ];
+
+    const isFrameworkFile = frameworkPaths.some(fwPath => 
+      requestPath.startsWith(fwPath)
+    );
+
+    if (!isFrameworkFile) {
+      return next();
+    }
+
+    // Verificar el origen de la petición
+    const referer = req.get('Referer') || req.get('Referrer');
+    const origin = req.get('Origin');
+    const host = req.get('Host');
+    
+    // Construir lista de orígenes válidos dinámicamente
+    const validOrigins = [
+      `http://localhost:${port}`,
+      `http://127.0.0.1:${port}`,
+      `http://0.0.0.0:${port}`,
+      `https://localhost:${port}`,
+      ...allowedDomains // Dominios personalizados del usuario
+    ];
+    
+    // Si hay un Host header, agregarlo automáticamente
+    if (host) {
+      validOrigins.push(`http://${host}`);
+      validOrigins.push(`https://${host}`);
+    }
+
+    // Verificar si la petición viene de un origen válido
+    const hasValidReferer = referer && validOrigins.some(valid => referer.startsWith(valid));
+    const hasValidOrigin = origin && validOrigins.some(valid => origin === valid);
+    const isSameHost = host && referer && referer.includes(host);
+    
+    // Permitir si viene desde la aplicación
+    if (hasValidReferer || hasValidOrigin || isSameHost) {
+      return next();
+    }
+
+    // En modo estricto, bloquear todo acceso sin referer válido
+    if (strictMode) {
+      console.warn(`🚫 Blocked direct framework file access: ${requestPath}`);
+      return res.status(403).json({
+        error: 'Framework Protection',
+        message: 'Direct access to Slice.js framework files is blocked',
+        tip: 'Framework files must be loaded through the application',
+        path: requestPath
+      });
+    }
+
+    // En modo normal (desarrollo), permitir pero advertir
+    console.warn(`⚠️  Framework file accessed without valid referer: ${requestPath}`);
+    next();
+  };
+}
+
+/**
+ * Middleware para logging de peticiones sospechosas
+ */
+export function suspiciousRequestLogger() {
+  const suspiciousPatterns = [
+    /\.\.\//, // Path traversal
+    /~/, // Home directory access
+    /\.env/, // Environment files
+    /\.git/, // Git files
+    /package\.json/, // Package files
+    /package-lock\.json/,
+    /node_modules/, // Dependencies
+  ];
+
+  return (req, res, next) => {
+    const requestPath = req.path;
+    
+    const isSuspicious = suspiciousPatterns.some(pattern => 
+      pattern.test(requestPath)
+    );
+
+    if (isSuspicious) {
+      const clientIp = req.ip || req.connection.remoteAddress;
+      console.warn(`⚠️  Suspicious request: ${requestPath} from ${clientIp}`);
+    }
+
+    next();
+  };
+}
+
+/**
+ * Middleware para bloquear acceso directo vía navegador (typing en la URL)
+ * pero permitir peticiones desde scripts (fetch, import, etc.)
+ */
+export function directAccessProtection(options = {}) {
+  const { protectedPaths = [] } = options;
+  
+  return (req, res, next) => {
+    const requestPath = req.path;
+    
+    const isProtectedPath = protectedPaths.some(protectedPath => 
+      requestPath.startsWith(protectedPath)
+    );
+    
+    if (!isProtectedPath) {
+      return next();
+    }
+
+    // Detectar acceso directo: 
+    // - No tiene Referer (usuario escribió la URL directamente)
+    // - Accept header indica navegación HTML
+    const referer = req.get('Referer');
+    const accept = req.get('Accept') || '';
+    
+    const isDirectBrowserAccess = !referer && accept.includes('text/html');
+    
+    if (isDirectBrowserAccess) {
+      console.warn(`🚫 Blocked direct browser access: ${requestPath}`);
+      return res.status(403).send(`
+        <!DOCTYPE html>
+        <html>
+        <head>
+          <title>Access Denied</title>
+          <style>
+            body { 
+              font-family: system-ui; 
+              max-width: 600px; 
+              margin: 100px auto; 
+              padding: 20px;
+            }
+            h1 { color: #d32f2f; }
+            code { 
+              background: #f5f5f5; 
+              padding: 2px 6px; 
+              border-radius: 3px;
+            }
+          </style>
+        </head>
+        <body>
+          <h1>🚫 Direct Access Denied</h1>
+          <p>This file cannot be accessed directly.</p>
+          <p>Path: <code>${requestPath}</code></p>
+          <p>Framework files are automatically loaded by the application.</p>
+          <p><a href="/">← Return to application</a></p>
+        </body>
+        </html>
+      `);
+    }
+
+    next();
+  };
+}
+
+export default {
+  securityMiddleware,
+  sliceFrameworkProtection,
+  suspiciousRequestLogger,
+  directAccessProtection
+};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "slicejs-web-framework",
-  "version": "2.2.5",
+  "version": "2.2.7",
   "description": "",
   "engines": {
     "node": ">=20"