树莓派-通过Web网页实现对树莓派的关机和重启操作

最新推荐文章于 2024-07-24 13:09:14 发布

清山博客

最新推荐文章于 2024-07-24 13:09:14 发布

阅读量9.3k

点赞数 4

分类专栏：物联网

本文链接：https://blog.csdn.net/a497785609/article/details/77945241

版权

物联网专栏收录该内容

25 篇文章 1 订阅

订阅专栏

实现思路：

1.通过在树莓派上搭建一个http服务器，如：Apache，增加一个控制树莓派的页面。

2.通过在树莓派的控制页面，写入需要在终端执行的命令。

3.服务器端通过python，定时读取文件内容，执行终端命令。

实现步骤：

1.搭建php+Apache环境：

本文主要描述程序编写，如何搭建php+Apache环境，可以网上查找资料，自行实现。

2.编写Web网页控制端：

大致界面像这样：

代码：

<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>树莓派Web控制中心</title>
    <script src="js/jquery-3.2.1.min.js" type="text/javascript"></script>
    <script src="js/bootstrap.min.js" type="text/javascript"></script>
    <link href="css/bootstrap.css" rel="stylesheet" type="text/css" />
    <link href="css/font-awesome-4.7.0/css/font-awesome.min.css" rel="stylesheet" type="text/css" />
    <style type="text/css">
        .page-header { margin: 20px 0; border-bottom: 1px solid #eee; padding-bottom: 0; text-align: center; }
        .btn-item { text-align: center; }
        i { margin-right: 3px; display: inline-block; }
        h1 { text-align: center; }
        .tip { font-weight: bold; color: black; }
        .lead { font-size: small; }
    </style>
</head>
<body>
    <div class="container">
        <div class="page-header">
            <h3>
                树莓派Web控制中心</h3>
            <p class="lead">
                用于控制连接到树莓派的各种传感器
            </p>
        </div>
        <div class="panel panel-primary">
            <div class="panel-heading">
                设备</div>
            <div class="panel-body">
                <div class="row">
                    <div class="col-xs-3 btn-item">
                    </div>
                    <div class="col-xs-3 btn-item">
                        <button type="button" class="btn btn-danger btn-trigger">
                            <i class="fa fa-power-off"></i>关机</button>
                    </div>
                    <div class="col-xs-3 btn-item">
                        <button type="button" class="btn btn-primary btn-trigger">
                            <i class="fa fa-refresh"></i>重启</button>
                    </div>
                    <div class="col-xs-3 btn-item">
                    </div>
                    <script type="text/javascript">
                        var url = "ajax/pi.php";
                        $(function () {
                            $(".btn-trigger").click(function () {
                                var text = $(this).text().replace(/ /g, "").replace(/\n/g, "").replace(/\r/g, "").replace(/\t/g, "");
                                var cmd = "";
                                switch (text) {
                                    case "关机":
                                        cmd = "sudo shutdown -h now";
                                        break;
                                    case "重启":
                                        cmd = "sudo reboot";
                                        break;
                                }
                                if (confirm("确定要执行该命令吗？")) {
                                    $.ajax({
                                        type: "POST",
                                        url: url,
                                        data: {
                                            action: "set-linux-cmd",
                                            cmd: cmd
                                        },
                                        success: function (result) {
                                            $(".tip").html(result);
                                        }
                                    });
                                }
                            });
                        });
                    </script>
                </div>
            </div>
        </div>
        <div class="panel panel-primary">
            <div class="panel-heading">
                传感器</div>
            <div class="panel-body">
                <div class="row">
                    <div class="col-xs-12">
                        <span style="color: gray">待接入，敬请期待...</span>
                    </div>
                </div>
            </div>
        </div>
        <div class="panel panel-primary" style="border-color:#555">
            <div class="panel-heading" style="background: #555">
                终端</div>
            <div class="panel-body">
                <div class="row">
                    <div class="col-xs-12">
                        <div class="alert alert-success" style="" role="alert">
                            执行：<span class="tip"> </span>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</body>
</html>

请求处理代码：

<?php
$action=$_POST["action"];
$cmd=$_POST["cmd"];
if($action=="set-linux-cmd"){ 
	$myfile=fopen("linuxcmd.txt","w") or die("unable to open file!");
	fwrite($myfile,$cmd); 
	$str=file_get_contents("linuxcmd.txt");
	echo($str);	
}
?>

完整代码见文末附件。

3.服务器端Python脚本

import os

while True:
    #read cmd
    file=open("/var/www/html/pi/ajax/linuxcmd.txt","r")
    text=file.read()
    file.close()    
    
    if(text!=""):       
        #clear cmd
        file=open("/var/www/html/pi/ajax/linuxcmd.txt","w")
        file.write("")
        file.close()
        #print(text)
        os.system(text)

4.将脚本设置为开机运行

在终端运行：

sudo nano /etc/rc.local

在exit 0这行代码前一行，添加：

python /home/pi/linuxcmd.py

保存文件并退出。

5.重启系统

附：完整代码

1.Web端代码

2.服务器端代码