Question

我不知道如何使用javascript从EventSource捕获事件。我这样做，但是＆＃34;跑步＆＃34;永远不会出现在控制台中。

        var es = new EventSource(myUrl);

        es.addEventListener("time", function(e){
         console.log("running")
        }, false);

        es.onopen = function(){
          console.log('open')
        },
        es.onerror = function(e){
          console.log('error')
        },

登录＆＃39;打开＆＃39;我在浏览器控制台的网络部分看到它已连接并每5秒更新一次，当我卷曲到服务器时，我每5秒钟收到一次响应：

:ok

event: time
data: {"data":"tick","ttl":"60","published_at":"2014-08-22T08:26:17.624Z","id":"53ff6e065067544829091287"}

event: time
data: {"data":"tick","ttl":"60","published_at":"2014-08-22T08:26:22.630Z","id":"53ff6e065067544829091287"}

如何在JS中捕获此事件？

Answer 1

首先是坏消息：它看起来是正确的。

标准允许冒号后的空格。但是没有充分的理由使用它，它只是浪费了一个字节的带宽，所以我要尝试的第一件事是删除空间。如果这确实解决了它，您可能正在处理浏览器错误（请告诉我们）。

我尝试的第二件事是使用默认事件。所以：

服务器端：停止发送event:time行。
客户端：更改为使用＆＃39;消息＆＃39;事件处理程序。

像这样：

es.addEventListener("message", function(e){
  console.log("running");
  }, false);

如果这不能解决问题，请开始查看您要发送的空白区域。如果确实修复了它，那么事件标题会发生奇怪的事情。

但是，您也可以支持此问题。我个人从不使用event:行，而是始终将事件类型放在JSON数据中。您的"data":"tick"可能已经这样做了，但如果没有，它可以像发送这样的数据一样简单：

data:{"event":"time","data":"tick","ttl":"60","published_at":"2014-08-22T08:26:17.624Z","id":"53ff6e065067544829091287"}

data:{"event":"time","data":"tick","ttl":"60","published_at":"2014-08-22T08:26:22.630Z","id":"53ff6e065067544829091287"}

data:{"event":"somethingElse","this":"and","that":[9,8,7]}

在添加事件侦听时，EventSource不会触发

1 个答案: