|
大家好，上一章我们讲了在iTOP-4412开发板上搭建web服务器，这一章我 们在前面一章的基础上讲解一下通过web网页实现控制LED。 要实现控制led，我们需要CGI编程，CGI（Common Gateway Interface）是外 部应用扩展，应用程序与www服务器交互的一个标准接口。按照CGI标准编写的 外部扩展应用程序可以处理客户端浏览器输入的数据， 从而完成客户端与服务器的 交互操作。而CGI规范就定义了web服务器如何向扩展应用程序发送消息，在收 到扩展应用程序的信息后又如何进行处理等内容。通过CGI可以提供许多静态的 HTML网页无法实现的功能。比如搜索引擎、基于web的数据库访问等等。 首先进入到我们的NFS文件系统所在的目录，如下图：
在前面的搭建web服务器章节， 我们在修改boa.conf配置文件的时候指定了web 网页的存放目录“DocumentRoot /www” ，现在我们打开之前我们在www目录创建的index.html，如下图所示： 打开index.html后，删除掉里面的内容，然后输入下面的内容： <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>led远程控制</title> <style type="text/css"> body { background-color: #999900; text-align: center; } .ziti { font-size: 24px; } .juzhong { text-align: center; } .hsz { text-align: center; } .hsz td { color: #00F; font-size: 18px; } .hsz { background-color: #FCC; } .juzhong table { text-align: center; } .juzhong table tr { } #h1 { background-color: #0FC; } #h2 { background-color: #FF9; } .h3 { background-color: #0CF; } .ys1 { font-size: 24px; } .STYLE1 {font-size: 36px} </style> </head> <body class="juzhong"> <table width="900" border="0" align="center" cellpadding="0" cellspacing="0"> <tr> <td><p class="STYLE1"> </p> <p class="STYLE1">iTOP-4412 WEB SERVER </p></td> </tr> <tr> <td height="30"> </td> </tr> <tr> <td><form action="/cgi-bin/myled.cgi" method="get" enctype="application/x-www-form-urlencoded" name="form1" target="_blank" id="form1"> <table width="300" border="1" align="center" cellpadding="1" cellspacing="1"> <tr> <td>Led1</td> <td><input name="led1" type="checkbox" id="led1" value="1" /> <label for="led1"></label></td> </tr> <tr> <td>Led2</td> <td><input name="led2" type="checkbox" id="led2" value="2" /> <label for="led2"></label></td> </tr> <tr> <td colspan="2"><input type="submit" name="submit" id="submit" value="submit" /></td> </tr> </table> </form></td> </tr> <tr> <td ><p> </p> </td> </tr> </table> <p> </p> </body> </html> 如下图所示： 然后保存并退出。上面输入的是HTML格式的代码，主要是用到了通过表单向服 务器提交信息，在表单里面指定了服务器端处理接收到信息的CGI程序是myled， 这是在form表单的属性里设置的，代码是“form action="/cgi-bin/myled.cgi" method="get” ，使用的传递数据的方式是get方法，如下图所示： 修改完了index.html，我们需要些CGI程序。在boa的配置文件boa.conf里面 我们指定了CGI程序的存储目录是“ScriptAlias /cgi-bin/ /www/cgi-bin/” ，如 下图所示： 现在我们进入到NFS文件系统的www/cgi-bin目录，如下图所示： 然后再cgi-bin目录我们创建myled.c，如下图所示： 然后在myled.c里输入下面的代码： #include <stdio.h> #include <stdlib.h> int main() { char *data; int leds[2] = {0, 0}; long m, n; int exit=0,i,fd; printf("Content-Type:text/html;charset=gb2312\n\n"); printf("<html>\n"); printf("<body>\n"); printf("<title>iTOP-4412</title> "); printf("<h3>iTOP-4412</h3> "); data = getenv("QUERY_STRING"); printf("<p>receive data:%s</p>",data); while(*data != '\0') { if(*data=='=') switch(*(data+1)) { case '1':leds[0]=1;break; case '2':leds[1]=1;break; default:exit=1;break; } if(exit == 1) break; data++; } fd=open("/dev/leds",0); for(i=0;i<2;i++) { if(leds==1) printf("<p>%d\t</p>",i+1); ioctl(fd,leds,i); } printf("</body>\n"); printf("</html>\n"); return 0; } 如下图所示： 最后保存并退出。 上面的代码是C语言，主要是完成了获取web提交过来的数据，然后对获得的数 据解析，最后会调用led的ioctl函数来点亮或关闭led。里面的printf打印语句， 最终会生成一个web页面。接下来编译myled.c生成myled.cgi（在index.html 的表单里面设置了处理文请求的cgi程序是myled.cgi） ，使用命令 “arm-none-linux-gnueabi-gcc -o myled.cgimyled.c -static”编译myled.c， 如下图所示： 编译完成后，我们可以看到在www/cgi-bin目录下生成了myled.cgi，如下图所 示： 注意：生成的myled.cgi需要有可执行权限，所以我们使用chmod命令修改下它 的权限，如下图所示： 现在控制led的web程序就已经完成了，现在启动开发板，如下图所示： 通过上图我们可以看到iTOP-4412开发板已经起来了，然后打开PC的浏览器， 输入开发板的ip地址，如下图所示： 输入完成后，按回车，即可打开开发板的index.html页面，如下图所示： 我们可以选中led1和led2右边的复选框，如下图所示： 然后点击页面上的“submit”按钮，会打开一个新的web页面，如下图： 上图中的页面里面的信息就是我们的myled.cgi程序里面的printf打印出来的， 其中“receive data:led1=1&led2=2&submit=submit” ，就是客户端通过get方式传递给web服务器的数据，下面两行的1和2是myled.cgi程序从“receive data:led1=1&led2=2&submit=submit”里面解析出来的值。同时我们还可以在串口上看 到iTOP-4412开发板led驱动打印出来的信息，如下图所示： 至此通过web页面控制led的实验已经完成了，大家可以参照这个例程来自己实 现一个控制蜂鸣器的web程序。
| 
楼主
标题置顶
标题高亮
