3dc45478f8a0054c417178839aa47f9e7db1e366
Chatbot El Día 🤖
Chatbot El Día es un asistente conversacional inteligente diseñado para integrarse en el sitio web del periódico eldia.com. Su objetivo es proporcionar a los usuarios respuestas rápidas y contextualizadas, mejorando la experiencia de usuario y la accesibilidad a la información.
El sistema se compone de tres partes principales:
- Un backend RESTful API desarrollado en ASP.NET Core, que contiene toda la lógica de IA.
- Un frontend para el widget del chat construido con React, TypeScript y Vite.
- Un frontend para el panel de administración también con React, TypeScript y Vite, para gestionar el conocimiento del bot.
Todo el sistema está diseñado para ser desplegado como un conjunto de microservicios utilizando Docker y Docker Compose.
🧠 Funcionalidades Principales
El chatbot está construido sobre una arquitectura de "Router de IA" que le permite entender la intención del usuario y utilizar la herramienta adecuada para cada pregunta.
🤖 Arquitectura de IA Conversacional
- Router de Intenciones: Cada pregunta del usuario pasa primero por un "Router de IA" que, basándose en la conversación actual, determina la intención del usuario (
Artículo,Base de ConocimientooNoticias de Portada). Esto permite al bot decidir si debe continuar una conversación, buscar en su conocimiento interno o buscar noticias de última hora. - Memoria Conversacional (Resumen Dinámico): Para seguir el hilo de la conversación y entender preguntas de seguimiento (ej: "¿y con Google?"), el sistema utiliza a la IA para generar y mantener un resumen conciso de la conversación. Este resumen se envía en cada petición, dándole al bot una "memoria" a corto plazo eficiente y a bajo coste.
- Base de Conocimiento Unificada: El conocimiento del bot se obtiene de múltiples fuentes y se unifica en un solo contexto para la IA:
- Contexto de Base de Datos (
ContextoItems): Información estática y clave-valor (ej: teléfonos, direcciones) gestionada desde el panel de admin. - Fuentes de Contexto Dinámicas (
FuentesDeContexto): Permite a los administradores añadir cualquier URL (ej: la página de FAQs o de precios de suscripción) como una fuente de conocimiento. El bot scrapea estas páginas en tiempo real para obtener respuestas.
- Contexto de Base de Datos (
- Contexto Espacio-Temporal: El bot está "consciente" de su ubicación (La Plata, Argentina) y de la fecha y hora actuales, lo que le permite entender preguntas como "¿qué pasó hoy?" o "¿dónde es el evento?".
- Búsqueda y Síntesis en Noticias: Cuando se pregunta por una noticia de portada, el bot utiliza un proceso de dos pasos: 1) Una IA de búsqueda encuentra el artículo más relevante. 2) Una IA de síntesis lee el artículo y genera un resumen conciso y útil, invitando al usuario a continuar la conversación.
⚙️ Panel de Administración
- Autenticación Segura con JWT: Acceso protegido para la gestión del conocimiento del bot.
- Gestor de Contexto: Un CRUD completo para la información estática del bot (tabla
ContextoItems). - Gestor de Fuentes: 🚀 Potente interfaz para añadir, editar y eliminar fuentes de conocimiento dinámicas (URLs). Permite especificar un selector CSS/XPath para un scraping más preciso.
- Visor de Logs de Conversación: Una tabla que muestra las últimas 200 interacciones de los usuarios con el bot, ordenadas por fecha, para análisis y mejora continua.
💬 Interfaz de Usuario (Widget)
- Interfaz Moderna y Fluida: Construida con Vite, React y TypeScript.
- Streaming de Respuestas: El texto del bot aparece progresivamente, simulando una experiencia de escritura en tiempo real.
- Indicador de "Escribiendo...": Una animación de puntos sutil que proporciona feedback visual mientras el bot procesa la respuesta.
- Indicador de Contexto de Artículo: Cuando la conversación se centra en una noticia, una barra informativa muestra el título del artículo, que además es un hipervínculo a la nota original.
- Persistencia Completa: El historial de mensajes, el resumen de la conversación y el contexto del artículo activo se guardan en
localStorage, por lo que la conversación sobrevive a recargas del navegador. - Renderizado de Markdown: Las respuestas del bot que contienen enlaces son renderizadas como hipervínculos clickeables.
🛠️ Stack Tecnológico
Backend (ChatbotApi/)
- Framework: ASP.NET Core 10
- Lenguaje: C#
- Acceso a Datos: Entity Framework Core
- Base de Datos: Microsoft SQL Server
- Autenticación: JWT Bearer Token
- Web Scraping: HtmlAgilityPack
- Modelo de IA: Google Gemini
Frontend (Widget y Admin)
- Framework/Librería: React 19
- Lenguaje: TypeScript
- Componentes UI (Admin): Material-UI
- Comunicación API: Axios
- Build Tool: Vite
Despliegue y Orquestación
- Contenerización: Docker
- Orquestación: Docker Compose
- Proxy Inverso y Servidor Estático: Nginx
🚀 Puesta en Marcha (Getting Started)
Siga estos pasos para configurar y ejecutar el proyecto en un entorno de desarrollo o producción.
Prerrequisitos
- .NET SDK 10.0 o superior.
- Node.js v24.x (LTS) o superior.
- Microsoft SQL Server (2019 o superior).
- Docker y Docker Compose (para despliegue en producción).
1. Clonar el Repositorio
git clone https://repo.eldiaservicios.com/dmolinari/Chatbot-ElDia.git
cd Chatbot-ElDia
Description
Asistente conversacional inteligente diseñado para integrarse en el sitio web del diario, www.eldia.com
Languages
C#
59.6%
TypeScript
36.2%
CSS
3%
JavaScript
0.8%
HTML
0.4%