在不到 30 分钟内构建一个树莓派监控仪表盘
你可能需要一个树莓派的仪表盘，以相识其性能情形。在本文中，我将演示怎样快速构建一个按需监控仪表盘，以实时审查你的树莓派的 cpu 性能、内存和磁盘使用情形，并凭证需要随时添加更多视图和操作。
若是你已经使用 Appsmith，你还可以直接导入 示例应用程序 并最先使用。
Appsmith
Appsmith 是一个开源的 低代码 应用构建工具，资助开发职员轻松快速地构建内部应用，如仪表盘和治理面板。它是一个用于仪表盘的很好选择，并镌汰了古板编码要领所需的时间和重大性。
在此示例的仪表盘中，我显示以下统计信息：
CPU
占用百分比
频率或时钟速率
计数
温度
内存
占用百分比
可用内存百分比
总内存
空闲内存
磁盘
磁盘使用百分比
绝对磁盘空间使用量
可用磁盘空间
总磁盘空间
建设一个端点
你需要一种从树莓派获取这些数据并转达给 Appsmith 的要领。psutil 是一个用于监控和剖析的 Python 库，而 Flask-RESTful 是一个建设 REST API 的 Flask 扩展。
Appsmith 每隔几秒钟挪用 REST API 以自动刷新数据，并以 JSON 工具作为响应，其中包括所有所需的统计信息，如下所示：
{ "cpu_count": 4,"cpu_freq": [600.0,600.0,1200.0 ],"cpu_mem_avail": 463953920,"cpu_mem_free": 115789824,"cpu_mem_total": 971063296,"cpu_mem_used": 436252672,"cpu_percent": 1.8,"disk_usage_free": 24678121472,"disk_usage_percent": 17.7,"disk_usage_total": 31307206656,"disk_usage_used": 5292728320,"sensor_temperatures": 52.616 }
登录后复制
1、设置 REST API
若是你的树莓派尚未装置 Python，请在树莓派上翻开终端并运行此装置下令：
$ sudo apt install python3
登录后复制
现在为你的开发设置一个 Python 虚拟情形：
$ python -m venv PiData
登录后复制
接下来，激活该情形。你必需在重新启动树莓派后执行此操作。
$ source PiData/bin/activate$ cd PiData
登录后复制
为了装置 Flask、Flask-RESTful 和以后需要的依赖项，请在你的 Python 虚拟情形中建设一个名为 requirements.txt 的文件，并将以下内容添加到其中：
flaskflask-restfulgunicorn
登录后复制
生涯文件，然后使用 pip 一次性装置它们。你必需在重新启动树莓派后执行此操作。
(PyData)$ python -m pip install -r requirements.txt
登录后复制
接下来，建设一个名为 pi_stats.py 的文件来存放使用 psutil 检索树莓派系一切计信息的逻辑。将以下代码粘贴到 pi_stats.py 文件中：
from flask import Flaskfrom flask_restful import Resource, Apiimport psutilapp = Flask(__name__)api = Api(app)class PiData(Resource):def get(self):return "RPI Stat dashboard"api.add_resource(PiData, '/get-stats')if __name__ == '__main__':app.run(debug=True)
登录后复制
这段代码的作用如下：
使用 app = Flask(name) 来界说嵌套 API 工具的应用程序。
使用 Flask-RESTful 的 API 要领 来界说 API 工具。
在 Flask-RESTful 中将 PiData 界说为详细的 Resource 类 ，以果真每个支持的 HTTP 要领。
使用 api.add_resource(PiData, ‘/get-stats’) 将资源 PiData 附加到 API 工具 api。
每当你会见 URL /get-stats 时，将返回 PiData 作为响应。
2、使用 psutil 读取统计信息
要从你的树莓派获取统计信息，你可以使用 psutil 提供的这些内置函数：
cpu_percentage、cpu_count、cpu_freq 和 sensors_temperatures 函数划分用于获取 CPU 的占用百分比、计数、时钟速率和温度。sensors_temperatures 报告了与树莓派毗连的所有装备的温度。要仅获取 CPU 的温度，请使用键 cpu-thermal。
virtual_memory 函数可返回总内存、可用内存、已使用内存和空闲内存的统计信息（以字节为单位）。
disk_usage 函数可返回总磁盘空间、已使用空间和可用空间的统计信息（以字节为单位）。
将所有函数组合到一个 Python 字典中的示例如下：
system_info_data = {'cpu_percent': psutil.cpu_percent(1),'cpu_count': psutil.cpu_count(),'cpu_freq': psutil.cpu_freq(),'cpu_mem_total': memory.total,'cpu_mem_avail': memory.available,'cpu_mem_used': memory.used,'cpu_mem_free': memory.free,'disk_usage_total': disk.total,'disk_usage_used': disk.used,'disk_usage_free': disk.free,'disk_usage_percent': disk.percent,'sensor_temperatures': psutil.sensors_temperatures()['cpu-thermal'][0].current,}
登录后复制
下一节将使用该字典。
3、从 Flask-RESTful API 获取数据
为了在 API 响应中看到来自树莓派的数据，请更新 pi_stats.py 文件，将字典 system_info_data 包括在 PiData 类中：
from flask import Flaskfrom flask_restful import Resource, Apiimport psutilapp = Flask(__name__)api = Api(app)class PiData(Resource):def get(self):memory = psutil.virtual_memory()disk = psutil.disk_usage('/')system_info_data = {'cpu_percent': psutil.cpu_percent(1),'cpu_count': psutil.cpu_count(),'cpu_freq': psutil.cpu_freq(),'cpu_mem_total': memory.total,'cpu_mem_avail': memory.available,'cpu_mem_used': memory.used,'cpu_mem_free': memory.free,'disk_usage_total': disk.total,'disk_usage_used': disk.used,'disk_usage_free': disk.free,'disk_usage_percent': disk.percent,'sensor_temperatures': psutil.sensors_temperatures()['cpu-thermal'][0].current, }return system_info_dataapi.add_resource(PiData, '/get-stats')if __name__ == '__main__':app.run(debug=True)
登录后复制
你的剧本已经停当，下面运行 PiData.py：
$ python PyData.py * Serving Flask app "PiData" (lazy loading) * Environment: production WARNING: This is a development server. Do not run this in a production environment. * Debug mode: on * Running on http://127.0.0.1:5000 (Press CTRL+C to quit) * Restarting with stat * Debugger is active!
登录后复制
你有了一个可以事情的 API。
4、将 API 提供应互联网
你可以在外地网络中与 API 举行交互。然而，要在互联网上会见它，你必需在防火墙中翻开一个端口，并将传入的流量转发到由 Flask 提供的端口。然而，正如你的测试输出建议的那样，在 Flask 中运行 Flask 应用程序仅适用于开发，而不适用于生产。为了清静地将 API 提供应互联网，你可以使用装置历程中装置的 gunicorn 生产效劳器。
现在，你可以启动 Flask API。每次重新启动树莓派时都需要执行此操作。
$ gunicorn -w 4 'PyData:app'Serving on http://0.0.0.0:8000
登录后复制
要从外部天下会见你的树莓派，请在网络防火墙中翻开一个端口，并将流量定向到你树莓派的 IP 地点，端口为 8000。
首先，获取树莓派的内部 IP 地点：
$ ip addr show | grep inet
登录后复制
内部 IP 地点通常以 10 或 192 或 172 开头。
接下来，你必需设置防火墙。通常，你从互联网效劳提供商（ISP）获取的路由器中嵌入了防火墙。通常，你可以通过网络浏览器会见家用路由器。路由器的地点有时会打印在路由器的底部，它以 192.168 或 10 开头。不过，每个装备都差别，因此我无法告诉你需要点击哪些选项来调解设置。关于怎样设置防火墙的完整形貌，请阅读 Seth Kenlon 的文章 《打起源口并通过你的防火墙路由流量》。
或者，你可以使用 localtunnel 来使用动态端口转发效劳。
一旦你的流量抵达树莓派，你就可以盘问你的 API：
$ curl https://example.com/get-stats{ "cpu_count": 4, "cpu_freq": [600.0,600.0,1200.0 ], "cpu_mem_avail": 386273280, ...
登录后复制
若是你已经执行到这一步，那么最难题的部分已经已往了。
5、重复办法
若是你重新启动了树莓派，你必需凭证以下办法举行操作：
使用 source 重新激活 Python 情形
使用 pip 刷新应用程序的依赖项
使用 gunicorn 启动 Flask 应用程序
你的防火墙设置是长期的，但若是你使用了 localtunnel，则必需在重新启动后启动新的隧道。
若是你愿意，可以自动化这些使命，但那是另一个教程的内容。本教程的最后一部分是在 Appsmith 上构建一个用户界面，使用拖放式小部件和一些 JavaScript，将你的树莓派数据绑定到用户界面。信托我，从现在最先很容易！
在 Appsmith 上构建仪表盘
硬件监控仪表盘
要制作一个像这样的仪表盘，你需要将果真的 API 端点毗连到 Appsmith，使用 Appsmith 的小部件库构建用户界面，并将 API 的响应绑定到小部件上。若是你已经使用 Appsmith，你可以直接导入 示例应用程序 并最先使用。
若是你还没有，请 注册 一个免费的 Appsmith 帐户�；蛘�，你可以选择 自托管 Appsmith。
将 API 作为 Appsmith 数据源毗连
登录到你的 Appsmith 帐户。
在左侧导航栏中找到并点击 “盘问或 JSQUERIES/JS” 旁边的 “+” 按钮。
点击 “建设一个空缺 APICreate a blank API”。
在页面顶部，将你的项目命名为 “PiData”。
获取你的 API 的 URL。若是你使用的是 localtunnel，则是一个 localtunnel.me 地点，总是在末尾添加 /get-stats 以获取统计数据。将其粘贴到页面的第一个空缺字段中，然后点击 “RUN” 按钮。
确保在 “响应Response” 面板中看到乐成的响应。
Appsmith 界面
构建用户界面
Appsmith 的界面很是直观，但若是你感应迷失，我建议你审查 在 Appsmith 上构建你的第一个应用程序 教程。
在画布上拖动”文本Text”、”图像Image”和”脱离线Divider”小部件作为问题。将它们排列如下：
设置项目的题
“文本Text” 小部件包括你页面的现实问题。键入比“Raspberry Pi Stats”更酷的内容。
“图像Image” 小部件用于展示仪表盘的奇异标记。你可以使用你喜欢的任何标记。
使用 “开关Switch” 小部件劳迫椿实时数据模式。从你构建的 API 获取数据，需要在 “属性Property” 面板举行设置。
关于主体部分，使用来自左侧的小部件库的以下小部件建设一个 CPU 统计信息区域，使用以下小部件：
进度条Progress Bar
统计框Stat Box
图表Chart
关于内存和磁盘统计信息部分，重复相同的办法。磁盘统计信息部分不需要图表，但若是你能找到用途，那也可以使用它。
你的最终小部件结构应该类似于以下：
Appsmith 中的属性设置
最后一步是将 API 的数据绑定到你的小部件上。
将数据绑定到小部件上
返回到画布，并在三个类别的部分中找到你的小部件。首先设置 CPU 统计信息。
要将数据绑定到 “进度条Progress Bar” 小部件：
单击 “进度条Progress Bar” 小部件，以翻开右侧的 “属性Property” 面板。
查找 “进度Progress” 属性。
单击 “JS” 按钮以激活 JavaScript。
在 “进度Progress” 字段中粘贴 {{PiData.data.cpu_percent ?? 0}}。此代码引用了你的 API 的数据流，名为 PiData。Appsmith 将响应数据缓保存 PiData 的 .data 运算符内。键 cpu_percent 包括了 Appsmith 用来显示 CPU 使用率百分比的数据。
在 “进度条Progress Bar” 小部件下方添加一个 “文本Text” 小部件作为标签。
在设置屏幕中绑定命据
在 CPU 部分有三个 “统计框Stat Box” 小部件。将数据绑定到每个小部件的办法与绑定 “进度条Progress Bar” 小部件的办法完全相同，只是你需要从 .data 运算符中绑定差别的数据属性。凭证相同的办法举行操作，但有以下破例：
使用 {{${PiData.data.cpu_freq[0]} ?? 0 }} 来显示时钟速率。
使用 {{${PiData.data.cpu_count} ?? 0 }} 来显示 CPU 计数。
使用 {{${(PiData.data.sensor_temperatures).toPrecision(3)} ?? 0 }} 来显示 CPU 温度数据。
若是一切顺遂，你将获得一个漂亮的仪表盘，如下所示：
树莓派的仪表盘
CPU 使用率趋势图
你可以使用 “图表Chart” 小部件将 CPU 使用率显示为趋势线，并使其随时间自动更新。
首先，单击小部件，在右侧找到 “图表类型Chart Type” 属性，并将其更改为 “折线图LINE CHART”。为了显示趋势线，需要将 cpu_percent 存储在数据点数组中。你的 API 现在将其作为单个时间数据点返回，因此可以使用 Appsmith 的 storeValue 函数（Appsmith 内置的 setItem 要领的一个原生实现）来获取一个数组。
在 “盘问或 JSQUERIES/JS” 旁边单击 “+” 按钮，并将其命名为 “utils”。
将以下 JavaScript 代码粘贴到 “代码Code” 字段中：
export default {getLiveData: () => {//When switch is on:if (Switch1.isSwitchedOn) {setInterval(() => {let utilData = appsmith.store.cpu_util_data;PiData.run()storeValue("cpu_util_data", [...utilData, {x: PiData.data.cpu_percent,y: PiData.data.cpu_percent}]); }, 1500, 'timerId')} else {clearInterval('timerId');}},initialOnPageLoad: () => {storeValue("cpu_util_data", []);}}
登录后复制
为了初始化 Store，你在 initialOnPageLoad 工具中建设了一个 JavaScript 函数，并将 storeValue 函数放在其中。
你使用 storeValue(“cpu_util_data”, []); 将 cpu_util_data 中的值存储到 storeValue 函数中。此函数在页面加载时运行。
到现在为止，每次刷新页面时，代码都会将 cpu_util_data 中的一个数据点存储到 Store 中。为了存储一个数组，你使用了 x 和 y 的下标变量，两者都存储了来自 cpu_percent 数据属性的值。
你还希望通过设定存储值之间的牢靠时间距离来自动存储这些数据。当执行 setInterval 函数时：
获取存储在 cpu_util_data 中的值。
挪用 API PiData。
使用返回的最新 cpu_percent 数据将 cpu_util_data 更新为 x 和 y 变量。
将 cpu_util_data 的值存储在键 utilData 中。
仅当设置为自动执行函数时，才重复执行办法 1 到 4。你使用 Switch 小部件将其设置为自动执行，这就诠释了为什么有一个 getLiveData 父函数。
在 “设置Settings” 选项卡中，找到工具中的所有父函数，并在 “页面加载时运行RUN ON PAGE LOAD” 选项中将 initialOnPageLoad 设置为 “Yes（是）”。
设置页面加载时要执行的函数
现在刷新页面举行确认。
返回到画布。单击 “图表Chart” 小部件，并找到 “图表数据Chart Data” 属性。将绑定 {{ appsmith.store.disk_util_data }} 粘贴到其中。这样，若是你自己多次运行工具 utils，就可以获得图表数据。要自动运行此操作：
查找并单击仪表盘问题中的 “实时数据开关Live Data Switch” 小部件。
查找 onChange 事务。
将其绑定到 {{ utils.getLiveData() }}。JavaScript 工具是 utils，而 getLiveData 是在你切换开关时激活的函数，它会从你的树莓派获取实时数据。可是尚有其他实时数据，因此统一开关也适用于它们。继续阅读以相识详情。
将数据绑定到内存和磁盘部分的小部件与你在 CPU 统计信息部分所做的方法类似。
关于内存部分，绑定如下所示：
进度条中的绑定为：{{( PiData.data.cpu_mem_avail/1000000000).toPrecision(2) * 100 ?? 0 }}。
三个统计框小部件的绑定划分为：{{ ${(PiData.data.cpu_mem_used/1000000000).toPrecision(2)} ?? 0 }} GB、{{ ${(PiData.data.cpu_mem_free/1000000000).toPrecision(2)} ?? 0}} GB 和 {{ ${(PiData.data.cpu_mem_total/1000000000).toPrecision(2)} ?? 0 }} GB。
关于磁盘部分，进度条和统计框小部件的绑定划分变为：
进度条的绑定为：{{ PiData.data.disk_usage_percent ?? 0 }}。
三个统计框小部件的绑定划分为：{{ ${(PiData.data.disk_usage_used/1000000000).toPrecision(2)} ?? 0 }} GB、{{ ${(PiData.data.disk_usage_free/1000000000).toPrecision(2)} ?? 0 }} GB 和 {{ ${(PiData.data.disk_usage_total/1000000000).toPrecision(2)} ?? 0 }} GB。
这里的图表需要更新你为 CPU 统计信息建设的 utils 工具，使用 storeValue 键名为 disk_util_data，嵌套在 getLiveData 下面，其逻辑与 cpu_util_data 类似。关于磁盘使用率图表，我们存储的 disk_util_data 的逻辑与 CPU 使用率趋势图的逻辑相同。
export default {getLiveData: () => {//When switch is on:if (Switch1.isSwitchedOn) {setInterval(() => { const cpuUtilData = appsmith.store.cpu_util_data; const diskUtilData = appsmith.store.disk_util_data; PiData.run(); storeValue("cpu_util_data", [...cpuUtilData, { x: PiData.data.cpu_percent,y: PiData.data.cpu_percent }]); storeValue("disk_util_data", [...diskUtilData, { x: PiData.data.disk_usage_percent,y: PiData.data.disk_usage_percent }]);}, 1500, 'timerId')} else {clearInterval('timerId');}},initialOnPageLoad: () => {storeValue("cpu_util_data", []);storeValue("disk_util_data", []);}}
登录后复制
通过使用 utils JavaScript 工具在翻开和关闭真实数据开关时触发的数据流可视化如下所示：
切换
在翻开实时数据开关时，图表会酿成这样：
显示实时数据
整体上，它既漂亮，又简约，并且很是有用。
祝你使用愉快！
当你对 psutils、JavaScript 和 Appsmith 越发熟悉时，我信托你会发明可以轻松无限地调解你的仪表板，实现非� ？岬墓π�，例如：
审查先前一周、一个月、一个季度、一年或凭证你的树莓派数据允许的任何自界说规模的趋势
为任何统计数据的阈值违规构建报警机制
监控毗连到你的树莓派的其他装备
将 psutils 扩展到另一台装置有 Python 的盘算机上
使用其他库监控你家庭或办公室的网络
监控你的花园
跟踪你自己的生涯习惯
在下一个令人兴奋的项目中，祝你玩得愉快！
以上就是在不到 30 分钟内构建一个树莓派监控仪表盘的详细内容，更多请关注本网内其它相关文章！
