ฉันจะแสดงอุณหภูมิจากเซ็นเซอร์ภายในในหน้า HTML ได้อย่างไร


14

ฉันเพิ่งเข้ามาในขณะนี้และในขณะที่ฉันสามารถแสดงอุณหภูมิผ่าน SSH ฉันกำลังดิ้นรนกับการแสดงบนหน้าเว็บเล็ก ๆ ที่ฉันติดตั้งบน Pi ของฉันใช้ Apache2 ฉันทำตามตัวอย่างนี้http://www.raspberrypi.org/phpBB3/viewtopic.php?t=35487&p=310038ซึ่งรวม AJAX และสคริปต์ในไดเรกทอรี cgi-bin แต่ฉันได้รับข้อผิดพลาดที่บอกว่า$ was not definedเป็น clueless จริงๆ ด้วย JavaScript ฉันไม่มีเงื่อนงำที่ข้อผิดพลาดอยู่ ฉันสงสัยว่ามันอาจจะเป็นไดเรกทอรี cgi-bin ฉันเพิ่งสร้างขึ้นมาและไม่สามารถหาข้อมูลว่าฉันต้องทำอะไรเป็นพิเศษหรือไม่เพื่อให้สามารถใช้งานสคริปต์ได้ ทุกคนสามารถตอบคำถามนั้นให้ฉันได้ไหม หากมีความเกี่ยวข้องฉันกำลังเรียกใช้ Raspbian เวอร์ชันล่าสุด

ในที่สุดฉันต้องการบันทึกค่าลงในฐานข้อมูลและกราฟจากนั้น แต่สิ่งแรกที่ต้องทำก่อน :)

คำถามหลักคือฉันจะแสดงอุณหภูมิบนหน้าเว็บของฉันจากเซ็นเซอร์ภายในได้อย่างไร

แก้ไข

ฉันจะลองใช้ข้อเสนอแนะแรกในคืนนี้เมื่อฉันกลับถึงบ้าน แต่ฉันได้อย่างรวดเร็วไปที่สอง (Lenik) ไปซึ่งดูเหมือนว่าจะทำงานได้ดี ฉันต้องแก้ไขบางอย่างเพื่อให้มันใช้งานได้ สคริปต์จะไม่สร้างไฟล์ rrd ดังนั้นฉันสร้างด้วยตนเองโดยใช้ไวยากรณ์ที่เขาใช้ในสคริปต์ ฉันยังแก้ไขUPDATEคำสั่งเนื่องจากไม่ชอบค่าที่ส่งผ่านไป ฉันต้องลบwidthส่วนออกจากGRAPHคำสั่งเพราะมันโยนข้อผิดพลาดเช่นกัน จากนั้นในตอนท้ายฉันเพิ่มcpเพื่อให้มันวางไฟล์ในไดเรกทอรีรูปภาพของเว็บไซต์แล้วเพิ่ม*/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

คำตอบ:


16

ราคา $ เสียงเหมือนที่คุณอาจจะพยายามที่จะใช้jQuery หากเป็นกรณีนี้คุณอาจต้องการดาวน์โหลดและติดตั้งเช่นกัน

เนื่องจากคุณพี่ผมยังอยากจะแนะนำพยายามที่จะเขียนโปรแกรมประยุกต์บนเว็บของคุณเองโดยพายุทอร์นาโด มันเขียนโดยใช้ Python (ภาษาที่ชื่นชอบของ Pi) และฉันมักจะพบว่ามันง่ายมากที่จะสร้างเว็บแอปพลิเคชันที่ใช้มัน

เพียงติดตั้งโดยใช้ '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 :: การตรวจสอบอุณหภูมิของ CPU ด้วย RRDTOOL " เกี่ยวกับปัญหาเดียวกัน โซลูชันของฉันรวมถึงการรับอุณหภูมิจาก CPU บันทึกลงในฐานข้อมูล round-robin และสร้างกราฟที่สวยงามเป็นไฟล์. PNG ซึ่งค่อนข้างง่ายต่อการวางบนเว็บเพจ - เพียงแค่คัดลอกทุกที่ที่คุณต้องการ ฉันหวังว่าคุณจะพบว่ามีประโยชน์

ป้อนคำอธิบายรูปภาพที่นี่


1
ขอบคุณสำหรับสิ่งนี้. ฉันต้องแก้ไข แต่ฉันทำให้มันทำงานได้และสอนสิ่งใหม่เกี่ยวกับ bash scripting และ 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

คำตอบอื่น ๆ ที่นี่ยอดเยี่ยม โซลูชันของฉันโดยใช้เชลล์สคริปต์และ PHP เป็นดังนี้:

โปรดทราบว่าฉันทำสิ่งนี้กับ Raspbian Wheezy ดังนั้นตำแหน่งของรหัสทั้งหมดของฉันจึงเป็นที่/var/www/มา หากคุณใช้ Jessie คุณจะต้องอยู่ใน '/ var / www / html /'

ก่อนอื่นให้เปลี่ยนผู้ใช้เป็นรูท (ผู้ใช้ระดับสูง):

  • 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 ที่แตกต่างกันตามตัวแทนผู้ใช้ (ไม่มีการเลื่อนไม่มีเวลาปัจจุบันที่มุมไม่มีการโหลดซ้ำที่ด้านล่าง) แต่ในเวอร์ชันนั้นฉัน '

โดยการใช้ไซต์ของเรา หมายความว่าคุณได้อ่านและทำความเข้าใจนโยบายคุกกี้และนโยบายความเป็นส่วนตัวของเราแล้ว
Licensed under cc by-sa 3.0 with attribution required.