Làm cách nào để hiển thị nhiệt độ từ cảm biến bên trong trên trang HTML?


14

Tôi mới tham gia vào điều này và trong khi tôi có thể hiển thị temp thông qua SSH, tôi đang vật lộn với việc hiển thị nó trên trang web nhỏ mà tôi thiết lập trên Pi của mình đang chạy Apache2. Tôi đã làm theo ví dụ này http://www.raspberrypi.org/phpBB3/viewtopic.php?t=35487&p=310038 bao gồm một số AJAX và một tập lệnh trong thư mục cgi-bin, nhưng tôi gặp lỗi khi nói điều đó $ was not definedvà thực sự không biết gì với JavaScript, tôi không biết lỗi nằm ở đâu. Tôi tự hỏi nếu nó có thể là thư mục cgi-bin. Tôi chỉ tạo nó và không thể xác định thông tin về việc tôi có phải làm gì đặc biệt để cho phép sử dụng nó cho các tập lệnh hay không. Bất cứ ai có thể trả lời câu hỏi đó cho tôi? Nếu nó có liên quan, tôi đang chạy phiên bản mới nhất của Raspbian.

Cuối cùng, tôi muốn đăng nhập các giá trị vào cơ sở dữ liệu và biểu đồ từ nó, nhưng điều đầu tiên trước tiên. :)

Câu hỏi chính là làm thế nào tôi có thể hiển thị nhiệt độ trên trang web của tôi từ cảm biến bên trong?

BIÊN TẬP

Tôi sẽ thử gợi ý đầu tiên vào tối nay khi tôi về nhà, nhưng tôi nhanh chóng nhận được lời đề nghị thứ hai (Lenik) dường như đang hoạt động tốt. Tôi đã phải thực hiện một số chỉnh sửa mặc dù để làm cho nó hoạt động. Kịch bản sẽ không tạo tệp rrd vì vậy tôi đã tạo thủ công bằng cách sử dụng cú pháp anh ta sử dụng trong tập lệnh. Tôi cũng đã sửa đổi UPDATElệnh vì nó không giống như giá trị được truyền cho nó. Tôi đã phải loại bỏ widthphần này khỏi GRAPHlệnh vì nó cũng đã gây ra lỗi. Cuối cùng, tôi đã thêm một cptệp để nó đặt tệp vào thư mục hình ảnh của trang web và sau đó thêm vào*/5 * * * * /home/root/scripts/temprec.sh >/dev/null 2>&1vào crontab của tôi để nó chạy cứ sau 5 phút. Nó dường như đang hoạt động, nhưng chỉ với 4 mẫu cho đến nay rất khó để biết chắc chắn. Trong vòng một giờ hoặc lâu hơn, tôi sẽ có ý tưởng tốt hơn nếu các chỉnh sửa của mình có hiệu quả.

#!/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

Câu trả lời:


16

Các $ âm thanh như bạn có thể cố gắng để sử dụng jQuery . Nếu đây là trường hợp, bạn có thể muốn tải xuống và cài đặt nó là tốt.

Vì bạn đang ở trên Pi, tôi cũng khuyên bạn nên thử viết ứng dụng web của riêng bạn bằng Tornado . Nó được viết bằng Python (ngôn ngữ yêu thích của Pi) và tôi luôn thấy rất dễ dàng để tạo các ứng dụng web bằng cách sử dụng nó.

Chỉ cần cài đặt nó bằng cách sử dụng 'sudo apt-get install python-tornado'. Tôi vừa viết một ứng dụng web lốc xoáy tối giản, mà bạn có thể dùng thử (tôi không thể kiểm tra nó), bằng cách lấy một chức năng từ một số bài đăng trên diễn đàn khác :

#!/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()

Nếu bạn chạy chương trình này ( chmod +x yourprogram.py ; ./yourprogram.py), bạn sẽ có thể trỏ trình duyệt của mình tới http: //raspberrypi.local: 8888 / và xem đầu ra.

Cập nhật: Tôi vừa thử đoạn script trên ở nhà, và nó hoạt động. Không đẹp, nhưng đó là một khởi đầu!


Cảm ơn vì điều đó. Khi tôi về nhà tối nay tôi sẽ cho nó đi vì tôi thích ý tưởng đằng sau nó.
Trido

13

Cách đây một thời gian, tôi đã viết một bài báo " Raspberry Pi :: Theo dõi nhiệt độ CPU bằng RRDTOOL " về cùng một vấn đề. Giải pháp của tôi bao gồm nhận nhiệt độ từ CPU, lưu nó vào cơ sở dữ liệu vòng tròn và xây dựng một biểu đồ đẹp dưới dạng tệp .PNG, khá dễ dàng để đưa lên trang web - chỉ cần sao chép nó bất cứ nơi nào bạn muốn. Tôi hy vọng bạn sẽ thấy nó hữu ích.

nhập mô tả hình ảnh ở đây


1
Cảm ơn vì điều đó. Tôi đã phải chỉnh sửa nó, nhưng tôi đã làm cho nó hoạt động và nó đã dạy một số điều mới về bash scripting và RRD mà tôi biết rất ít. Tôi đã chỉnh sửa bài đăng của mình để phản ánh những gì tôi đã làm và hy vọng điều này sẽ giúp người khác muốn biết cách làm điều này.
Trido

2

Tôi tin rằng bạn có thể lấy và truyền dữ liệu từ RPi của mình và nhúng nó vào trình duyệt với gói này trên GitHub .

Đây là một biểu đồ trông như thế nào: https://plot.ly/~jensb89/12/ .

Khi bạn đã tạo biểu đồ của mình, bạn có thể nhúng nó dưới dạng iframe với đoạn mã này:

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

Bạn sẽ muốn trao đổi URL của bạn trong mã. Hãy cho tôi biết nếu bạn có bất kỳ vấn đề hoặc tôi có thể giúp đỡ với bất cứ điều gì. Ngoài ra, tôi là một phần của Plotly, được sử dụng trong gói này.

Đây là vẻ ngoài của nó:

nhập mô tả hình ảnh ở đây


Điều này trông thực sự tốt đẹp.
Trido

1

Các câu trả lời khác ở đây là tuyệt vời. Giải pháp của tôi, sử dụng tập lệnh shell và PHP như sau:

Xin lưu ý rằng tôi đã làm điều này trên Raspbian Wheezy, vì vậy vị trí của tất cả mã của tôi nằm trong /var/www/. Nếu bạn đang sử dụng Jessie, nó sẽ cần phải ở trong '/ var / www / html /'

Trước hết cho phép chuyển người dùng sang root (siêu người dùng):

  • sudo su (và nhập mật khẩu của bạn)

đến đúng vị trí:

  • cd /var/www/ (Khò khè)

Bây giờ tạo một thư mục mới ở đó:

  • mkdir scripts

Cung cấp cho nó các thuộc tính chính xác:

  • chmod 755 scripts/

Bây giờ tạo một tệp mới trong đó, hãy gọi nó là 'temp.sh'

  • nano scripts/temp.sh

Nhập mã sau:

#!/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để lưu và thoát.

Bây giờ đặt các thuộc tính của tệp đó:

  • chmod 755 scripts/temp.sh

Bây giờ tạo một thư mục mới

  • mkdir include/

Đặt thuộc tính của nó

  • chmod 744 include/

OK, bây giờ hãy chạy tập lệnh và kiểm tra đầu ra của nó:

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

Nó sẽ hiển thị một cái gì đó như thế này:

53.5

Tuyệt vời! Bây giờ, hãy để nó chạy một lần một phút. Chúng tôi sẽ nhập một dòng mới trong Crontab.

  • crontab -e

Dán dòng dưới đây ở dưới cùng của tập tin

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

Ctrl+X- Y- Enterđể lưu và thoát.

Bây giờ chúng ta cần chỉnh sửa Trang mà nhiệt độ sẽ được hiển thị. Vì vậy, chúng tôi đi chỉnh sửa tệp PHP:

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

Và chèn cái này vào <div>sự lựa chọn của bạn:

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

Điều đó sẽ làm điều đó. Chỉ cần tải lại trang của bạn và bạn sẽ thấy temps CPU và GPU được hiển thị.

Phần thưởng được thêm vào: Tôi cũng muốn buộc trang tải mỗi lần (ngăn trình duyệt lưu vào bộ nhớ cache nhiệt độ) Để làm điều này, tôi cũng bao gồm PHP sau đây ở phần đầu của tệp:

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

Lưu ý: Lý do điều này hoạt động với tôi là vì nó được hiển thị trên "bảng điều khiển" của công ty, Một trang trên TV trong văn phòng của tôi hiển thị toàn bộ biểu đồ (trạng thái máy chủ, số người dùng, trung bình tải, v.v., v.v. Vân vân). Tôi đã thiết lập pi ở Chế độ kiosk (trình duyệt toàn màn hình khi khởi động bằng Iceweasel) và hiển thị một trang duy nhất tự động cuộn xuống phía dưới. Mất khoảng 4 đến 5 phút để đến đó từ đầu và sau đó tải lại tự động sau khi chạm đáy. Vì vậy, nó thỉnh thoảng tải lại, bỏ qua nhu cầu tôi phải cập nhật màn hình hiển thị nhiệt độ bằng công nghệ phía máy khách. Tôi cũng đã thiết lập nó để được xem bằng CSS / JS khác nhau dựa trên tác nhân người dùng (không cuộn, không có thời gian hiện tại ở góc, không tải lại ở phía dưới), nhưng trên phiên bản đó, tôi '

Khi sử dụng trang web của chúng tôi, bạn xác nhận rằng bạn đã đọc và hiểu Chính sách cookieChính sách bảo mật của chúng tôi.
Licensed under cc by-sa 3.0 with attribution required.