HTML5Server-Sent服务器发送事件

Posted 2020-07-25 嘉禾世兴

tags:

篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了HTML5Server-Sent服务器发送事件相关的知识，希望对你有一定的参考价值。

Server-Sent 事件 - 单向消息传递

Server-Sent 事件指的是网页自动获取来自服务器的更新。

以前也可能做到这一点，前提是网页不得不询问是否有可用的更新。通过服务器发送事件，更新能够自动到达。

<!DOCTYPE html>
<html>
<body>
<h1>获得服务器更新</h1>
<div id="result"></div>

<script>
if(typeof(EventSource)!=="undefined")
  {
  var source=new EventSource("/example/html5/demo_sse.php");
  source.onmessage=function(event)
    {
    document.getElementById("result").innerHTML+=event.data + "<br />";
    };
  }
else
  {
  document.getElementById("result").innerHTML="Sorry, your browser does not support server-sent events...";
  }
</script>

</body>
</html>

创建一个新的 EventSource 对象，然后规定发送更新的页面的 URL（本例中是 "demo_sse.php"）
每接收到一次更新，就会发生 onmessage 事件
当 onmessage 事件发生时，把已接收的数据推入 id 为 "result" 的元素中

EventSource 对象

事件	描述
onopen	当通往服务器的连接被打开
onmessage	当接收到消息
onerror	当错误发生

以上是关于HTML5Server-Sent服务器发送事件的主要内容，如果未能解决你的问题，请参考以下文章

Spring boot SSE（服务器发送事件）：如何动态发送响应

服务器发送的事件在 Chrome 中不起作用