openwrt ---Luci - 网页用户配置界面开发

最新推荐文章于 2023-09-06 11:16:51 发布

whatsyourname

最新推荐文章于 2023-09-06 11:16:51 发布

阅读量1.8k

点赞数

分类专栏： openwrt 文章标签： lua shell 嵌入式

本文链接：https://blog.csdn.net/whatsyourname/article/details/84740025

版权

openwrt 专栏收录该内容

8 篇文章 0 订阅

订阅专栏

本文介绍了如何在OpenWRT系统中对Luci网页用户配置界面进行修改和扩展，包括诊断页面的定制、lua文件的增删以及自定义页面的创建。通过实例展示了在lua文件中增加页面和修改现有页面的过程，并提到了错误处理和资源路径的注意事项。此外，还涉及了Luci的API和实现框架的学习资源。

摘要由CSDN通过智能技术生成

luci 参考资料

http://luci.subsignal.org/trac/wiki/Documentation

http://wiki.openwrt.org/doc/techref/preinit_mount?#first.boot

http://www.google.com.hk/search?q=Luci&hl=en&safe=strict&domains=openwrt.org&sitesearch=openwrt.org&prmd=ivnsl&ei=kDCrTc6UGI-WvAO63LH_CQ&start=0&sa=N

http://wiki.openwrt.org/doc/techref/luci

http://wiki.openwrt.org/doc/uci

http://wiki.openwrt.org/doc/techref/uci

LuCI作为“FFLuCI”诞生于2008年3月份，目的是为OpenWrt固件从 Whiterussian 到 Kamikaze实现快速配置接口。

Lua是一个小巧的脚本语言，很容易嵌入其它语言。轻量级. LUA语言的官方版本只包括一个精简的核心和最基本的库。这使得LUA体积小、启动速度快，从而适合嵌入在别的程序里。

UCI是OpenWrt中为实现所有系统配置的一个统一接口，英文名Unified Configuration Interface，即统一配置接口。LuCI,即是这两个项目的合体，可以实现路由的网页配置界面。

最初开发这个项目的原因是没有一个应用于嵌入式的免费，干净，可扩展以及维护简单的网页用户界面接口。大部分相似的配置接口太依赖于大量的Shell脚本语言的应用，但是LuCi使用的是Lua编程语言，并将接口分为逻辑部分，如模板和视图。

LuCI使用的是面向对象的库和模板，确保了高效的执行，轻量的安装体积，更快的执行速度以及最重要的一个特性————更好的可维护性。

与此同时，LuCI从MVC-Webframework衍生出一个包含了很多库、程序以及Lua程序用户接口的集合，但是LuCI仍然专注于实现网页用户界面并成为OpenWrt Kamikaze官方的一份子。

/www/index.html:

<a style="color: white; text-decoration: none" href="/cgi-bin/luci">LuCI - Lua Configuration Interface

在 web server 中的 cgi-bin 目录下，运行 luci 文件（权限一般是 755 ）， luci 的代码如下：

1 #!/usr/bin/lua -- 执行命令的路径

2 require"luci.cacheloader" -- 导入 cacheloader 包

3 require"luci.sgi.cgi" -- 导入 sgi.cgi 包

4 luci.dispatcher.indexcache = "/tmp/luci-indexcache" --cache 缓存路径地址

5 luci.sgi.cgi.run() -- 执行 run 方法，此方法位于 /usr/lib/lua/luci/sgi/cgi.lua中, 内容如下:

--[[

LuCI - SGI-Module for CGI

Description: Server Gateway Interface for CGI

]]--

exectime = os.clock()

module("luci.sgi.cgi", package.seeall)

local ltn12 = require("luci.ltn12")

require("nixio.util")

require("luci.http")

require("luci.sys")

require("luci.dispatcher")

-- Limited source to avoid endless blocking

local function limitsource(handle, limit)

limit = limit or 0

local BLOCKSIZE = ltn12.BLOCKSIZE

return function()

if limit < 1 then

handle:close()

return nil

else

local read = (limit > BLOCKSIZE) and BLOCKSIZE or limit

limit = limit - read

local chunk = handle:read(read)

if not chunk then handle:close() end

return chunk

end

function run()

local r = luci.http.Request(

luci.sys.getenv(),

limitsource(io.stdin, tonumber(luci.sys.getenv("CONTENT_LENGTH"))),

ltn12.sink.file(io.stderr)

)

local x = coroutine.create(luci.dispatcher.httpdispatch)

local hcache = ""

local active = true

while coroutine.status(x) ~= "dead" do

local res, id, data1, data2 = coroutine.resume(x, r)

if not res then

print("Status: 500 Internal Server Error")

print("Content-Type: text/plain\n")

print(id)

break;

end

if active then

if id == 1 then

io.write("Status: " .. tostring(data1) .. " " .. data2 .. "\r\n")

elseif id == 2 then

hcache = hcache .. data1 .. ": " .. data2 .. "\r\n"

elseif id == 3 then

io.write(hcache)

io.write("\r\n")

elseif id == 4 then

io.write(tostring(data1 or ""))

elseif id == 5 then

io.flush()

io.close()

active = false

elseif id == 6 then

data1:copyz(nixio.stdout, data2)

data1:close()

end

openwrt源：

1.转到OpenWrt根目录。

2.输入 ./scripts/feeds update

3.输入 ./scripts/feeds install -a -p luci

4.输入 make menuconfig

5.在”LuCI”菜单下你将找到所有的组件。

OpenWrt 安装包版本库：

1.添加一行文字到你的/etc/opkg.conf中，即将LuCI添加到版本库中:

src luci http://downloads.openwrt/kamikaze/8.09.2/YOUR_ARCHITECTURE/packages

2.输入 opkg update

3.LuCI 简版输入: opkg install luci-light

LuCI 普通版: opkg install luci

自定义模块的安装: opkg install luci-app-*

4.为了实现HTTPS支持，需要安装luci-ssl meta安装包

也许你想修改一下openWrt那个路由配置的丑陋界面，也许你想事项自己软件的一些功能。但是却没有办法去修改LuCI。在路由器上直接修改那就算了，我想说的是如何修改该LuCI的源代码，这样子你编译好的bin镜像文件直接刷入路由器中就ok了。你先得了解一下LuCI，包括它的模块怎么写的，用的是lua语言等：LuCI实现启动应用程序等脚本命令, 然后你想知道怎么将LuCI编译进固件中去：

输入./scripts/feeds/ install LuCI

这样子你会发现feeds文件夹下面有LuCI了，但是里面除了文件夹一无所有，但是回到menuconfig中去回发现有LuCI了，还可以选择ddns等模块，还可以选择中文语言了，可以编译到固件中去了。那么我们就编译一下试试吧。在dl文件夹中，我们看到了LuCI-0.10+svn7976.tar.gz, 这证明源码其实是在这里的

我们又进入build_dir/target-mips_uClibc-0.9.30.1这个文件夹下面发现了解压的上述文件了，好了，其实这个就是编译的文件夹啦。看看里面有什么？theme啊什么的，找个theme里面的header.htm改改编译后看看，发现在新的固件中已经出现了改动了。

好我再模仿application文件夹下面的一些程序如LuCI-ddns写了一个LuCI-smustar的配置程序界面放到这个文件夹下面，回头到menuconfig中发现没有啊，怎么办？别急回到feeds/LuCI/LuCI中找到makefile加入

$(eval $(call application,smustar,smustar for 802.1x,+PACKAGE_LuCI-app-smustar:smustar-scipts))

^_^，再回到menuconfig中就看到了，果断的选了，然后就编译到固件中去了

乎，折腾了我几天的LuCI终于在bulder_dir下找到源码可以修改，不过最好别该这里要改就makefile和dl下的源码吧，省的有时候buldr_dir下面的源码会呗dl下的那个压缩文件解压过去，扔在里面的文件就会丢失，小心！

自用修改:

--[[
luci 封装好的html控件类可以在以下文件查看：./host/usr/lib/lua/luci/cbi.lua

Diagnostics 页面相关文件: controller/admin/network.lua, view/admin_network/diagnostics.htm
HTM 页面的变量和lua交互, html中: name="ping", this.form.ping, lua中: diag_ping
<input style="width: 50%" type="text" value="openwrt.org" name="ping" />
<input type="button" value="<%:Ping%>" class="cbi-button cbi-button-apply" οnclick="update_status(this.form.ping,this.form.proto)" />
page = entry({"admin", "network", "diag_ping"}, call("diag_ping"), nil)

#只修改 name="pingxu", this.form.pingxu, 页面也执行, 出现如下错误:
No page is registered at '/admin/network/diag_pingxu/openwrt.org'.
If this url belongs to an extension, make sure it is properly installed.
If the extension was recently installed, try removing the /tmp/luci-indexcache file.
--- 再修改 diag_pingxu 则OK, page = entry({"admin", "network", "diag_pingxu"}, call("diag_ping"), nil)

在已有的lua文件中修改, 网页上可以直接看到界面; 增加或删除lua文件, 则必须重启路由器才可以看到界面

#lua中增加页面: view/xutest/web-cgi.htm, 后缀名必须为htm, 不能为html.
page.target = template("xutest/web-cgi")
/usr/lib/lua/luci/template.lua:81: Failed to load template 'xutest/web-cgi'.
Error while parsing template '/usr/lib/lua/luci/view/xutest/web-cgi.htm'.

#htm 中直接跳转
<a href="http://www.w3school.com.cn/index.html">W3School web

#/www/xutest/web-cgi.html, uhttp默认的跟目录和luci中的目录不同. 192.168.1.1 换成localhost 则错误
<a href="http://192.168.1.1/xutest/web-cgi.html">web-cgi

#index.html中直接执行luci命令
<a style="color: white; text-decoration: none" href="/cgi-bin/luci">LuCI - Lua Configuration Interface

]]--

page = node("admin", "network", "diagnostics")
-- 直接链接到 view 相应目录下面的 htm 页面
page.target = template("admin_network/diagnostics")
page.title = _("Diagnostics")
page.order = 60

参考:
1. luci在线API: http://luci.subsignal.org/api/luci/
2. luci实现框架: http://www.cnblogs.com/zmkeil/archive/2013/05/14/3078774.html

BusyBox v1.19.4 (2013-09-27 00:16:27 EDT) built-in shell (ash)
Enter 'help' for a list of built-in commands.

_______ ________ __
| |.-----.-----.-----.| | | |.----.| |_
| - || _ | -__| || | | || _|| _|
|_______|| __|_____|__|__||________||__| |____|
|__| W I R E L E S S F R E E D O M
-----------------------------------------------------
BARRIER BREAKER (Attitude Adjustment 12.09.1-qiushui007 test)
-----------------------------------------------------
* 1/2 oz Galliano Pour all ingredients into
* 4 oz cold Coffee an irish coffee mug filled
* 1 1/2 oz Dark Rum with crushed ice. Stir.
* 2 tsp. Creme de Cacao
-----------------------------------------------------

root@OpenWrt:~# df -h
Filesystem Size Used Available Use% Mounted on
rootfs 5.3M 272.0K 5.0M 5% /
/dev/root 1.8M 1.8M 0 100% /rom
tmpfs 30.2M 88.0K 30.1M 0% /tmp
tmpfs 512.0K 0 512.0K 0% /dev
root 30.2M 48.0K 30.1M 0% /tmp/root
overlayfs:/tmp/root 30.2M 48.0K 30.1M 0% /tmp/root
/dev/mtdblock3 5.3M 272.0K 5.0M 5% /overlay
overlayfs:/overlay 5.3M 272.0K 5.0M 5% /

root@OpenWrt:/xutest# opkg update
Downloading http://192.168.2.224/packages-ar71xx-AA/Packages.gz.
Updated list of available packages in /var/opkg-lists/snapshots.

root@OpenWrt:/xutest# opkg install luci
Installing luci (0.11.1-1) to root...
Downloading http://192.168.2.224/packages-ar71xx-AA/luci_0.11.1-1_ar71xx.ipk.
Installing uhttpd (2012-10-30-e57bf6d8bfa465a50eea2c30269acdfe751a46fd) to root...
Downloading http://192.168.2.224/packages-ar71xx-AA/uhttpd_2012-10-30-e57bf6d8bfa465a50eea2c30269acdfe751a46fd_ar71xx.ipk.
Installing luci-mod-admin-full (0.11.1-1) to root...
Downloading http://192.168.2.224/packages-ar71xx-AA/luci-mod-admin-full_0.11.1-1_ar71xx.ipk.
Installing luci-mod-admin-core (0.11.1-1) to root...
Downloading http://192.168.2.224/packages-ar71xx-AA/luci-mod-admin-core_0.11.1-1_ar71xx.ipk.
Installing luci-lib-web (0.11.1-1) to root...
Downloading http://192.168.2.224/packages-ar71xx-AA/luci-lib-web_0.11.1-1_ar71xx.ipk.
Installing luci-lib-core (0.11.1-1) to root...
Downloading http://192.168.2.224/packages-ar71xx-AA/luci-lib-core_0.11.1-1_ar71xx.ipk.
Installing lua (5.1.4-8) to root...
Downloading http://192.168.2.224/packages-ar71xx-AA/lua_5.1.4-8_ar71xx.ipk.
Installing liblua (5.1.4-8) to root...
Downloading http://192.168.2.224/packages-ar71xx-AA/liblua_5.1.4-8_ar71xx.ipk.
Installing libuci-lua (2013-01-04.1-1) to root...
Downloading http://192.168.2.224/packages-ar71xx-AA/libuci-lua_2013-01-04.1-1_ar71xx.ipk.
Installing libubus-lua (2013-01-13-bf566871bd6a633e4504c60c6fc55b2a97305a50) to root...
Downloading http://192.168.2.224/packages-ar71xx-AA/libubus-lua_2013-01-13-bf566871bd6a633e4504c60c6fc55b2a97305a50_ar71xx.ipk.
Installing luci-lib-sys (0.11.1-1) to root...
Downloading http://192.168.2.224/packages-ar71xx-AA/luci-lib-sys_0.11.1-1_ar71xx.ipk.
Installing luci-lib-nixio (0.11.1-1) to root...
Downloading http://192.168.2.224/packages-ar71xx-AA/luci-lib-nixio_0.11.1-1_ar71xx.ipk.
Installing luci-sgi-cgi (0.11.1-1) to root...
Downloading http://192.168.2.224/packages-ar71xx-AA/luci-sgi-cgi_0.11.1-1_ar71xx.ipk.
Installing luci-proto-core (0.11.1-1) to root...
Downloading http://192.168.2.224/packages-ar71xx-AA/luci-proto-core_0.11.1-1_ar71xx.ipk.
Installing luci-i18n-english (0.11.1-1) to root...
Downloading http://192.168.2.224/packages-ar71xx-AA/luci-i18n-english_0.11.1-1_ar71xx.ipk.
Installing luci-lib-ipkg (0.11.1-1) to root...
Downloading http://192.168.2.224/packages-ar71xx-AA/luci-lib-ipkg_0.11.1-1_ar71xx.ipk.
Installing luci-theme-openwrt (0.11.1-1) to root...
Downloading http://192.168.2.224/packages-ar71xx-AA/luci-theme-openwrt_0.11.1-1_ar71xx.ipk.
Installing luci-theme-base (0.11.1-1) to root...
Downloading http://192.168.2.224/packages-ar71xx-AA/luci-theme-base_0.11.1-1_ar71xx.ipk.
Installing luci-app-firewall (0.11.1-1) to root...
Downloading http://192.168.2.224/packages-ar71xx-AA/luci-app-firewall_0.11.1-1_ar71xx.ipk.
Installing luci-proto-ppp (0.11.1-1) to root...
Downloading http://192.168.2.224/packages-ar71xx-AA/luci-proto-ppp_0.11.1-1_ar71xx.ipk.
Installing libiwinfo-lua (36) to root...
Downloading http://192.168.2.224/packages-ar71xx-AA/libiwinfo-lua_36_ar71xx.ipk.
Installing libiwinfo (36) to root...
Downloading http://192.168.2.224/packages-ar71xx-AA/libiwinfo_36_ar71xx.ipk.
Configuring luci-lib-sys.
Configuring liblua.
Configuring libuci-lua.
Configuring lua.
Configuring libubus-lua.
Configuring luci-lib-core.
Configuring luci-lib-nixio.
Configuring luci-sgi-cgi.
Configuring luci-lib-web.
Configuring luci-proto-core.
Configuring luci-i18n-english.
Configuring luci-mod-admin-core.
Configuring libiwinfo.
Configuring libiwinfo-lua.
Configuring luci-theme-base.
Configuring luci-theme-openwrt.
Configuring luci-app-firewall.
Configuring luci-lib-ipkg.
Configuring luci-proto-ppp.
Configuring luci-mod-admin-full.
Configuring uhttpd.
Configuring luci.
Collected errors:
* resolve_conffiles: Existing conffile /etc/config/luci is different from the conffile in the new package. The new conffile will be placed at /etc/config/luci-opkg.

root@OpenWrt:/xutest# df -h
Filesystem Size Used Available Use% Mounted on
rootfs 5.3M 944.0K 4.4M 17% /
/dev/root 1.8M 1.8M 0 100% /rom
tmpfs 30.2M 388.0K 29.8M 1% /tmp
tmpfs 512.0K 0 512.0K 0% /dev
root 30.2M 48.0K 30.1M 0% /tmp/root
overlayfs:/tmp/root 30.2M 48.0K 30.1M 0% /tmp/root
/dev/mtdblock3 5.3M 944.0K 4.4M 17% /overlay
overlayfs:/overlay 5.3M 944.0K 4.4M 17% /