Shengkai81@gmail.com：/* MicroWRT 网页控制 */

2015-09-04T08:14:21Z

‎MicroWRT 网页控制

Shengkai81@gmail.com：Created page with "{| style="width: 800px;" |- | 本节教程将带领大家完成一个智能家居原型系统的搭建。正常使用的智能家居系统应该包含三个部分，云端服..."

2015-09-04T08:13:00Z

Created page with "{| style="width: 800px;" |- | 本节教程将带领大家完成一个智能家居原型系统的搭建。正常使用的智能家居系统应该包含三个部分，云端服..."

新页面

{| style="width: 800px;"
|-
|
本节教程将带领大家完成一个智能家居原型系统的搭建。正常使用的智能家居系统应该包含三个部分，云端服务器（由设备商提供，客户只需要通过电脑，手机接入访问），
路由器，终端节点。在本项目中，我们将搭建一个简单的家居系统，所以不涉及云端服务器。代替的是把我们的microWRT当做服务器，同时在整个系统中他也扮演这路由器的角色。
其实云端服务器的本质也是个基于linux的系统，只是它的处理能力更强。而我们microWRT的性能完全可以承担起作为一个小服务器。终端节点使用我们的microduino基础模块，
并用来控制一个LED灯。

==MicroWRT 网页控制==

openwrt也提供了强大的软件包，使用这些软件包我们完全可以搭建一个标准的服务器系统，但是我们需要在16M，甚至更小的ROM中安装很多软件，
比如lighttpd，lighttpd-mod-cgi，lighttpd-mod-fastcgi，php5-cgi，php5-fastcgi，libsqlite3等很多程序。这些软件的配置也比较复杂，如果出现问题，就比较难排查处理。
所以参考了一些资料，本项目中主要基于openwrt原生支持的Luci来开发一种简单的网页控制程序。Luci是openWRT的标准网页管理程序，它是一个web application，有自己的
http server和application server。Luci的http server是uhttpd，application是一个有Lua语言完成。Lua语言是一个简单而强大的语言，详细的资料可以参考下面的链接。
'''http://baike.baidu.com/link?url=ML2D1zdrTyS7NGQWr6Flc_jX1L64LnrqxOumtwZauGGcU-7Dgxz4Eix59O0vUdfp6DE3LUScDy96HV9RrUAepq'''
'''http://www.lua.org/'''

下面我们一步步实现一个简单的网页控制

1.首先是Lua的入门，因为我们的固件都编译了VI编辑器，所以后面的操作都可以直接在microWRT上操作，如果玩家不习惯使用VI，也可以在PC上使用其他的编辑器，注意保存的文件名
后缀，然后通过winSCP上传到microWRT上。在固件里还要编译进lua，或者通过opkg命令后期安装。
创建文件test.lua, 内容如下：

print（“hello,Lua")

修改其属性为”0777“，可执行。然后执行命令：

lua test.lua

然后我们就可以在屏幕上看到hello，Lua字样。

2. 串口测试
我们最终的目的是通过网页下达命令给microduino，有microduino控制LED。microWRT和microduino是通过串口连接的，所以要网页上的按钮对应的命令发送到串口。
新建一个文件2ser.lua, 内容如下：

io.output("/dev/ttyS0")
io.write(" test1 ")

同样的操作，改成可执行属性，执行如下命令：

lua 2ser.lua

然后在屏幕上就可以看到输出test1了。

3. Web和Lua的连接
新建test文件，没有后缀名，内容如下：

#!/usr/bin/lua
print("hello,Lua")

无线连接到microWRT后，在浏览器查看

http://192.168.1.1/cgi-bin/test

在浏览器应该就可以看到 hello，Lua 字样。

4. Web像串口发送数据，修改2ser文件，没有后缀名，内容如下：

#!/usr/bin/lua
io.output("/dev/ttyS0")
io.write(" test1 ")

通过串口连接microWRT，打开超级终端，然后在浏览器里输入如下地址查看

http://192.168.1.1/cgi-bin/2ser

在超级终端上就会输出 test1.

5. 当然Web也可以接收传入的参数。新建webtest文件，没有后缀名，内容如下：

#!/usr/bin/lua
print(os.getenv("QUERY_STRING"))

在浏览器查看

http://192.168.1.1/cgi-bin/webtest?abc

浏览器就可以看到abc这些字符。

6. 最后把这些命令组合起来，新web2ser文件内容如下：

#!/usr/bin/lua
io.output("/dev/ttyS0")
io.write(os.getenv("QUERY_STRING"))

通过串口连接microWRT，打开超级终端，在浏览器产看

http://192.168.1.1/cgi-bin/web2ser?abc

就可以在超级终端看到输出了abc。

7. 设置串口波特率。
当然在编译固件的时候我们可以设定波特率，但是如果固件编译好之后，发现波特率不对，我们也可以修改。这就需要用到stty工具。
stty是Linux的一个核心工具，但是openwrt为了精简没有默认安装，可以手动安装他。

opkg update
opkg install coreutils-stty

然后加到启动项/etc/init.d/wificar 里

/usr/bin/stty -F /dev/ttyS0 raw speed 9600

这里需要使用一个新文件wificar，通过这个文件文件，也可以控制小车，并接收视频回显。内容如下：

#!/bin/sh /etc/rc.common

START=80

start() {
/usr/bin/stty -F /dev/ttyS0 raw speed 9600
ser2net -c /etc/ser2net.conf
}
stop(){
killall mjpg_streamer
}

然后还需要执行命令去启用它。

/etc/init.d/wificar enable

8. 创建网页文件来整合视频和控制按键。新建一个car.htm文件，内容如下：

<div style="float:left">
<script>
function sendSer(value){
document.getElementById("ser").src="http://192.168.1.1/cgi-bin/web2ser?"+value;
}
</script>
<table>
<tr><td/><img id="ser" width="1" height="1">
<td><input type="button" onmousedown="sendSer('1')" onmouseup="sendSer('0')" value="前进" /></td><td/></tr>
<tr><td><input type="button" onmousedown="sendSer('2')" onmouseup="sendSer('0')" value="左转" /></td><td/>
<td><input type="button" onmousedown="sendSer('4')" onmouseup="sendSer('0')" value="右转" /></td></tr>
<tr><td/><td><input type="button" onmousedown="sendSer('3')" onmouseup="sendSer('0')" value="后退" /></td><td/></tr>
<tr><td colspan="3" align="middle"> <input type="button" onclick="sendSer('5')" value="舵机向上" /></td></tr>
<tr><td colspan="3" align="middle"> <input type="button" onclick="sendSer('6')" value="舵机向下" /></td></tr>
</table>
</div>
<div style="float:left">
<iframe width="640" height="480" src="http://192.168.1.1:8080/?action=stream"/>
</div>

这个文件可以直接在本地运行，也可以放到/www下面，然后通过下面网址访问：

http://192.168.1.1/car.htm

==硬件连接==
1. 将Microduino接上一个LED灯，并参考基础教程下载控制LED等的程序到Microduino core中。
2. 将Microduino通过扩展板叠加到MicroWRT上，调整拨码开关，使用core模式，并使用ttyS0进行通信。

==系统测试==
在网页上点击控制按钮，就可以实现对LED灯的控制，如果把整个系统放在小车上，同时修改microduino的控制程序，添加对小车的控制，并在MicroWRT上
连接USB摄像头，在网页上可以实现视频的回显。

|}

@@ 第121行： / 第121行： @@
 . 创建网页文件来整合视频和控制按键。新建一个car.htm文件，内容如下：
-  <div style="float:left">
+   <div style="float:left">
-  <script>
+   <script>
-  function sendSer(value){
+   function sendSer(value){
-  document.getElementById("ser").src="http://192.168.1.1/cgi-bin/web2ser?"+value;
+   document.getElementById("ser").src="http://192.168.1.1/cgi-bin/web2ser?"+value;
-−
+   }
-  </script>
+   </script>
-  <table>
+   <table>
-  <tr><td/><img id="ser" width="1" height="1">
+   <tr><td/><img id="ser" width="1" height="1">
-  <td><input type="button" onmousedown="sendSer('1')" onmouseup="sendSer('0')" value="前进" /></td><td/></tr>
+   <td><input type="button" onmousedown="sendSer('1')" onmouseup="sendSer('0')" value="前进" /></td><td/></tr>
-  <tr><td><input type="button" onmousedown="sendSer('2')" onmouseup="sendSer('0')" value="左转" /></td><td/>
+   <tr><td><input type="button" onmousedown="sendSer('2')" onmouseup="sendSer('0')" value="左转" /></td><td/>
-  <td><input type="button" onmousedown="sendSer('4')" onmouseup="sendSer('0')" value="右转" /></td></tr>
+   <td><input type="button" onmousedown="sendSer('4')" onmouseup="sendSer('0')" value="右转" /></td></tr>
-  <tr><td/><td><input type="button" onmousedown="sendSer('3')" onmouseup="sendSer('0')" value="后退" /></td><td/></tr>
+   <tr><td/><td><input type="button" onmousedown="sendSer('3')" onmouseup="sendSer('0')" value="后退" /></td><td/></tr>
-  <tr><td colspan="3" align="middle"> <input type="button" onclick="sendSer('5')" value="舵机向上" /></td></tr>
+   <tr><td colspan="3" align="middle"> <input type="button" onclick="sendSer('5')" value="舵机向上" /></td></tr>
-  <tr><td colspan="3" align="middle"> <input type="button" onclick="sendSer('6')" value="舵机向下" /></td></tr>
+   <tr><td colspan="3" align="middle"> <input type="button" onclick="sendSer('6')" value="舵机向下" /></td></tr>
-  </table>
+   </table>
-  </div>
+   </div>
-  <div style="float:left">
+   <div style="float:left">
-  <iframe width="640" height="480" src="http://192.168.1.1:8080/?action=stream"/>
+   <iframe width="640" height="480" src="http://192.168.1.1:8080/?action=stream"/>
-  </div>
+   </div>
 这个文件可以直接在本地运行，也可以放到/www下面，然后通过下面网址访问：
 	http://192.168.1.1/car.htm
-−
 ==硬件连接==
 . 将Microduino接上一个LED灯，并参考基础教程下载控制LED等的程序到Microduino core中。

项目四--智能家居原型 - 版本历史

Shengkai81@gmail.com：/* MicroWRT 网页控制 */

Shengkai81@gmail.com：Created page with "{| style="width: 800px;" |- | 本节教程将带领大家完成一个智能家居原型系统的搭建。正常使用的智能家居系统应该包含三个部分，云端服..."