web-dev-qa-db-ja.com

Raspberry Pi Hostに、CPU温度、CPU負荷などをリアルタイムで表示するダイヤル付きのWebページを表示するには、何をする必要がありますか？

Unixコマンドとスクリプトは得意ですが、Webの経験はほとんどありません。 CPU負荷やシステム温度など、興味のあるメトリックを取得し、10秒ごとにファイルを更新するスクリプトがあります。私のiPadに、このデータのリアルタイムの更新グラフィック表示がある、Raspberry PiがホストするローカルWebサイトを指定したいと思います。

単純なApache Webサーバーをセットアップする前に作業し、HTMLとJavaScriptを作成できます。その上、私は道に迷っており、誰かが私を正しい方向に向ける必要があります。

unixapache-http-serverraspberry-pigui
27
jake9115

私はRaspberry Pi 3で Grafana を InfluxDB と一緒に使用しています。どちらも比較的簡単にセットアップでき、相互に接続できます。 Raspberry Piの Docker コンテナーでもうまく機能します。

更新が生成されたら、すべての更新をInfluxDBにストリーミングします。次に、Grafanaはそれらを素敵な視覚形式で表示するすべてのグラフィック作業を行います。画面が小さい古いiPad専用のシンプルなダッシュボードを設計しました。

インストールやオーバーヘッドが多いように聞こえますが、見た目はきれいです。

Enter image description here

30
0xACE

Raspberryのモニタリングページをセットアップ（および拡張）するための軽量で非常に簡単なWebモニタリングダッシュボードを使用するには、 RPi Monitor が必要です。

それはいくつかのデフォルトが付属しており、設定は主にいくつかのシンプルなテキストファイルを編集しています。 DTH21から湿度グラフを追加するように簡単に構成しました。

img_linkimg_link2

9
Rui F Ribeiro

Web上のリアルタイムアプリケーションの場合、最適なツールは WebSocket です。通常、これらはWebサーバーではなくアプリケーションサーバーに実装されますが、ApacheはWebソケットをプロキシする方法を提供します。これにより、1秒または1秒未満の更新を簡単に提供できます。

アプリケーションサーバーで使用するライブラリは、使用するWebプラットフォームによって異なりますが、たとえば、Node.jsの一般的なライブラリはSocket.IOです。

クライアント側では、次のような接続を設定できます。

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

Node-REDもご覧ください https://nodered.org Raspbianに在庫があります

これが私が作成したダッシュボードです enter image description here

4
jwygralak67

私はすべてのLinuxサーバー/コンピューターを監視するために phpSysInfo を使用しています。設定も非常に理解しやすく、独自のリフレッシュレートを設定できます。

2
McMuffin

CまたはC++でコーディングする場合は、 libonion または Wt などのHTTPサーバーライブラリを使用して、専用のHTTPサーバーをコーディングすることができます（おそらく sqliteを使用 データベースの場合）。次に、 [〜＃〜] http [〜＃〜] プロトコル（ HTTP cookies および HTTP headers を含む）および-をよく理解する必要があります。 HTML5 。

Ajax および WebSocket の手法を使用することをお勧めします（WebSocketはlibonion＆Wtでサポートされています。Ajaxは、クライアントブラウザで実行されているJavaScriptコードによって開始される通常のHTTPリクエストを提供します）。グラフィックスにはHTML5 canvas または [〜＃〜] svg [〜＃〜] を使用できます。 HTML5 web frameworks が役立つかもしれません。それらのほとんどはJavaScript、DOM、HTML5などを使用しています。

1
Basile Starynkevitch