javascript - validacion - validar formulario html5
Eventos enviados por el servidor: ¿cómo se vuelve a conectar automáticamente en una forma de navegador cruzado? (3)
Ejecuté una prueba con tu código en mi sitio y todo funciona según lo esperado con Firefox 44.0.2 y php 5.5. Me encontré con algo interesante en la red de desarrolladores de Mozilla, que dice que no necesariamente puedes decir cuál fue el mensaje de error en Firefox después de v22. Tal vez su declaración de cambio en la comprobación de errores es lo que le está decepcionando. Aquí hay un enlace al artículo . Consulte la sección de manejo de errores.
Mi código php es idéntico al tuyo. Por si acaso hice algo diferente, aquí está mi código html.
<!DOCTYPE>
<html>
<head>
<title>SSE Test</title>
<meta charset="utf-8" />
<script>
var evtSource = new EventSource("sse.php");
evtSource.onerror = function(event){
var txt;
switch( event.target.readyState ){
case EventSource.CONNECTING:
txt = ''Reconnecting...'';
break;
}
console.log(txt);
};
</script>
</head>
<body></body>
</html>
Implemento un código para consultar la base de datos para cualquier cambio y para enviar un evento. Aquí está el código de mi script PHP
header("Content-Type: text/event-stream");
header(''Cache-Control: no-cache'');
//****Some code here to query the database
echo "event: message/n";
echo "data: change_from_database /n";
echo "/n/n";
ob_flush();
flush();
Confío en que el navegador se vuelva a conectar automáticamente cada vez que se cierre la conexión, por lo que no implemento ningún bucle en el código de mi servidor. Además, aprendí de este hilo que la implementación de un ciclo infinito tiene muchas desventajas.
Así que todo funciona bien desde el lado del cliente: el navegador se vuelve a conectar cada vez que se cierra la conexión y se dispara un evento cada vez que el servidor envía uno; bien, excepto para Firefox (40.0.2) que no se vuelve a conectar. Sé que no es así porque escribí algunos códigos de comprobación de errores de JavaScript para probar esto:
var evtSource = new EventSource("../sse.php");
evtSource.onerror = function(event){
var txt;
switch( event.target.readyState ){
case EventSource.CONNECTING:
txt = ''Reconnecting...'';
break;
}
console.log(txt);
}
Entonces, después de cada segundo, la consola en Chrome muestra, por ejemplo, "Reconnecting"
. Firefox, por otro lado, se reconecta una vez y nunca más vuelve a hacerlo.
¿Cómo escribo código para hacer que esto funcione en Firefox, y tal vez en otros navegadores que admiten eventos enviados por el servidor pero que no se vuelven a conectar automáticamente?
Puede usar un relleno policial como este https://github.com/Yaffle/EventSource, que debería agregar la funcionalidad del origen del evento a los navegadores no compatibles.
Con la versión más reciente del navegador Firefox (44.0.2), tu código funciona perfectamente. Sin embargo, puede reinicializar su objeto EventSource
en el controlador de errores de esta manera:
var evtSource = new EventSource("../sse.php");
var evtSourceErrorHandler = function(event){
var txt;
switch( event.target.readyState ){
case EventSource.CONNECTING:
txt = ''Reconnecting...'';
break;
case EventSource.CLOSED:
txt = ''Reinitializing...'';
evtSource = new EventSource("../sse.php");
evtSource.onerror = evtSourceErrorHandler;
break;
}
console.log(txt);
}
Pero no te recomiendo que hagas esto porque tu código no usa los beneficios de mantener viva la conexión (como escribiste, conoces el ciclo infinito) para que el navegador realice sondeos simples (puedes ver esto en la pestaña de red) . No veo ninguna razón para usar SSE sobre AJAX sin mantener una conexión permanente, lo que obviamente es difícil de mantener con PHP. Así que supongo que usar el simple sondeo AJAX en esta situación.