1. 程式人生 > >Openwrt Luci介面開發

Openwrt Luci介面開發

Openwrt已經提供了一個很強大的web管理介面Luci,可以方便的管理路由器。我們在開發智慧路由器時,一般就需要在OpenWrt的WEB介面增加內容。

1.Luci簡介

LuCI是OpenWrt上的Web管理介面,LuCI採用了MVC三層架構,使用Lua指令碼開發,所以開發LuCI的配置介面不需要編輯任何的Html程式碼,除非想自己單獨去建立網頁(View層),否則我們基本上只需要修改Model層就可以了。

2. 新增選項Test

接下來介紹如何在“System”新增Test選項卡。

在檔案系統目錄“/usr/lib/lua/luci/controller/admin”下建立test.lua檔案,檔案內容如下:

module("luci.controller.admin.test", package.seeall)

function index()
    entry({"admin", "test"}, alias("admin", "test", "test"), _("Test1"), 30).index = true
    entry({"admin", "test", "control"}, cbi("admin_test/control"), _("ControlTest"), 1)
end

/etc/init.d/uhttpd restart 重啟http服務之後,重新整理介面之後(有時候因為快取,介面沒有及時變化,rm -rf /tmp/luci-* 刪除快取就可以了
),介面變成


test.lua中 entry表示新增一個新的模組入口,entry的定義如下,其中後兩項都是可以為空:

entry(path, target, title=nil, order=nil)

“path”是訪問的路徑,路徑是按字串陣列給定的,比如路徑按如下方式寫“{"admin", "test", "control"}”,那麼就可以在瀏覽器裡訪問“http://192.168.1.1/cgi-bin/luci/admin/test/control”來訪問這個指令碼。其中的“admin”表示為管理員新增指令碼,“test”即為一級選單名,“control”為選單項名。系統會自動在對應的選單中生成選單項。比如想在“System”選單下建立一個選單項,那麼一級選單名可以寫為“system”。
        “target”為呼叫目標,呼叫目標分為三種,分別是執行指定方法(Action)、訪問指定頁面(Views)以及呼叫CBI Module。
第一種可以直接呼叫指定的函式,比如點選選單項就直接重啟路由器等等,比如寫為“call("function_name")”,然後在該lua檔案下編寫名為function_name的函式就可以呼叫了。
第二種可以訪問指定的頁面,比如寫為“template("myapp/mymodule")”就可/usr/lib/lua/luci/model/cbi以呼叫/usr/lib/lua/luci/view/myapp/mymodule.htm檔案了。
第三種主要應用在配置介面,比如寫為“cbi("myapp/mymodule")”就可以呼叫/usr/lib/lua/luci/model/cbi/myapp/mymodule.lua檔案了。
title和order是針對管理員選單的,其中的title即是顯示在網頁上的內容。這裡我們建立“/usr/lib/lua/luci/controller/admin/test.lua”檔案,定義我們的入口為“test”。

3新增cbi指令碼

由test.lua中cbi指示的目錄,在“/usr/lib/lua/luci/model/cbi/admin_test”目錄下有control.lua指令碼。

1.在/usr/lib/lua/luci/model/cbi在新建admin_test目錄

2.在admin_test中新建control.lua檔案,新增內容

require("luci.sys")
require("luci.sys.zoneinfo")
require("luci.tools.webadmin")
require("luci.fs")
require("luci.config")

local m, s, o

m = Map("test", translate("Test"), translate("This is simple test."))
m:chain("luci")

s = m:section(TypedSection, "controlboard", translate("Control Board"))
s.anonymous = true
s.addremove = false


s:tab("led", translate("Control LED"))
s:tab("beep", translate("Control Beep"))
--s:tab("adc", translate("Control Adc"))

--
-- LED
--
o = s:taboption("led", ListValue, "lednum", translate("LED NUM:"))
o.default = 0
o.datatype = "uinteger"
o:value(0, translate("LED0"))
o:value(1, translate("LED1"))
o:value(2, translate("LED2"))

o = s:taboption("led", ListValue, "ledstatus", translate("LED STATUS:"))
o.default = 1    --off status
o.datatype = "uinteger"
o:value(0, translate("LED ON"))
o:value(1, translate("LED OFF"))


--
-- BEEP
--
o = s:taboption("beep", ListValue, "beepstatus", translate("BEEP STATUS:"))
o.default = 1    --off status
o.datatype = "uinteger"
o:value(0, translate("ON"))
o:value(1, translate("OFF"))

o = s:taboption("beep", Value, "beepfreq", translate("BEEP FREQ:"))
o.datatype = "uinteger"
<span style="color: rgb(92, 92, 92); font-family: Consolas, monospace; letter-spacing: 0.100000001490116px; line-height: 1.3;">return m</span><span style="color: rgb(92, 92, 92); font-family: Consolas, monospace; letter-spacing: 0.100000001490116px; line-height: 1.3;">return m</span>



該指令碼表示讀取/etc/config下的test檔案,因此我們需要在/etc/config/中新增test檔案。並在檔案中新增:config controlboard

重啟uhttpd服務後,重新整理後介面為: