要使Raspberry Pi托管一个带有刻度盘的网页，该刻度盘实时指示CPU温度，CPU负载等，该怎么办？

我擅长Unix命令和脚本编写，但是我几乎没有网络经验。我有一个脚本，可以捕获我感兴趣的指标，例如CPU负载或系统温度，并每10秒更新一次文件。我想将iPad指向由Raspberry Pi托管的本地网站，该网站具有实时更新的数据图形表示。

在设置简单的Apache Web服务器之前，我已经工作过，并且可以编写HTML和JavaScript。除此之外，我迷路了，需要有人指出我正确的方向。

我在我的Raspberry Pi 3 上将Grafana与InfluxDB一起使用。它们相对容易设置并相互连接。它们甚至可以在Raspberry Pi的Docker容器中很好地工作。

在生成所有更新时，我会将所有更新流式传输到InfluxDB中。然后，Grafana完成所有图形化工作，以漂亮的视觉格式显示它们。我为屏幕较小的旧iPad设计了一个简单的仪表板。

听起来确实很多安装和开销，但确实看起来很漂亮。

为了在Raspberry上建立一个轻量级且非常简单的Web监控仪表板以设置（和扩展）监控页面，您需要使用RPi Monitor。

它带有一些默认值，配置主要是编辑几个简单的文本文件。我轻松配置了它，以从DTH21添加湿度图。

对于Web上的实时应用程序，最好的工具是WebSocket。通常，这些是在应用程序服务器而不是Web服务器中实现的，但是Apache提供了一种代理websocket的方法。这可以轻松地提供每秒或亚秒级的更新。

在应用程序服务器上使用哪个库取决于要使用的Web平台，但是例如，Socket.IO是Node.js的流行库。

在客户端，您可以像这样建立连接：

socket = new WebSocket("ws://website.net:8282");

socket.addEventListener('message', function (event) {
    var message = event.data;
    // Code to update site
});

在服务器端使用基本WebSocket库的Node.js：

const WebSocket = require('ws');
const wss = new WebSocket.Server({ port: 8282 });
wss.on('connection', function connection(ws) {
  dataOnUpdateEvent(function(event) {
    var data = event.getdata();
    var message = parseData(data);
    ws.send(message);
  });
});

您还可以查看Node-RED https://nodered.org 。

这是我建立的仪表板

我使用phpSysInfo监视所有Linux服务器/计算机，我非常喜欢它的简单性。这些设置也很容易理解，您可以设置自己的刷新率。

如果要使用C或C ++进行编码，则可以使用一些HTTP服务器库（如libonion或Wt）来编码您的专用HTTP服务器（也许使用sqlite来存储数据库）。然后，您应该很好地了解HTTP协议（包括HTTP cookie和HTTP标头）和HTML5。

您可能要使用Ajax和WebSocket技术（libonion＆Wt支持WebSocket，Ajax给出由客户端浏览器中运行的JavaScript代码启动的普通HTTP请求）。您可以将HTML5 画布和/或SVG用于图形。您可能会发现一些 有用的HTML5 Web框架。他们大多数使用Javascript，DOM，HTML5等。