EventSource永久自动重新连接

Question

我在项目前端使用JavaScript EventSource.

有时,浏览器和服务器之间的连接失败或服务器崩溃.在这些情况下,EventSource会在3秒后尝试重新连接,如文档中所述.

但它只尝试一次.如果仍然没有连接,则EventSource将停止尝试重新连接,并且用户必须刷新浏览器窗口才能再次连接.

我怎么能防止这种行为？我需要EventSource尝试永远重新连接,而不仅仅是一次.

浏览器是Firefox.

Answer 1

我通过实现保持活动系统来解决这个问题; 如果浏览器重新连接我,这一切都很好,但我认为有时候它不起作用,而且不同的浏览器可能表现不同.

我在本书的第五章(Blatant插件,在O'Reilly这里找到它:使用HTML5 SSE的数据推送应用程序)上花了几页,但是如果你想要一个不需要任何后端的非常简单的解决方案更改,设置一个全局计时器,将在30秒之后触发.如果它触发,那么它将终止EventSource对象并创建另一个.最后一个难题是在你的事件监听器中:每次从后端获取数据时,杀死计时器并重新创建它.即只要您至少每30秒获得一次新数据,定时器就永远不会触发.

这是一些显示这个的最小代码:

var keepAliveTimer = null;

function gotActivity(){
  if(keepaliveTimer != null)clearTimeout(keepaliveTimer);
  keepaliveTimer = setTimeout(connect, 30 * 1000);
}

function connect(){
  gotActivity();
  var es = new EventSource("/somewhere/");
  es.addEventListener('message', function(e){
    gotActivity();
    },false);
}
...
connect();

另请注意,我在连接之前调用了gotActivity().否则,在它有机会提供任何数据之前失败或死亡的连接将被忽视.

顺便说一句,如果你也能够改变后端,那么在安静25-30秒之后发送一条空白消息("心跳")是值得的.否则前端将不得不假设后端已经死亡.当然,如果您的服务器发送的间隔时间不超过25-30秒,则无需执行任何操作.

如果您的应用程序依赖于Event-Last-Id标头,请认识到您的保持活动系统必须模拟这个; 这涉及更多.