🌐 Clientes HTTP e Interceptores

Gestión centralizada de red, inyección de tokens JWT y manejo de sesiones.

Dado que el HUB es el punto central que conecta con múltiples backends independientes (Motor Transaccional, Generador de Reportes, Pipeline ETL, Sistema de Gestión de Identidad (IAM)), la arquitectura de red requiere un control estricto sobre las peticiones salientes.

Para lograr esto, el frontend utiliza instancias aisladas de Axios para cada microservicio, centralizadas en la carpeta lib/.

​

🛡️ Interceptores de Seguridad (IAM)

La comunicación con el microservicio de Gestión de Identidad (IAM) y las rutas protegidas requieren la validación constante de credenciales. En lugar de adjuntar manualmente el token en cada petición, la instancia iamApi.js utiliza interceptores de red (interceptors.request).

Antes de que cualquier petición abandone el navegador, el interceptor inyecta automáticamente el token JWT (si existe) y configura la cabecera Accept-Language basándose en la ruta actual del usuario para soportar el cambio de idioma en las respuestas del servidor.

// Inyección dinámica en lib/iamApi.js
iamApi.interceptors.request.use((config) => {
    const token = localStorage.getItem('jwt_token');
    if (token) {
        config.headers.Authorization = `Bearer ${token}`;
    }

    const isEnglish = window.location.pathname.startsWith('/en');
    config.headers['Accept-Language'] = isEnglish ? 'en' : 'es';

    return config;
});

​

⏱️ Manejo de Sesión Expirada (401 Unauthorized)

Para evitar que un usuario permanezca en una vista privada si su token JWT ha expirado o es inválido, la instancia de Axios implementa un interceptor de respuesta (interceptors.response).

Si el servidor responde con un código de estado HTTP 401, el interceptor limpia automáticamente las credenciales del almacenamiento local (localStorage) y redirige de manera segura al usuario a la pantalla de inicio de sesión correspondiente, respetando el idioma actual de la sesión.

// Manejo global de expiración en lib/iamApi.js
iamApi.interceptors.response.use(
    (response) => response,
    (error) => {
        if (error.response && error.response.status === 401) {
            localStorage.removeItem('jwt_token');
            localStorage.removeItem('user');
            
            const isEnglish = window.location.pathname.startsWith('/en');
            const loginUrl = isEnglish ? '/en/iam' : '/iam';
            
            if (window.location.pathname !== loginUrl) {
                window.location.replace(loginUrl);
            }
        }
        return Promise.reject(error);
    }
);

​

🔌 Instancias de Red Desacopladas

Para mantener los dominios de red completamente aislados y evitar efectos colaterales entre microservicios, el HUB declara clientes de Axios independientes con sus propias bases de URL y configuraciones de tiempo de espera (timeouts) adaptados a la naturaleza de cada procesamiento.

// Configuración de red para el pipeline ETL en lib/logiflowApi.js
const logiflowApi = axios.create({
    baseURL: import.meta.env.PROD 
        ? '[https://logiflow-api-fx7o.onrender.com/api/v1/etl](https://logiflow-api-fx7o.onrender.com/api/v1/etl)'
        : 'http://localhost:8081/api/v1/etl',
    headers: {
        'Content-Type': 'application/json'
    }
});