用Node.js和Express构建实时数据可视化系统，玩转无线传感网

2023-12-21 11:14:42

无线传感器网络监控：从串口到图表

串口通信：数据的源头

无线传感器网络的精髓始于串口通信。借助 Node.js 的 SerialPort 模块，我们可以轻松地读取串口数据，就像从水龙头取水一样。该模块提供了一个简洁的 API，让我们轻松设置、打开和关闭串口，同时监视着源源不断的数据流。

const SerialPort = require('serialport');

const port = new SerialPort('/dev/ttyUSB0', {
  baudRate: 9600,
  dataBits: 8,
  parity: 'none',
  stopBits: 1,
  flowControl: false
});

port.on('data', function (data) {
  // 将数据发送到服务器
  // ...
});

服务器数据处理：大脑中心

服务器是整个系统的神经中枢，它接收从串口传输来的数据，将其安全地保存在数据库中，就像一个勤劳的图书馆管理员。为了让前端能够无缝访问这些数据，我们巧妙地利用 Express 框架搭建了一个简明的 API。

const express = require('express');

const app = express();

app.get('/data', function (req, res) {
  // 从数据库中获取数据
  // ...

  // 将数据发送给前端
  res.json(data);
});

app.listen(3000);

然而，由于前端和服务器这两个调皮的小伙伴分别生活在不同的领域，跨域问题这个讨厌的家伙就出现了。为了解决这个小麻烦，我们使用了代理转发这个神通广大的小精灵，它可以将前端的请求转发到服务器，就像一位彬彬有礼的管家。

前端数据请求：数据呈现

前端是用户与系统的互动界面，在这里，我们将使用 Axios 这个强大的使者来向服务器发送请求，获取数据，并用 ECharts 这个图形魔法师渲染出炫酷的图表，让数据瞬间变身为清晰可读的视觉盛宴。

const axios = require('axios');

axios.get('http://localhost:3000/data')
  .then(function (response) {
    // 获取数据
    const data = response.data;

    // 渲染图表
    const myChart = echarts.init(document.getElementById('chart'));
    myChart.setOption({
      // ...
    });
  });