使用Python简单的实现树莓派的WEB控制


Posted in Python onFebruary 18, 2016

先给大家展示下效果如图,感觉还很满意请继续阅读全文:

使用Python简单的实现树莓派的WEB控制 

用到的知识:Python Bottle HTML Javascript JQuery Bootstrap AJAX 当然还有 linux

我去,这么多……我还是一点一点说起吧……

先贴最终的源代码:

#!/usr/bin/env python3
from bottle import get,post,run,request,template
@get("/")
def index():
return template("index")
@post("/cmd")
def cmd():
print("按下了按钮: "+request.body.read().decode())
return "OK"
run(host="0.0.0.0")

没错,就10句,我一句一句解释:

1. # !/usr/bin/env python3 ,告诉shell这个文件是Python源代码,让bash调用python3来解释这段代码

2. from bottle import get,post,run,request,template ,从bottle框架导入了我用到的方法、对象

下边几句是定义了2个路由,一个是“/”一个是“/cmd”,前者是get类型(用@get装饰),后者是POST类型(用的@post装饰)

第一个路由很简单,就是读取index模版(模版就是个html啦)并发送到客户端(浏览器),因为路径是“/”也就是比如树莓派的IP地址是:192.168.0.10

那用 http://192.168.0.10:8080 就访问到了我们的"/”路由(bottle默认端口是8080)

同理,第二个路由的路径是“/cmd”也就是访问 http://192.168.0.10:8080/cmd 就访问到了第二个路由

最后一句: run(host = " 0.0.0.0 " )就是调用bottle的run方法,建立一个http服务器,让我们能通过浏览器访问我们的界面。

下边我详细的解释一下这些代码的作用:

第一个路由的作用就是扔给浏览器一个HTML(index.tpl)文档,显示这个界面:

使用Python简单的实现树莓派的WEB控制 

这个文件的源代码如下:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>遥控树莓派</title>
<link href="//cdn.bootcss.com/bootstrap/3.3.5/css/bootstrap.min.css" rel="stylesheet" media="screen">
<script src="http://code.jquery.com/jquery.js"></script>
<style type="text/css">
#up {
margin-left: 55px;
margin-bottom: 3px;
}
#down {
margin-top: 3px;
margin-left: 55px;
}
</style>
<script>
$(function(){
$("button").click(function(){
$.post("/cmd",this.id,function(data,status){});
});
});
</script>
</head>
<body>
<div id="container" class="container">
<div>
<button id="up" class="btn btn-lg btn-primary glyphicon glyphicon-circle-arrow-up"></button>
</div>
<div>
<button id='left' class="btn btn-lg btn-primary glyphicon glyphicon-circle-arrow-left"></button>
<button id='stop' class="btn btn-lg btn-primary glyphicon glyphicon-stop"></button>
<button id='right' class="btn btn-lg btn-primary glyphicon glyphicon-circle-arrow-right"></button>
</div>
<div>
<button id='down' class="btn btn-lg btn-primary glyphicon glyphicon-circle-arrow-down"></button>
</div>
</div>
<script src="//cdn.bootcss.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
</body>
</html>

这个内容有点多,不过很简单,就是引用了jquery bootstrap这两个前端框架,加了5个按钮(<body></body>之间的代码)。当然我用了bootstrap内置的上下左右停止这几个图标,这5个按钮的id分辨定义成up,down,left,right,stop,然后写了如下的关键代码:

$(function(){
$("button").click(function(){
$.post("/cmd",this.id,function(data,status){});
});
});

没错,就这三句代码……

第1,2行给所有的按钮(button)绑定了一个点击的事件,第三行调用jquery的post方法把this.id(被单击按钮的id),发送到“/cmd”这个路径下,这时,我们python代码的第二个路由起作用了,接收到了网页上被单击按钮的id,并打印出了“按下了按钮: XXX”

当然,在这里写几个if语句判断,就可以按照实际的需求做一些实际的控制了,嗯,比如调用wiringpi2 for python控制树莓派的GPIO。

关于使用Python简单的实现树莓派的WEB控制的相关内容就给大家介绍这么多,希望对大家有所帮助!

Python 相关文章推荐
python原始套接字编程示例分享
Feb 21 Python
Python中的defaultdict模块和namedtuple模块的简单入门指南
Apr 01 Python
Python3 模块、包调用&amp;路径详解
Oct 25 Python
Python Django给admin添加Action的方法实例详解
Apr 29 Python
Django 静态文件配置过程详解
Jul 23 Python
python批量图片处理简单示例
Aug 06 Python
关于jupyter打开之后不能直接跳转到浏览器的解决方式
Apr 13 Python
Pycharm打开已有项目配置python环境的方法
Jul 03 Python
python 实现朴素贝叶斯算法的示例
Sep 30 Python
Django实现随机图形验证码的示例
Oct 15 Python
关于python3.9安装wordcloud出错的问题及解决办法
Nov 02 Python
Django程序的优化技巧
Apr 29 Python
在Ubuntu系统下安装使用Python的GUI工具wxPython
Feb 18 #Python
以一个投票程序的实例来讲解Python的Django框架使用
Feb 18 #Python
使用Python生成随机密码的示例分享
Feb 18 #Python
使用Python的urllib2模块处理url和图片的技巧两则
Feb 18 #Python
讲解Python的Scrapy爬虫框架使用代理进行采集的方法
Feb 18 #Python
使用Python的PIL模块来进行图片对比
Feb 18 #Python
使用Python来编写HTTP服务器的超级指南
Feb 18 #Python
You might like
php实现scws中文分词搜索的方法
2015/12/25 PHP
EarthLiveSharp中cloudinary的CDN图片缓存自动清理python脚本
2017/04/04 PHP
js中几种去掉字串左右空格的方法
2006/12/25 Javascript
JavaScript 学习笔记(四)
2009/12/31 Javascript
Extjs学习笔记之四 工具栏和菜单
2010/01/07 Javascript
javascript实现的使用方向键控制光标在table单元格中切换
2010/11/17 Javascript
Javascript 面向对象(一)(共有方法,私有方法,特权方法)
2012/05/23 Javascript
浅析hasOwnProperty方法的应用
2013/11/20 Javascript
JavaScript汉诺塔问题解决方法
2015/04/21 Javascript
BootStrap树状图显示功能
2016/11/24 Javascript
Javascript实现页面滚动时导航智能定位
2017/05/06 Javascript
Bootstrap 模态框(Modal)带参数传值实例
2017/08/20 Javascript
bootstrap与pagehelper实现分页效果
2018/12/29 Javascript
使用webpack构建应用的方法步骤
2019/03/04 Javascript
微信小程序之几种常见的弹框提示信息实现详解
2019/07/11 Javascript
js实现简单页面全屏
2019/09/17 Javascript
[01:45]绝对公平!DOTA2队长征召模式详解
2014/04/25 DOTA
[44:01]2018DOTA2亚洲邀请赛3月30日 小组赛B组 EG VS paiN
2018/03/31 DOTA
使用Python的Supervisor进行进程监控以及自动启动
2014/05/29 Python
Ubuntu下创建虚拟独立的Python环境全过程
2017/02/10 Python
详解python里使用正则表达式的分组命名方式
2017/10/24 Python
Python字符串拼接六种方法介绍
2017/12/18 Python
python中使用%与.format格式化文本方法解析
2017/12/27 Python
Python绘制的二项分布概率图示例
2018/08/22 Python
详解pycharm连接不上mysql数据库的解决办法
2020/01/10 Python
Python autoescape标签用法解析
2020/01/17 Python
Pycharm中import torch报错的快速解决方法
2020/03/05 Python
利用CSS3实现折角效果实例源码
2016/09/28 HTML / CSS
SteelSeries赛睿官网:游戏外设和配件的领先制造商(耳机、键盘、鼠标和鼠标垫)
2018/06/17 全球购物
工程造价与财务管理专业应届生求职信
2013/10/06 职场文书
医药大学生求职简历的自我评价
2013/10/17 职场文书
爱国演讲稿400字
2014/05/07 职场文书
2015元旦晚会主持词(开场白+结束语)
2014/12/14 职场文书
先进个人事迹材料
2014/12/29 职场文书
【海涛dota解说】一房久违的影魔魂守二连发
2022/04/01 DOTA
win10滚动条自动往上跑怎么办?win10滚动条自动往上跑的解决方法
2022/08/05 数码科技