如何在HTML页面上显示内部传感器的温度?


14

我只是想了解这一点,尽管我可以通过SSH显示温度,但是我却在将其显示在运行Apache2的Pi上设置的小网页上感到很挣扎。我遵循了这个示例http://www.raspberrypi.org/phpBB3/viewtopic.php?t=35487&p=310038,该示例在cgi-bin目录中包含一些AJAX和一个脚本,但是我收到一个错误消息,说这话$ was not defined而且真的很笨使用JavaScript,我不知道错误在哪里。我想知道是否可能是cgi-bin目录。我只是创建它,无法找到有关是否必须执行任何特殊操作才能将其用于脚本的信息。谁能为我回答这个问题?如果相关,我正在运行Raspbian的最新版本。

最终,我想将值记录到数据库中并从中绘制图形,但首先要考虑的是。:)

主要问题是如何通过内部传感器在网页上显示温度?

编辑

今晚晚些时候回家时,我将尝试第一个建议,但很快我就得到了第二个建议(Lenik),它似乎运行良好。我必须进行一些编辑才能使其正常工作。该脚本不会创建rrd文件,因此我使用他在脚本中使用的语法手动创建了该文件。我还修改了UPDATE命令,因为它不喜欢传递给它的值。我不得不widthGRAPH命令中删除该部分,因为它也引发了错误。然后最后,我添加了一个,cp以便将文件放置在网站的images目录中,然后添加*/5 * * * * /home/root/scripts/temprec.sh >/dev/null 2>&1到我的crontab,因此它每5分钟运行一次。似乎可行,但是到目前为止只有4个样本很难确定。在一个小时左右的时间里,如果修改成功,我将有一个更好的主意。

#!/bin/bash
#
# update .rrd database with CPU temperature
#
# $Id: update_cputemp 275 2013-05-16 05:20:56Z lenik $
# Thanks to Lenik @ Raspberrypi.stackexchange.com.
cd /path/to/scripts
# read the temperature and convert .59234. into .59.234. (degrees celsius)
TEMPERATURE=`cat /sys/class/thermal/thermal_zone0/temp`
TEMPERATURE=`echo -n ${TEMPERATURE:0:2}; echo -n .; echo -n ${TEMPERATURE:2}`
/usr/bin/rrdtool update cputemp.rrd N:$TEMPERATURE
/usr/bin/rrdtool graph cputemp.png DEF:temp=cputemp.rrd:cputemp:AVERAGE LINE2:temp#00FF00
cp /path/to/scripts/cputemp.png /path/to/website/images

Answers:


16

$听起来像是您可能正在尝试使用jQuery。在这种情况下,您可能还需要下载并安装它。

由于您使用的是Pi,因此我也建议您尝试使用Tornado编写自己的Web应用程序。它是使用Python(Pi最喜欢的语言)编写的,我总是发现使用它创建Web应用程序非常容易。

只需使用“ sudo apt-get install python-tornado”进行安装即可。我刚刚编写了一个简约的龙卷风网络应用程序,您可以通过从其他一些论坛帖子中获取功能尝试(我无法对其进行测试):

#!/usr/bin/env python

import tornado.ioloop
import tornado.web
import os

class MainHandler(tornado.web.RequestHandler):
    def getCPUtemperature( self ):
        res = os.popen('vcgencmd measure_temp').readline()
        return(res.replace("temp=","").replace("'C\n",""))

    def get(self):
        self.write( "Temperature: %s" % ( self.getCPUtemperature() ) )

application = tornado.web.Application([
    (r"/", MainHandler),
])

if __name__ == "__main__":
    application.listen(8888)
    tornado.ioloop.IOLoop.instance().start()

如果运行此程序(chmod +x yourprogram.py ; ./yourprogram.py),则应该能够将浏览器指向http://raspberrypi.local:8888 /并查看输出。

更新:我只是在家里尝试了上面的脚本,它可以工作。不好,但这是一个开始!


谢谢你 今晚回家时,我会尝试一下,因为我喜欢背后的想法。
Trido

13

前一段时间,我写了一篇文章“ Raspberry Pi ::使用RRDTOOL监视CPU温度 ”,讨论了同样的问题。我的解决方案包括从CPU接收温度,将温度保存到循环数据库中,并以.PNG文件形式构建漂亮的图形,这很容易放在Web页面上-只需将其复制到任何位置即可。希望您会发现它有用。

在此处输入图片说明


1
谢谢你 我必须对其进行编辑,但是我可以对其进行工作,并且它教会了我一些鲜为人知的有关bash脚本和RRD的新知识。我编辑了帖子以反映我的所作所为,希望这对希望了解此操作的其他人有所帮助。
Trido

2

我相信您可以从RPi抓取并传输数据,并使用GitHub上的此软件包将其嵌入到浏览器中。

图表的外观如下:https : //plot.ly/~jensb89/12/

生成图形后,可以使用以下代码段将其作为iframe嵌入:

<iframe id="igraph" src="https://plot.ly/~abhishek.mitra.963/1/400/250/" width="400" height="250" seamless="seamless" scrolling="no"></iframe>

您需要在代码中交换您的URL。让我知道您是否有任何问题,或者我可以提供任何帮助。另外,我也是该程序包中使用的Plotly的一部分。

外观如下:

在此处输入图片说明


这看起来真的很好。
Trido

1

这里的其他答案都很棒。使用shell脚本和PHP的解决方案如下:

请注意,我是在Raspbian Wheezy上执行此操作的,所以我所有代码的位置都在/var/www/。如果您使用的是Jessie,则必须位于“ / var / www / html /”中

首先让切换用户到root(超级用户):

  • sudo su (然后输入您的密码)

到达正确的位置:

  • cd /var/www/ (哎呀)

现在在此处创建一个新目录:

  • mkdir scripts

给它正确的属性:

  • chmod 755 scripts/

现在在其中创建一个新文件,将其命名为“ temp.sh”

  • nano scripts/temp.sh

输入以下代码:

#!/bin/bash

cpuTemp0=$(/opt/vc/bin/vcgencmd measure_temp)
cpuTemp0=${cpuTemp0//\'C/}
cpuTemp0=${cpuTemp0//temp=/}

echo CPU: $cpuTemp0 > /var/www/include/temp.txt

Ctrl+X- Y- Enter保存并退出。

现在设置该文件的属性:

  • chmod 755 scripts/temp.sh

现在创建一个新目录

  • mkdir include/

设置它的属性

  • chmod 744 include/

好的,现在运行脚本并测试其输出:

  • cd scripts/
  • ./temp.sh
  • cd ../include/
  • cat temp.txt

它应该显示如下内容:

53.5

太棒了!现在,让它每分钟运行一次。我们将在Crontab中输入新行。

  • crontab -e

将下面的行粘贴到文件的底部

* * * * * /var/www/scripts/temp.sh

Ctrl+X- Y- Enter保存并退出。

现在我们需要编辑将在其上显示温度的页面。所以我们去编辑PHP文件:

  • cd /var/www/
  • nano index.php

并将其插入<div>您选择的中:

<?php require_once("include/temp.txt"); ?>&#176;C

这样就可以了。只需重新加载页面,您就会看到正在显示的CPU和GPU温度。

额外的好处:我还想强制每次加载页面(防止浏览器缓存温度),为此,我还在文件的开头包含了以下PHP:

<?php
    header("Cache-Control: no-cache, no-store, must-revalidate");
    header("Pragma: no-cache");
    header("Expires: 0");
?>

注意:这对我有用的原因是它显示在公司的“仪表盘”上,办公室中电视上的一页显示了很多图表(服务器状态,用户编号,平均负载等),等等)。我将pi设置为Kiosk模式(使用Iceweasel在启动时使用全屏浏览器),并显示一个自动向下滚动到底部的页面。从顶部到达目的地大约需要4到5分钟,然后在到达底部时自动重新加载。因此它确实会不时地重新加载,而无需使用客户端技术来更新温度显示。我还设置了它,以便基于用户代理使用不同的CSS / JS进行查看(无滚动,无当前时间,无底部重新加载),但在该版本中,我

By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.