HTML5服务器发送事件的简单案例视频教程
分类: 视频教程 标签: 时间:
html5的一个实用小知识点: 服务器发送事件,从性能上来说,已经大大的超越了 基于Ajax的js轮询实现的定时请求。
这个例子,演示了最简单的实现一个 客户端和服务器端的数据请求与相应。
Action: IE不支持喔
Server-Sent 事件 - 单向消息传递
Server-Sent 事件指的是网页自动获取来自服务器的更新。
以前也可能做到这一点,前提是网页不得不询问是否有可用的更新。通过服务器发送事件,更新能够自动到达。
例子:Facebook/Twitter 更新、估价更新、新的博文、赛事结果等。
浏览器支持
所有主流浏览器均支持服务器发送事件,除了 Internet Explorer。
接收 Server-Sent 事件通知
EventSource 对象用于接收服务器发送事件通知:
if(typeof(EventSource)!=="undefined"){ var source =new EventSource("event_deal.php"); source.onmessage=function(event) { document.getElementById("result-box").innerHTML += event.data + ""; } }else{ document.getElementById("result-box").innerHTML = "抱歉,你的浏览器不支持服务器发送事件"; }
服务器端代码实例
header('Content-Type: text/event-stream'); header('Cache-Control: no-cache'); $time = date('r'); $message = "hello 你好呀!"; echo "data: 当前服务器时间: {$time}{$message}\n\n"; flush();
附件: 下载
参考链接: http://www.w3school.com.cn/html5/html_5_serversentevents.asp