¿Qué debo hacer para que mi Raspberry Pi aloje una página web con diales que indican la temperatura de la CPU, la carga de la CPU, etc., en tiempo real?

Soy bueno con los comandos y secuencias de comandos de Unix, pero casi no tengo experiencia web. Tengo un script que toma métricas que me interesan, como la carga de la CPU o la temperatura del sistema, y ​​actualiza un archivo cada 10 segundos. Me gustaría apuntar mi iPad a un sitio web local alojado por mi Raspberry Pi, que tiene una representación gráfica actualizada de estos datos en tiempo real.

He trabajado antes de configurar un servidor web Apache simple, y puedo escribir HTML y JavaScript. Además de eso, estoy perdido y necesito que alguien me señale en la dirección correcta.

Utilizo Grafana con InfluxDB para esto en mi Raspberry Pi 3. Ambos son relativamente fáciles de configurar y conectar entre sí. Incluso funcionan bien en contenedores Docker en la Raspberry Pi.

Transmito todas mis actualizaciones a InfluxDB a medida que se generan. Luego Grafana hace todo el trabajo gráfico de mostrarlos en un agradable formato visual. Diseñé un tablero simple solo para mi viejo iPad con su pantalla más pequeña.

Suena como una gran cantidad de instalación y gastos generales, pero seguro que se ve bonito.

Para tener un panel de monitoreo web liviano y muy fácil para configurar (y extender) la página de monitoreo en su Raspberry, tiene RPi Monitor .

Viene con algunos valores predeterminados y la configuración está editando principalmente un par de archivos de texto simples. Lo configuré fácilmente para agregar gráficos de humedad de un DTH21.

Para aplicaciones en tiempo real en la web, la mejor herramienta es WebSocket . Por lo general, estos se implementan en el servidor de aplicaciones, no en el servidor web, pero Apache proporciona una forma de proxy de sockets web. Esto podría proporcionar fácilmente actualizaciones por segundo o por segundo.

La biblioteca que use en el servidor de aplicaciones depende de la plataforma web que desee usar, pero, por ejemplo, una popular para Node.js es Socket.IO.

En el lado del cliente, puede configurar una conexión como esta:

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

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

En el lado del servidor con Node.js usando la biblioteca básica de WebSocket:

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);
  });
});

También puede mirar Node-RED https://nodered.org. Se comercializa en Raspbian

Aquí hay un tablero que construí

Uso phpSysInfo para monitorear todos mis servidores / computadoras Linux, y realmente me gusta lo simple que es. La configuración también es muy fácil de entender y puede establecer su propia frecuencia de actualización.

Si desea codificar en C o C ++, puede usar alguna biblioteca de servidor HTTP como libonion o Wt para codificar su servidor HTTP especializado (quizás usando sqlite para la base de datos). Entonces debe comprender bien el protocolo HTTP (incluidas las cookies HTTP y los encabezados HTTP ) y HTML5 .

Es posible que desee utilizar las técnicas Ajax y WebSocket (WebSockets son compatibles con libonion & Wt, Ajax proporciona solicitudes HTTP ordinarias iniciadas por el código JavaScript que se ejecuta en el navegador del cliente). Puede usar el lienzo HTML5 y / o SVG para gráficos. Puede encontrar útiles algunos marcos web HTML5 ; la mayoría de ellos usan Javascript, DOM, HTML5, ...