Al cargar el div con ajax, la escritura se detiene hasta que carga

[El-Duque]

Muy buenas, a ver si me puedo explicar:

Estoy desarrollando un chat de soporte del tipo Zopin, liveChat, etc, los mensajes se cargan con AJAX cada 5 segundos, pero si estas escribiendo en el campo de texto que está en una capa superior y ésta no se recarga, la escritura se paraliza un un instante, es muy cortito, pero lo suficiente para que te falte una letra.

Estoy usando también para los efectos visuales JQuery.

¿Alguien podría decirme que se puede hacer para que no se pare la ejecución del resto en la fracción de segundo que recarga el DIV?

Un saludo y gracias.

[PHPeros]

:3 Si no pones código...

[El-Duque]

Bueno el código no es nada que se salga de lo común, pero aquí va:

Código:

<div id="chat"></div>
<textarea id="Mensaje"></textarea>

<script>
// Llamada para mostrar cada 5 segundos el contenido en el DIV
setInterval(aMiraChat, 5000);

$(document).ready(function(){ 
       $("#Mensaje").click(){
            // Aquí va a la BD
       }
});

function aMiraChat()
{
	// Llamada a la típica función de AJAX para que cargue el nuevo contenido al DIV
        Carga('chat.php','Chat','POST');
}
</script>

[PHPeros]

Y dices que se corta mientras escribes? Más que el propio div se debería "recargar" el texto de la conversación no?
Saludos!

[El-Duque]

Veo la diferencia pero no se como hacerlo, pero creo que lo que produce ese retardo-paralización es la llamada propia de AJAX, y la verdad no se como resolverlo.

He visto en otras aplicaciones que esto no ocurre y me estoy quebrando la cabeza.

Un saludo.

[PHPeros]

Como no has puesto nada más allá de código te cuestiono un par de cosas:

¿Como recuperas los datos que te returna tu archivo PHP?
¿Con qué función las imprimes?

Debería tener la siguiente estructura: (mas o menos)

Código Javascript:

$(document).ready(function() {
    $("div_id").click(function() {
        $.ajax({
            url : "procesar.php",
            success : function (data) {
                $("div_id").html(data);
            }
        });
    });
});
 

Saludos

[El-Duque]

La imprimo desde el propio archivo con php mediante un echo.

[PHPeros]

Como lo haces en el script? Si no como retomas los datos? Una cosa es lo que devuelve el archivo php (data) mediante echo y luego la forma en la como lo imprimes con jquery mediante success su parametro data... Muy seguramente el problema esté ahí ya que vuelves a cargar el div.

[El-Duque]

en chat.php hago una consulta a la BD donde muestro una tabla que contiene la conversación ordenada, que es impresa directamente con echo.

En efecto cargo el DIV entero.

[El-Duque]

Me sería de gran ayuda ver en ejecución algún código que haga la llamada a los datos periódica y que haya un campo de texto para escribir el mensaje y ver que no se corta la escritura en el momento de la petición, no se si te viene a la cabeza algún ejemplo, porque yo he encontrado las típicas soluciones de ZOPIM, LIVEChat, LiveBeep, pero su código está muy ofuscado y no veo como lo resuelven.

Un saludo.

[PHPeros]

Ahí quería llegar amigo... Para evitar eso en vez de html, deberías usar xml o texto plano con saltos de línea para poder tomar referencia. Ej:

Código XML:

<mensajes>
<m1>Hola que tal?</m1>
<m2>Muy bien</m2>
<m3>Me alegro!</m3>
</mensajes>
 

Sera un poco difícil pero merece la pena.

[PHPeros]

No había visto tu anterior mensaje... Pensaba que esto era un tipo de prueba, pero si quieres que tu sitio tenga usuarios reales que chateen y haya buen rollo, olvida los códigos y contrata uno de esos servicios que la verdad tienen muy buena pinta. Ciertamente la seguridad de tu sitio con un código de 20 líneas va a ser pésima y van a espiar a tus usuarios sin ningún nivel de encriptación

[El-Duque]

Si lo que comentas es que debería usar JSon realmente.

Es una simple prueba lo que estoy haciendo, cuando algo me entra en la cabeza hasta que no lo resuelvo no paro.

[ocp001a]

Cargar todos los mensaje continuamente, entre más mensaje y más usuarios haya la respuestá será cada vez más lenta.

Te sugiero el esquema:

En cada mensaje en la bd coloca un estado (leído/no leído)
Cada vez que busques nuevos mensajes sólo busca los no leídos
Devuelve los mensajes nuevo, marcándolos como leídos.
Agrega (append) los nuevos mensajes al div, no lo dibujes completo.

[PHPeros]

Sí json y xml son los mejores recursos. Ahí ya no me meto porque no sé. Pregunta en otro foro.

(No te lies mucho)

[El-Duque]

Leyendo tu esquema veo que así no sería necesario tirar de JSon ni de XML, es una solución muy buena, la voy a probar y te cuento, muchas gracias.

[PHPeros]

Voy a buscar + a fondo...

[PHPeros]

Una buena idea para ahorrar espacio sería almacenar el html/texto extraído de la db en una variable, luego borrar el registro y hacer el echo de la variable. De otra forma cuando el usuario actualice los mensajes se irán o quedarán cacheados si lo indicamos. ¿Que opinais?

[ocp001a]

Iniciado por PHPeros

Una buena idea para ahorrar espacio sería almacenar el html/texto extraído de la db en una variable, luego borrar el registro y hacer el echo de la variable. De otra forma cuando el usuario actualice los mensajes se irán o quedarán cacheados si lo indicamos. ¿Que opinais?

Depende de qué se quiera lograr, pero entonces colocarías la conversación de todos los usuarios en sesión, lo que va a aumentar estos archivos, no creo que sea práctico.



En mi aplicación, los mensajes se almacenan en forma de texto plano con la menor cantidad de datos (fecha, usuario origen, destino, mensaje y estado)

Un script en js se encarga de gestionar el estilo y colores de la conversación, esto evita guardar html en la bd, y acelera las respuestas.

Por defecto cuando el usuario está en el chat sólo se le muestran los mensajes no leídos, y tiene un botón que le puede mostrar toda la conversación. Si el usuario cierra el navegador, a la siguiente vez que entra verá las conversaciones en limpio, salvo que recupere la conversación que quiera.

Dado que mi aplicación es para una intranet y la empresa tiene cierta paranoia, no se borra ningún mensaje, por lo que para acelerar las consultas hay dos tablas, una tabla histórica con todos los mensajes anteriores al día actual y la del día actual. Por defecto sólo se consulta la tabla del día actual. Si se pide el histórico, se une el resultado de ambas tablas. Por las noches un cronjob pasa el contenido de la tabla del día a la tabla histórica, por lo que la tabla del día actual amanece limpia diariamente.

Con todo esto, y pese a que la empresa tiene más de 100 usuarios conectados al mismo tiempo (de una plantilla de 400 empleados) la tabla del chat durante todo 2012 no pasó de 80 mb.

[jgdev13]

¿Podrías mostrar la función Carga ?