树莓派智能车AlphaBot教程8:webiopi(下集)
前文再续,书接上一回。 为方便简介,将WebIOPi-0.7.1-raspi2复制到pi目录下,并改名为webiopi
=== cpp代码: ===
pi@raspberrypi:~/AlphaBot2/Lib $ mv WebIOPi-0.7.1-raspi2/ ~/webiopi
前一章说道tutorials目录下为一写基础的教程示例。下面我们展示一下怎么使用这些例程。 只需修改一下webiopi的配置文件既可以启动。
=== cpp代码: ===
pi@raspberrypi:~sudo vi /etc/webiopi/config
编辑配置文件,将脚本文件路径设置为:myscript = /home/pi/webiopi/tutorials/1.basis/script.py HTML文件目录设置为: doc-root = /home/pi/webiopi/tutorials/1.basis
运行如下命令启动webiopi。 - c 后面为配置文件参数。
=== cpp代码: ===
pi@raspberrypi:~sudo webiopi -c /etc/webiopi/config
在浏览器地址栏内输入树莓派ip地址,端口号8000,按确定会显示如下页面。
打开/home/pi/webiopi/tutorials/1.basis目录下的index.html如下图所示。
下面来分析一下这个HTML文件 【1】 HTML文件包含两个部分,一部分为头,即<head>,另一部分为实体,即<body>. 实体中包含一个ID为controls的div,div表示HTML的一个分区。并设置为中间对齐。 <meta> 设置页面的元信息,设置字符格式为UTF-8 <title> 设置页面的标题,浏览器打开网页时,标签栏会显示页面的标题。 <script> 插入脚本,这里插入两个脚本。一个为webiopi.js,另一个教程为新建的脚本。 <style> 插入HTML文档定义样式信息,这里新建一个css文件,并定义按键的大小间距已经颜色。
【2】
webiopi().ready()为webiopi的初始函数,每次打开页面时会调用这个函数。这个函数的参数也为函数名。
这个函数启动时会调用参数里面的函数。这个函数可以在webiopi.js文件中找到。
=== cpp代码: ===
WebIOPi.prototype.ready = function (cb) {
w().readyCallback = cb;
}
【3】 var button = webiopi().createGPIOButton(17, "Light"); 创建一个GPIO按钮,按钮和GPIO 17相关联,名称为Light。从webiopi.js中createGPIOButton的代码可以知道。首先创建一个按键。然后按键注册按键按下的事件。当按键按下时,管脚的电平会反转。
=== cpp代码: ===
WebIOPi.prototype.createGPIOButton = function (gpio, label) {
var button = w().createButton("gpio" + gpio, label);
button.bind(BUTTON_DOWN, function(event) {
w().toggleValue(gpio);
});
return button;
}
【4】
$("#controls").append(button); $("#controls")表示ID名control的元素,这个语句的意思是把button标签加入controls中。
webiopi().refreshGPIO(true);
定时刷新界面。
下面在看一下脚本文件/home/pi/webiopi/tutorials/1.basis/script.py
脚本文件总包含三个函数。 setup为初始化函数,每次网页打开时会调用,函数中设置管脚17为输出状态,并判断当前时间是否在8点到18点之间。如果时则开灯。
loop为循环函数,函数中设置8点开灯,18点关灯。
destroy为销毁函数。网页关闭时会调用此函数关灯。
好的,到这样各位应该对webiopi的使用有一定了解了,webiopi工程一般包含三部分,index.html网页文件,script.py脚本文件,config配置文件。通过上面的讲解再加上一个继电器模块你就可以用手机通过Web网页控制点灯了,是不是瞬间觉得高大上?
设计webiopi开机启动 运行如下命令可以设置开机启动 webiopi.
=== cpp代码: ===
sudo update-rc.d webiopi defaults
取消开机启动可以运行如下命令
=== cpp代码: ===
sudo update-rc.d webiopi remove
开机启动的默认配置文件为/etc/webiopi/config。如果要设置开机启动则需要修改这个文件,修改脚本文件路径,HTML目录路径。
<title> 设置页面的标题,浏览器打开网页时,标签栏会显示页面的标题。
<a href="data/attachment/portal/201705/03/112616yazxamkk4knka50v.png" target="_blank"><img src="data/attachment/portal/201705/03/112616yazxamkk4knka50v.png"></a>
<a href="data/attachment/portal/201705/03/112848cnneei0pkxu8kuop.png" target="_blank"><img src="data/attachment/portal/201705/03/112848cnneei0pkxu8kuop.png"></a>
</title>