Server-Sent Events 与物联网-JavaScript中文网-JavaScript教程资源分享门户

Server-Sent Events（SSE）是一种基于HTTP的服务器推送技术，它允许服务器向客户端发送实时数据流。SSE 可以用于实现实时通信、数据可视化、监控等场景。在物联网应用中，SSE 可以用于实现设备数据的实时监控、远程控制等功能。

SSE 原理

SSE 基于 HTTP 协议，使用长连接（long-polling）实现服务器向客户端推送数据。客户端通过向服务器发送 HTTP 请求，请求头中指定 Accept: text/event-stream，服务器返回一个 Content-Type 为 text/event-stream 的响应。客户端收到响应后，将保持连接，并持续接收服务器推送的数据流。服务器发送的数据流以“事件”（event）为单位，每个事件由一行文本组成，格式如下：

event: event-name
data: event-data

其中，event 表示事件名称，data 表示事件数据。事件名称和事件数据可以是任意格式的文本，但是每个事件必须以一个空行结尾。客户端收到事件后，可以通过 JavaScript 监听事件，对事件数据进行处理。

SSE 实现

在 Node.js 中，可以使用 http 模块和 EventEmitter 实现 SSE 服务器。以下是一个简单的 SSE 服务器示例：

// javascriptcn.com 代码示例
const http = require('http');
const EventEmitter = require('events');

// 创建 SSE 事件源
class SSE extends EventEmitter {
  constructor(res) {
    super();
    this.res = res;
    this.res.writeHead(200, {
      'Content-Type': 'text/event-stream',
      'Cache-Control': 'no-cache',
      'Connection': 'keep-alive'
    });
    this.res.write('\n');
    this.on('message', this.send.bind(this));
  }

  send(data) {
    this.res.write(`data: ${data}\n\n`);
  }
}

// 创建 HTTP 服务器
const server = http.createServer((req, res) => {
  if (req.url === '/sse') {
    const sse = new SSE(res);
    setInterval(() => sse.emit('message', new Date().toISOString()), 1000);
  } else {
    res.writeHead(404);
    res.end();
  }
});

server.listen(3000);

上述代码创建了一个 SSE 事件源 SSE，继承自 EventEmitter，用于发送事件。在 HTTP 服务器中，当客户端请求 /sse 时，创建一个 SSE 事件源，并每秒钟向客户端发送一个事件，事件数据为当前时间的 ISO 字符串。

在客户端中，可以通过 JavaScript 监听事件，对事件数据进行处理。以下是一个简单的 SSE 客户端示例：

const source = new EventSource('/sse');

source.addEventListener('message', event => {
  console.log(event.data);
});

上述代码创建了一个 SSE 事件源 source，连接到 /sse 接口。在 message 事件中，打印事件数据。

SSE 在物联网中的应用

SSE 可以用于实现物联网设备的实时监控、远程控制等功能。以下是一个简单的物联网应用示例：

// javascriptcn.com 代码示例
const http = require('http');
const EventEmitter = require('events');

// 模拟物联网设备
class Device extends EventEmitter {
  constructor(name) {
    super();
    this.name = name;
    setInterval(() => this.emit('data', { temperature: Math.random() * 10 + 20 }), 1000);
  }
}

// 创建 SSE 事件源
class SSE extends EventEmitter {
  constructor(res) {
    super();
    this.res = res;
    this.res.writeHead(200, {
      'Content-Type': 'text/event-stream',
      'Cache-Control': 'no-cache',
      'Connection': 'keep-alive'
    });
    this.res.write('\n');
    this.on('message', this.send.bind(this));
  }

  send(data) {
    this.res.write(`data: ${JSON.stringify(data)}\n\n`);
  }
}

// 创建 HTTP 服务器
const server = http.createServer((req, res) => {
  if (req.url === '/devices') {
    const sse = new SSE(res);
    const devices = [
      new Device('Device 1'),
      new Device('Device 2'),
      new Device('Device 3'),
    ];
    devices.forEach(device => device.on('data', data => sse.emit('message', { name: device.name, data })));
  } else {
    res.writeHead(404);
    res.end();
  }
});

server.listen(3000);

上述代码创建了一个物联网设备 Device，每秒钟发送一个数据包，包含温度数据。在 HTTP 服务器中，当客户端请求 /devices 时，创建一个 SSE 事件源，并监听所有设备的数据事件，将数据发送到客户端。

在客户端中，可以通过 JavaScript 监听事件，对事件数据进行处理。以下是一个简单的物联网应用客户端示例：

const source = new EventSource('/devices');

source.addEventListener('message', event => {
  const data = JSON.parse(event.data);
  console.log(`${data.name}: ${data.data.temperature} ℃`);
});

上述代码创建了一个 SSE 事件源 source，连接到 /devices 接口。在 message 事件中，解析事件数据，并打印设备名称和温度数据。

总结

Server-Sent Events 是一种基于 HTTP 的服务器推送技术，可以用于实现实时通信、数据可视化、监控等场景。在物联网应用中，SSE 可以用于实现设备数据的实时监控、远程控制等功能。SSE 的实现比较简单，可以使用 Node.js 的 http 模块和 EventEmitter 实现。

来源：JavaScript中文网，转载请注明来源本文地址：https://www.javascriptcn.com/post/6566e8c3d2f5e1655dfd73b8