eventSource简单介绍
eventSource是用来解决web上服务器端向客户端推送消息的问题的。不同于ajax轮询的复杂和websocket的资源占用过大,eventSource(sse)是一个轻量级的,易使用的消息推送api
如何使用 客户端代码Document
代码很简单,实例化api,监听事件
服务端nodejs代码服务端这几种实现使用其一就可以了
var http = require("http") var fs = require("fs") http.createServer(function (req, res) { var fileName = "." + req.url; if (fileName === "./stream") { res.writeHead(200, { "Content-Type":"text/event-stream", "Cache-Control":"no-cache", "Connection":"keep-alive" }); res.write("retry: 10000 "); res.write("event: connecttime "); res.write("data: " + (new Date()) + " "); res.write("data: " + (new Date()) + " "); interval = setInterval(function() { res.write("data: " + (new Date()) + " "); }, 1000); req.connection.addListener("close", function () { clearInterval(interval); }, false); } else { fs.readFile("./index.html", "utf8",function(err, html) { if (err) { console.log(err) return } res.end(html) }) } }).listen(9999);服务端expressjs代码
var express = require("express") var fs = require("fs") var app = express() app.get("/stream", function(req, res) { console.log(111) res.writeHead(200, { "Content-Type":"text/event-stream", "Cache-Control":"no-cache", "Connection":"keep-alive" }); res.write("retry: 10000 "); res.write("event: connecttime "); res.write("data: " + (new Date()) + " "); res.write("data: " + (new Date()) + " "); interval = setInterval(function() { res.write("data: " + (new Date()) + " "); }, 1000); req.connection.addListener("close", function () { clearInterval(interval); }, false); }) app.use(function(req, res) { fs.readFile("./index.html", "utf8",function(err, html) { if (err) { console.log(err) return } res.send(html) }) }) app.listen(9999, function(err) { if (err) { console.log(err) return } console.log("listening on port 9999") })服务端koajs 1.x 代码
var koa = require("koa") var fs = require("fs") var PassThrough = require("stream").PassThrough var app = koa() app.use(function *() { var url = this.req.url if (url === "/stream") { var stream = new PassThrough() setInterval(function() { stream.write("data: " + (new Date()) + " ") }, 1000); this.type = "text/event-stream" this.body = stream } else { var html = yield koaFs this.body = html } }) app.listen(9999, function(err) { if (err) { console.log(err) return } console.log("listening on port 9999") }) function koaFs(fn) { fs.readFile("./index.html", "utf8", function(err, html) { fn(err, html) }) }
使用起来没什么问题,都可以正常运行,不过在多个客户端访问的时候,一个客户端连上之后,其他客户端就没有推送了,不知道为甚么?
文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。
转载请注明本文地址:https://www.ucloud.cn/yun/82832.html
摘要:简介是的缩写。通常情况下,是我们的浏览器向服务器发起请求后,服务器响应,然后关闭连接。为了能够保持通信,以便在服务器有事件发生时主动通知浏览器,后来人们又发明了很多技术,包括等。 SSE简介 SSE是Server-Sent Events的缩写。通常情况下,是我们的浏览器向服务器发起请求后,服务器响应,然后关闭连接。为了能够保持通信,以便在服务器有事件发生时主动通知浏览器,后来人们又发明...
摘要:简介是的缩写。通常情况下,是我们的浏览器向服务器发起请求后,服务器响应,然后关闭连接。为了能够保持通信,以便在服务器有事件发生时主动通知浏览器,后来人们又发明了很多技术,包括等。 SSE简介 SSE是Server-Sent Events的缩写。通常情况下,是我们的浏览器向服务器发起请求后,服务器响应,然后关闭连接。为了能够保持通信,以便在服务器有事件发生时主动通知浏览器,后来人们又发明...
摘要:不过永久帧的技术会导致主页面的加载条始终处于状态,体验很差。同时,规范允许服务端指定自定义事件,客户端侦听该事件即可。 服务端推 服务端推,指的是由服务器主动的向客户端发送消息(响应)。在应用层的HTTP协议实现中,请求-响应是一个round trip,它的起点来自客户端,因此在应用层之上无法实现简易的服务端推功能。当前解决服务端推送的方案有这几个: 客户端长轮训 websocket...
阅读 2227·2021-11-15 11:39
阅读 982·2021-09-26 09:55
阅读 925·2021-09-04 16:48
阅读 2831·2021-08-12 13:23
阅读 919·2021-07-30 15:30
阅读 2455·2019-08-29 14:16
阅读 886·2019-08-26 10:15
阅读 525·2019-08-23 18:40