XXVIII. Que la conversación no se borre al recargar la página (pero tampoco se quede para el siguiente)

Este era uno de esos fallos pequeños y molestos que llevaban ahí desde el principio: si el alumno recargaba la página por lo que fuera — un tropiezo con F5, el navegador restaurando la pestaña después de un cuelgue, o simplemente cerrar y volver a abrir sin querer — toda la conversación con PINSAPIA desaparecía. Sin aviso, sin posibilidad de recuperarla. Nada grave, pero sí incómodo, y era la queja de usabilidad más obvia que quedaba pendiente.

La solución sencilla, y la trampa que había que evitar

Lo evidente es guardar el historial en el navegador con localStorage, que es justo lo que ya usábamos para el código de acceso y el identificador de dispositivo. Pero aquí hay una diferencia importante: el código de acceso y el identificador de dispositivo no cuentan nada personal ni identificable — son solo una contraseña compartida y un número aleatorio. La conversación del alumno es otra cosa: puede llevar preguntas concretas, dudas, hasta datos que el propio alumno decida escribir sin que se le haya pedido.

localStorage no caduca nunca por sí solo. Si lo hubiéramos usado aquí, la conversación de un alumno se habría quedado guardada en ese ordenador del aula indefinidamente — hasta que alguien la borrara a mano — esperando a que el siguiente alumno que se sentara delante abriera la página y se la encontrara ahí. En un instituto, con ordenadores compartidos entre varias clases al día, eso es un problema real, no una posibilidad remota.

La solución no es más complicada, solo hay que usar la herramienta correcta: sessionStorage. Se comporta igual que localStorage para guardar y leer datos, con una diferencia clave — desaparece solo en cuanto se cierra la pestaña o el navegador. Sobrevive a un simple recargo de página (que es exactamente lo que se pedía resolver) pero no sobrevive a que el alumno termine y cierre. Es la pieza justa para este problema concreto.

Cómo funciona

Cada vez que se añade un mensaje al historial (una pregunta del alumno, o una respuesta de PINSAPIA), se guarda una copia en sessionStorage. Al abrir o recargar la página, si hay algo guardado en la pestaña actual, se recupera y se repintan todas las burbujas de la conversación, tal como estaban — incluido el botón de escuchar en las respuestas de PINSAPIA. Si no hay nada guardado (primera visita, o pestaña nueva), el chat empieza vacío, como siempre.

Un límite honesto, pequeño pero real

La línea de “Fuentes” que añadimos en la entrada anterior (ver XXVII) no se guarda junto con el historial. Así que si recargas la página a mitad de conversación, las respuestas antiguas que se repintan no vuelven a mostrar de qué documento venían — solo las respuestas nuevas, a partir de ahí, sí la tendrán. No es un fallo: es una simplificación deliberada para no complicar el guardado con datos que no son estrictamente necesarios para seguir la conversación.

Casos de prueba

Probado con una batería de 10 comprobaciones antes de subirlo a ROCKY:

• Se guarda el historial completo, en el mismo orden en que se escribió.
• Sin nada guardado todavía (primera visita), no se repinta nada y el chat se queda vacío, como es debido.
• Con un historial de una sesión anterior, se repintan las burbujas correspondientes, y el botón de escuchar se añade solo a las respuestas de PINSAPIA, no a las preguntas del alumno.
• Si lo guardado en sessionStorage está corrupto (no es un JSON válido), no se rompe nada: el historial simplemente se queda vacío en vez de a medias.
• Si lo guardado es un JSON válido pero no es una lista de mensajes (por ejemplo, por algún cambio futuro que lo estropee), tampoco se fuerza nada raro: se ignora y el chat sigue funcionando con normalidad.

Siguiente paso

Confirmarlo en el uso real: escribir algo, recargar a mitad de conversación con F5, y ver que sigue ahí. Y, para comprobar que el aislamiento funciona como se espera, abrir una pestaña nueva aparte y ver que esa empieza en blanco, sin la conversación de la otra.