Server-Sent Events demo
时间: 2023-09-04 20:10:10 浏览: 70
以下是一个基本的Server-Sent Events示例:
HTML代码:
```
<!DOCTYPE html>
<html>
<head>
<title>Server-Sent Events Demo</title>
<meta charset="UTF-8">
</head>
<body>
<div id="sse">
<h1>Server-Sent Events Demo</h1>
</div>
<script>
if(typeof(EventSource)!=="undefined") {
var source = new EventSource("demo_sse.php");
source.onmessage = function(event) {
document.getElementById("sse").innerHTML += event.data + "<br>";
};
} else {
document.getElementById("sse").innerHTML = "Sorry, your browser does not support server-sent events...";
}
</script>
</body>
</html>
```
PHP代码:
```
<?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();
?>
```
在上面的示例中,HTML页面通过JavaScript创建一个新的EventSource对象,该对象连接到一个名为“demo_sse.php”的PHP文件。PHP文件发送一个包含服务器时间的数据消息,并在每次发送消息后进行缓冲刷新,以确保消息立即传输给客户端。在HTML页面中,每当从服务器接收到新的消息时,将其添加到页面中的“sse”元素中。