第十课--MicroWRT Web 移植

本节主要介绍如何在openwrt下进行LUCI的移植开发，大部分路由器的提供了web 配置方式，openwrt 也不例外， 有了web 界面就可以简单配置有关路由器的一些参数了，比如ip 地址，无线参数等，而且如果做自己的应用的话web 界面也少不了。 Openwrt 提供了两种web 界面，luci 和webif，这两种界面各有千秋。Luci 是官方提供的标准界面，webif 是第三方开发的界面。 他们有一个共同点是他们都是脚本，解释性语言。这就为他们的扩张提供了方便。本节教程主要介绍在openwrt上面web 的移植和开发， 对于web 的移植openwrt 已经做了集成移植比较简单，但是web 的开发官网上面介绍的非常少，所以这里也介绍下怎么增加一个简单界面， 为以后的扩张。 Luci 编译 首先介绍luci 的编译，luci 的编译比较简单。首先进入openwrt 的配置界面，进入luci 的界面选择页面，如下图所示： 文件:Luci1.jpg LUCI 文件:Luci2.jpg LUCI 文件:Luci3.jpg LUCI 选中luci，这样基本的luci 界面就选中了，然后保存退出编译即可，编译的话请参考编译章节。 这样编译出的固件即具有了luci 界面。任何一个web 界面都包括两部分内容，一部分是web 服务器， 一部分是界面语言，openwrt 的web 服务器默认采用uhttpd，端口80，web 界面语言为luci，luci 包括两部分内容，它是由lua 和uci 合并起来的，lua 是一种执行效率非常高的解释性语言，uci 是配置openwrt 的默认工具。对于uci 的使用后面章节会有介绍，这里就不说了。 编译好固件之后下载进去即可使用luci 了，默认的luci 界面如下所示： Luci 页面编辑 Luci 的界面用户目录在/usr/lib/lua/luci，luci 是mvc 架构，/usr/lib/lua/luci/下有三个目录model、view、controller， 它们对应M、V、C。下面简单介绍生成界面的方法。其中M 是已经生成的web 控件，其实这里就是写好的lua 脚本， V 是给外部提供的一些web 界面，C 控制其V 和M 的显示方式，从上面的描述可以看出C 部分是其入口的地方， 现在就进入controller 看看他的内容，其实它的入口地址在controller的admin 目录下面，里面的各个lua 文件就是各个入口， 比如system.lua 就对应的主界面的system 栏下面，咱们现在希望在system 栏中增加一个自定义的界面，这里为了方面描述只显示helloworld。 每个功能界面的入口地址为对应的lua 文件中entry 功能函数，entry 功能函数的原型为： entry(path, target, title=nil, order=nil) 前面两个参数是必须的，后面两个是可选的。Path 形如（admin，system，reboot），entry 根据这些属性创建节点， 比如上面内容代表在system 标签中的reboot 页面，target 是这里的重点，它描述了当用户调用这个界面所执行的行为。 这里主要由三种行为，call、template、cbi，其中call 为调用文件中的功能函数， template 为调用view 中的html 界面，cbi 为调用mode 中的lua 文件。Title 是在页面中显示的内容， order 是显示的顺序，顺序越小显示内容越靠前。下面在system.lua 中增加一条： entry({"admin", "system", "helloworld"}, template("admin_system/helloworld"), _("helloworld"), 99) 其中第一个参数代表一个节点，第二个参数，调用view/admin_system/helloworld.htm 文件， 第三个参数为显示的名字，第四个参数为显示顺序，这里在最后显示，其中helloworld.htm 文件的内容如下： <%+header%> <%:Hello World%> <%+footer%> 执行完之后可以看下界面的显示,可以看到system 下面有了helloworld 选项，点击他进入界面，如下图所示： 可以看到和界面内容保持一致。这样一个简单的界面就增加成功了，不过只是简单显示了一条语句， 要增加更复杂的内容，读者可以学习相关的资料做后续开发。