服务端推送之 EventSource

构造函数

let es = new EventSource(url[, configuration])
参数 描述
url 服务端推送的后端接口
configuration 连接选项,可选

属性

属性 描述
onerror 连接错误时的回调
onmessage 接收到一个 message 事件的回调
onopen 连接刚打开时的回调
readyState 只读,连接状态,0 为连接中,1 为连接打开,2 为连接关闭
url 只读,连接的后端接口

方法

方法 描述
close 断开连接

代码演示

// 前端
let source = new EventSource('/test.php')
source.onopen = function (event) {
  console.log('成功与服务器连接')
}
source.onmessage = function (event) {
  console.log('未命名事件', event.data)
}
source.onerror = function (error) {
  console.log('错误')
}
source.addEventListener('myes', function (event) {
  console.log('命名事件')
})

// 服务端(Node.js)代码片段
app.get('/EventSource-test', (ewq, res) => {
  // 响应头
  res.writeHead(200, {
    "Content-Type": "text/event-stream",
    "Cache-Control": "no-cache"
  })
  // 未命名事件
  res.write('data:' + '消息内容1' + '\n') 
  // 命名事件
  res.write(
    'event: myes' + '\n' +
    'data:' + '消息内容2' + '\n' +
    'retry:' + '2000' + '\n' +
    'id:' + '12345' + '\n'
  )
  // 定时事件
  setInterval(() => {
    res.write('data:' + '定时消息' + '\n')
  }, 2000)
})
除特殊说明外本人博客均属原创,转载请注明出处:http://blog.johnhan.cn/blog_1098.html
京ICP备19044523号-1