Network Tools - Guía Completa

Versión: 3.6 Última actualización: 28-01-2026 Autor: Claude (Anthropic)

1. Introducción

Network Tools es un módulo frontend de CreaRack Pro que proporciona herramientas de diagnóstico y descubrimiento de red. Funciona en conjunto con el Local Agent para ejecutar operaciones de red desde la máquina del usuario.

1.1 Características Principales

1.2 Arquitectura

┌─────────────────────────────────────────────────────────────────┐
│                        Browser (CreaRack Pro)                    │
├─────────────────────────────────────────────────────────────────┤
│                                                                  │
│  ┌──────────────────┐  ┌──────────────────┐  ┌──────────────┐  │
│  │ Network Discovery│  │   Port Scanner   │  │ Health Check │  │
│  │     (Tab 1)      │  │     (Tab 2)      │  │   (Tab 3)    │  │
│  └────────┬─────────┘  └────────┬─────────┘  └──────┬───────┘  │
│           │                     │                    │          │
│           └─────────────────────┼────────────────────┘          │
│                                 │                               │
│                    ┌────────────▼────────────┐                  │
│                    │    NetworkTools.js      │                  │
│                    │       (v2.6)            │                  │
│                    └────────────┬────────────┘                  │
│                                 │                               │
└─────────────────────────────────┼───────────────────────────────┘
                                  │
                      HTTP/HTTPS  │  localhost:5050
                                  ▼
┌─────────────────────────────────────────────────────────────────┐
│                     Local Agent (v4.0.6)                        │
├─────────────────────────────────────────────────────────────────┤
│  /check         - TCP connectivity check                        │
│  /network/arp-table - Windows ARP cache + MAC OUI              │
│  /network/hostname  - DNS reverse lookup                       │
└─────────────────────────────────────────────────────────────────┘

2. Network Discovery

2.1 Enfoque Híbrido

El Discovery utiliza un enfoque híbrido similar a Angry IP Scanner para máxima detección:

2.2 Flujo Detallado

┌─────────────────────────────────────────────────────────────────┐
│ User clicks "Start Discovery"                                    │
└─────────────────────────────────────────────────────────────────┘
                              │
                              ▼
┌─────────────────────────────────────────────────────────────────┐
│ Phase 1: ICMP Ping Scan                                         │
│ ─────────────────────────────                                   │
│ • Envía ping a cada IP del rango (192.168.0.1-254)             │
│ • Timeout: 100ms por IP                                         │
│ • Dispositivos que responden → marcados como "ICMP"            │
│ • IMPORTANTE: Fuerza entradas en tabla ARP de Windows          │
└─────────────────────────────────────────────────────────────────┘
                              │
                              ▼
┌─────────────────────────────────────────────────────────────────┐
│ Phase 2: ARP Table Check                                        │
│ ─────────────────────────────                                   │
│ • Lee tabla ARP via Local Agent (/network/arp-table)           │
│ • Ejecuta: `arp -a` en Windows                                  │
│ • Obtiene: IP + MAC + Vendor (MAC OUI lookup)                  │
│ • Detecta dispositivos que no responden a ping                 │
│   (Smart TVs, Alexa, cámaras IP, etc.)                         │
└─────────────────────────────────────────────────────────────────┘
                              │
                              ▼
┌─────────────────────────────────────────────────────────────────┐
│ Phase 3: TCP Port Scan (hosts silenciosos)                      │
│ ─────────────────────────────                                   │
│ • Solo para IPs no detectadas en Phase 1-2                     │
│ • Puertos probados: 22, 80, 443, 23                            │
│ • Si algún puerto responde → host descubierto                  │
└─────────────────────────────────────────────────────────────────┘
                              │
                              ▼
┌─────────────────────────────────────────────────────────────────┐
│ Phase 4: Detailed Port Scan (todos los hosts)                   │
│ ─────────────────────────────                                   │
│ • Escanea puertos comunes en TODOS los hosts descubiertos      │
│ • Puertos: 22, 23, 80, 443, 8080, 8443                         │
│ • Identifica servicios disponibles                             │
└─────────────────────────────────────────────────────────────────┘
                              │
                              ▼
┌─────────────────────────────────────────────────────────────────┐
│ Phase 5: DNS Reverse Lookup                                     │
│ ─────────────────────────────                                   │
│ • Resuelve hostname para cada IP descubierta                   │
│ • Usa Local Agent (/network/hostname?ip=X)                     │
│ • Timeout: 1 segundo por lookup                                │
└─────────────────────────────────────────────────────────────────┘
                              │
                              ▼
┌─────────────────────────────────────────────────────────────────┐
│ Final: Sort & Display                                           │
│ ─────────────────────────────                                   │
│ • Ordena resultados por IP (numerically)                       │
│ • Muestra en tabla con columnas fijas                          │
│ • Guarda en localStorage para persistencia                     │
└─────────────────────────────────────────────────────────────────┘

2.3 Tabla de Resultados

Métodos de detección (badges):

Botones de acción:

2.4 Características de la Tabla

• Columnas fijas: Anchos predefinidos, no se expanden dinámicamente
• Redimensionable: Drag en borde derecho de columna para ajustar
• Fondo sólido: #0d1117 (no transparente)
• Separadores visibles: Bordes entre columnas

3. Persistencia

3.1 Almacenamiento

Los resultados de Discovery se persisten en localStorage:

// Key: 'networkToolsDiscoveryResults'
{
    timestamp: 1706380800000,    // Unix timestamp
    range: "192.168.0.1-254",   // Rango escaneado
    results: [                   // Array de dispositivos
        {
            ip: "192.168.0.1",
            mac: "00-11-22-33-44-55",
            hostname: "router.local",
            vendor: "Cisco Systems",
            ports: [22, 80],
            method: "ICMP"
        }
    ]
}

3.2 Restauración

Al cargar la página Terminal:

1. Se verifica si hay datos guardados
2. Si existen y son válidos, se restauran automáticamente
3. Se muestra indicador: "Restored: 11 devices (5m ago)"

3.3 Tiempo de Vida

• Datos válidos por 24 horas
• Después de 24h, se ignoran y no se restauran

4. Coordinación de Tabs

4.1 Problema

NetworkTools y TerminalApp comparten el mismo espacio visual. Sin coordinación, los contenedores se solapan.

4.2 Solución

// NetworkTools.activateTab() oculta contenedores de Terminal
document.querySelectorAll('.terminal-instance').forEach(c =>
    c.classList.remove('active')
);

// TerminalApp.activateTab() oculta contenedores de NetworkTools
document.querySelectorAll('.terminal-container').forEach(c =>
    c.style.display = 'none'
);

4.3 Flujo quickConnect

┌─────────────────────────────────────────────────────────────────┐
│ 1. Usuario hace clic en "Connect" en tabla Discovery           │
│ 2. NetworkTools.quickConnect(ip) se ejecuta                     │
│ 3. Se oculta contenedor Discovery (display: none)              │
│ 4. Se abre modal SSH con IP pre-llenada                        │
│ 5. Usuario confirma conexión                                    │
│ 6. Terminal se abre en NUEVA pestaña de TerminalApp            │
│ 7. NetworkTools pierde foco, Terminal toma control             │
└─────────────────────────────────────────────────────────────────┘

5. MAC OUI Database

5.1 Vendors Soportados

La base de datos incluye ~150+ fabricantes. Algunos ejemplos:

5.2 Actualización

La base de datos OUI está embebida en local_agent.py. Para actualizar:

1. Obtener OUI list de IEEE: https://standards-oui.ieee.org/
2. Agregar nuevos prefijos al diccionario MAC_OUI_DATABASE
3. Recompilar el Agent

6. Port Scanner

6.1 Modos de Operación

6.2 Uso (Scan Ports)

1. Seleccionar modo “Scan Ports”
2. Ingresar IP del dispositivo (o seleccionar de “Saved”)
3. Seleccionar preset de puertos
4. Click “Scan”

6.3 Uso (Find Port)

1. Seleccionar modo “Find Port”
2. Ingresar puerto a buscar (ej: 22, 80, 443)
3. Ingresar rango de IPs
4. Click “Find”

6.4 Presets de Puertos

6.5 Columnas de Resultados

7. Health Check

7.1 Propósito

Verificar conectividad SSH de múltiples dispositivos simultáneamente.

7.2 Uso

1. Seleccionar dispositivos (checkboxes)
2. Click “Check Health”
3. Ver resultados: Online/Offline por dispositivo

8. Archivos Relacionados

9. Troubleshooting

Discovery no detecta todos los dispositivos

1. Verificar que Local Agent está corriendo (http://localhost:5050/)
2. Verificar que el rango IP es correcto
3. Algunos dispositivos pueden tener firewall que bloquea todo

Tabla aparece con fondo transparente

1. Verificar CSS del contenedor (debe tener background: #0d1117)
2. Verificar z-index del contenedor

Terminal se abre en tab de Discovery

1. Verificar coordinación de tabs en terminal.js
2. Verificar que quickConnect oculta Discovery primero

Vendors aparecen como “Unknown”

1. El MAC del dispositivo no está en la base de datos OUI
2. Solicitar adición del vendor específico

10. Changelog

v3.6 (28-01-2026)

• Rapid Discover: New button for ultra-fast ping-only scan (Phase 1 only)
  • ICMP ping scan without ARP, TCP, port scan or hostname resolution
  • Simplified results table (IP, RTT, Status)
  • Larger batch size (15) for maximum speed
  • Ideal for quick host enumeration on large networks
• IP Range Limit Increased: From 256 to 1024 IPs
  • Supports /24 (256), /23 (512), and /22 (1024) subnets
  • Cross-subnet ranges now work correctly (e.g., 192.168.230.1-192.168.231.254)
• New Tab Button: Open tools in separate browser tabs
  • Button “New Tab” in each tab header
  • Opens in standalone mode (no sidebar, canvas only)
  • Original tab closes automatically
  • Allows multiple independent instances

v3.5 (28-01-2026)

• Terminal Page - Passive Empty State: Redesigned canvas background
  • Network Management Hub title with muted styling
  • Large CreaRack-Pro logo (72px, opacity 0.4)
  • Removed quick action cards for cleaner look
  • Positioned at top 35% for better balance
• Maps Page - Passive Empty State: Added matching design
  • Blueprint Design Studio title
  • Same CreaRack-Pro logo styling
  • Toolbars hidden when no map loaded
• UI Fix: Empty state display corrected when closing Network Tools tabs

v3.4 (28-01-2026)

• Port Scanner - Single IP Only: Simplified to accept only single IP targets
  • Removed IP Address column from results (redundant for single target)
  • Target input limited to 15 chars with IP pattern validation
  • Ranges are handled by Discovery, Port Scanner is for single hosts
• Port Scanner - Live Progress: Status bar shows ports being scanned in real-time
• Find Port - Live Progress: Status bar shows IP range being scanned
• Saved Dropdown: Fixed styling (missing CSS for delete buttons)
• Presets: Updated to single IPs only (Localhost, Gateways, Docker)

v3.3 (28-01-2026)

• Port Scanner - Improved ALL_PORTS: Reduced from ~1070 to ~100 practical common ports
  • Now includes all QUICK_PORTS (hierarchical: All > Quick > SSH)
  • Added databases (MySQL, PostgreSQL, MongoDB, Redis, etc.)
  • Added remote access (VNC, RDP, SSH variants)
  • Added web servers and management interfaces
  • Much faster scanning with better results
• Port Scanner UI: Updated dropdown labels to show port counts (SSH (22), Quick (15), All (~100))

v3.2 (28-01-2026)

• Reverted Grid.js: Removed Grid.js library due to compatibility issues
• Unified Tables: All three tools (Discovery, Port Scanner, Health Check) now use consistent native HTML tables
• Centralized Design: Uses createResultsTable() helper for consistent table generation
• Full Persistence: Port Scanner and Health Check now have same persistence level as Discovery
  • Results survive page reload and navigation
  • Automatic restore when reopening tabs
  • No time limit on saved results
• Performance: Lighter weight without external library dependency

v3.1 (28-01-2026)

• Port Scanner: Simplified presets to 3 options (SSH only, Quick 15, All)
• Port Scanner: “All” scans 1-1024 + common high ports (~1070 ports)
• Port Scanner: Added “Web Access” column with globe icon for web admin ports
• Port Scanner: Mode switch (Scan Ports / Find Port) now keeps Saved dropdown visible
• Port Scanner: Both modes share Saved dropdown for IP selection
• Config: Added WEB_PORTS constant for web admin detection
• Config: Added ALL_PORTS constant (1-1024 + high ports)
• Config: Removed unused COMMON_PORTS and EXTENDED_PORTS

v2.8 (28-01-2026)

• IP Range Management: New dropdown for saved IP ranges
• Favorites: Save frequently used ranges with custom names
• Recent history: Auto-saves last 5 used ranges
• Default presets: Common network ranges (192.168.0.x, 192.168.1.x, 10.0.0.x, 172.17.0.x)
• Delete any range: Including default presets
• Restore presets: Option to restore deleted default presets
• localStorage persistence: Saved ranges persist across sessions

v3.0 (28-01-2026)

• Port Scanner: Parallel batch scanning (same speed as Discovery)
• Port Scanner: Higher concurrency (batchSize * 2, up to 20 parallel)
• Port Scanner: Results persistence (1 hour validity)
• Health Check: Parallel batch scanning with Promise.all
• Health Check: Results persistence (1 hour validity)
• Ping Check: Uses ICMP ping endpoint for real RTT values
• Unified table CSS: RESULTS_TABLE_CSS shared by all tools
• Unified table method: createResultsTable() replaces createSimpleHeader()
• Faster timeouts: Uses QUICK_SCAN_TIMEOUT (1500ms) for all tools

v2.9 (28-01-2026)

• Port Scanner: Added saved targets dropdown (same UX as Discovery)
• Port Scanner: Favorites, recents, and presets for targets
• Port Scanner: Auto-save scanned targets to history
• Health Check: Improved toolbar with device count badge
• Health Check: Added icons to action buttons
• Consistent styling: All three tools now have consistent toolbar design

v2.7 (28-01-2026)

• Code audit: Removed dead code and commented console.log
• NETWORK_CONFIG: Centralized constants (timeouts, ports, colors)
• DISCOVERY_TABLE_CSS: Extracted duplicate CSS (~30 lines)
• Helper methods: createSimpleHeader(), createDiscoveryTable(), createDiscoveryRowElement()
• Unified rendering: renderHealthResults/renderPingResults now use renderCheckResults()
• Magic numbers: All hardcoded values documented in config

v2.6 (27-01-2026)

• Hybrid Discovery: ICMP + ARP + TCP approach
• ARP Table integration: Detect silent devices via MAC
• Hostname resolution: DNS reverse lookup
• Persistence: Results survive page reload
• Column resize: Manual resize via drag handles
• Tab coordination: Proper hide/show with TerminalApp
• Fixed columns: Static width instead of dynamic
• IP sorting: Results sorted by IP at end

v2.0 (26-01-2026)

• Initial release with Discovery, Port Scanner, Health Check

Documento relacionado:

• LOCAL_AGENT_GUIDE.md
• NETWORK_MANAGEMENT_IMPLEMENTATION.md

Véase también

• [[crearack-tech—backend—network-management-implementation]] — implementación de gestión de red
• [[crearack-tech—backend—multi-vendor-snmp-guide]] — SNMP multi-vendor en backend
• [[crearack-tech—backend—auto-provision-guide]] — guía técnica de Auto-Provision
• [[crearack—network—network-tools]] — herramientas de red disponibles
• [[crearack—network—discovery]] — discovery de red desde la app
• [[crearack—network—scripts-red]] — scripts de red automatizados