首页 > 代码库 > server-sent-event使用流信息向客户端发送数据
server-sent-event使用流信息向客户端发送数据
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>server-sent-event</title> </head> <body> <div> <p>server-sent-event 是一种服务器向客户端发送消息的单向通信方式,采用流信息传送数据,类似视频播放,一直保持和客户端的连接,不断地发送数据。</p> <p>SSE 使用 HTTP 协议,现有的服务器软件都支持。WebSocket 是一个独立协议。</p> <p>SSE 属于轻量级,使用简单;WebSocket 协议相对复杂。</p> <p>SSE 默认支持断线重连,WebSocket 需要自己实现。</p> <p>SSE 一般只用来传送文本,二进制数据需要编码后传送,WebSocket 默认支持传送二进制数据。</p> <p>SSE 支持自定义发送的消息类型。</p> <script> if(‘EventSource‘ in window){ console.log("支持EventSource"); var es = new EventSource("http://localhost:3009/stream"); es.onopen = function(){ console.log("连接成功"); } es.onmessage = function(message){ //默认是message事件, console.log("接收到数据",message); } es.onerror = function(err){ console.log("error",err); } es.addEventListener("connecttime",function(event){ //监听自定义事件 console.log(‘监听自定义事件‘,event); },false); } </script> </div> </body> </html>
基于node 的服务端代码
var http = require("http"); http.createServer(function(req,res){ console.log(req.url); var filename = ‘.‘+req.url; if(filename===‘./stream‘){ res.writeHead(200,{ "Content-Type":"text/event-stream", "Cache-Control":"no-cache", "Connection":"keep-alive", "Access-Control-Allow-Origin": ‘*‘, }); res.write("retry: 10000\n"); res.write("event: connecttime\n"); res.write("data: " + "来自自定义事件的数据\n\n"); res.write("data: " + "自定义事件\n\n"); interval = setInterval(function () { //event 字段未设置的,默认为message事件 res.write("data: " + (new Date()) + "\n\n"); }, 1000); req.connection.addListener("close", function () { clearInterval(interval); }, false); } }).listen(3009,"127.0.0.1"); console.log("server start at port 3009");
server-sent-event使用流信息向客户端发送数据
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。