Php 我在Chrome中看不到带有onmessage方法的HTML5 EventSource事件_Php_Javascript_Html

Php 我在Chrome中看不到带有onmessage方法的HTML5 EventSource事件

php javascript html

Php 我在Chrome中看不到带有onmessage方法的HTML5 EventSource事件,php,javascript,html,Php,Javascript,Html,我试着用一个小例子来使用EventSource对象在客户端，我有一个包含以下脚本的页面： <!DOCTYPE html> <html> <head> <meta charset="UTF-8" /> <title>Welcome!</title> </head> <body> <div id="

我试着用一个小例子来使用

EventSource

对象

在客户端，我有一个包含以下脚本的页面：

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8" />
        <title>Welcome!</title>
    </head>
    <body>
        <div id="result"></div>
        <script type="text/javascript">
        var sse = new EventSource('event-source.php');
        
        sse.onmessage = function(event) {
            console.log(event.data);
            document.getElementById("result").innerHTML+=event.data + "<br>";
        }

        sse.onerror = function(event) {
        console.log(event);
        }
        
        </script>
    </body>
</html>


欢迎
var sse=neweventsource（'event-source.php'）；
sse.onmessage=函数（事件）{
console.log（事件数据）；
document.getElementById（“结果”）.innerHTML+=event.data+“
”；
}
sse.onerror=功能（事件）{
console.log（事件）；
}

脚本在服务器上调用event-source.php。下面是event-source.php：

<?php
header('Content-type: text/event-stream');
echo 'data: '.time().PHP_EOL;

在onmessage
中，您正在调用想要的对象属性，为什么不在onerror中执行相同的操作？

我认为您的onerror
应该如下所示：
   sse.onerror = function(event) {
      console.log(event.message);
   }

说明：
-此链接表示“当出现问题（…）时，将生成一个错误事件。”
因此，在自定义错误处理时，您应该了解ErrorEvent结构：）它是这样的：
   sse.onerror = function(event) {
      console.log(event.message);
   }

ErrorEvent.message（只读）是包含
描述问题的可读错误消息
ErrorEvent.filename（只读）是包含名称的DOMString
发生错误的脚本文件的
ErrorEvent.lineno（只读）是包含行的整数
发生错误的脚本文件的编号
ErrorEvent.column（只读）是包含列的整数
发生错误的脚本文件的编号
ErrorEvent.error（只读）是一个
对事件表示关注
更多信息和来源：
客户端
<script>
if(typeof(EventSource) !== "undefined") {
var source = new EventSource("/html/demo_sse.php");
source.onopen = function() {
document.getElementById("myH1").innerHTML = "Getting server updates";
};
source.onmessage = function(event) {
document.getElementById("myDIV").innerHTML += event.data + "<br>";
};        
} else {
document.getElementById("myDIV").innerHTML = "Sorry, your browser does not support server-sent events...";
}
</script>


if（typeof（EventSource）！=“未定义”）{
var source=neweventsource（“/html/demo_sse.php”）；
source.onopen=函数（）{
document.getElementById（“myH1”）.innerHTML=“获取服务器更新”；
};
source.onmessage=函数（事件）{
document.getElementById（“myDIV”）.innerHTML+=event.data+“
”；
};        
}否则{
document.getElementById（“myDIV”）.innerHTML=“对不起，您的浏览器不支持服务器发送的事件…”；
}

服务器
<?php
    header('Content-Type: text/event-stream');
    header('Cache-Control: no-cache');

    $time = date('r');
    echo "data: The server time is: {$time}\n\n";
    flush();
    ?>

这个话题太老了。但即使在今天，我有时也会看到在EventSource中使用onmessage
时的混合行为
到目前为止，我已经成功地使用了以下变体
<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8" />
        <title>Welcome!</title>
    </head>
    <body>
        <div id="result"></div>
        <script type="text/javascript">
        var sse = new EventSource('event-source.php');

        sse.addEventListener('message', function(event) {
            console.log(event.data);
            document.getElementById("result").innerHTML+=event.data + "<br>";
        });

        
        sse.addEventListener('error', function(event) {
            console.log(event);
        });

        </script>
    </body>
</html>


欢迎
var sse=neweventsource（'event-source.php'）；
sse.addEventListener（“消息”，函数（事件）{
console.log（事件数据）；
document.getElementById（“结果”）.innerHTML+=event.data+“
”；
});
sse.addEventListener（'error'，函数（事件）{
console.log（事件）；
});
在chrome 22版中试用过，效果不错。在我的系统中没有，我在Ubuntu 12.04上运行，我在Ubuntu 12.04、chrome 20和chrome 22上试用过。此外，在Firefox上调用onmessage et onerror，但事件数据显示正确…在Chrome 32.0.1700.102上运行良好。我的PHP代码发送回数据时没有像以前那样使用消息
信封，但没有保持打开的连接-它每秒重新建立连接可能不相关，但是，当通过HTTP连接时，可以进行的连接数量是有限的：因此最好关闭连接，例如onbeforeuload call sse.close（）