背景

在我们进行LuCI应用开发的时候，我们需要先学习它的结构，以及基本的开发更新的方法。

1.大致了解结构

通过官方wiki-Modules我们了解到，一个Module可以好多目录，但重点只有：

目录名称	作用
src	存放c代码
luasrc	存放lua代码
lua	与luasrc一致
htdocs	前端代码

2. 从简单例子开始

我们从官方的示例上手，可能会遭遇到滑铁卢，我们可以尝试从网友们的项目开始，比如：sirpdboy-package，里面提到了很多插件，我们从一个叫luci-app-poweroffdevice的应用入手。

2.1. 如何写 Makefile

一个应用最基本的操作就是要让openwrt的 make menuconfig 检测到，所以第一步就是写好Makefile：

makefile 复制代码

#
# provides Web UI to shut down (power off) your device. 
# routers are listed at https://github.com/sirpdboy/luci-app-poweroffdevice
# This is free software, licensed under the GNU General Public License v3.

include $(TOPDIR)/rules.mk

PKG_NAME:=luci-app-poweroffdevice
LUCI_TITLE:=LuCI support for poweroffdevice Router
LUCI_DESCRIPTION:=provides Web UI to shut down (power off) your device. 

LUCI_PKGARCH:=all
PKG_VERSION:=1
PKG_RELEASE:=4

include $(TOPDIR)/feeds/luci/luci.mk

# call BuildPackage - OpenWrt buildroot signature

别看东西很多，我们先记住头和尾的include你大概率不用修改。其他的内容，关注这三个就够了：

配置项	作用
PKG_NAME	名称
LUCI_PKGARCH	包对应的指令集架构
PKG_VERSION	包的版本

2.2. 如何编译成ipk

首先我们确保下载下来的luci-app-poweroffdevice在我们的package/feeds/luci目录下。

现在我们移动到OpenWrt的根目录，开始执行

go 复制代码

make package/feeds/luci/luci-app-poweroffdevice/clean && make package/feeds/luci/luci-app-poweroffdevice/compile

这个操作结束后，你可以在类似于 /bin/packages/mipsel_24kc/luci/ 目录下看到你的 ipk 包，然后你通过scp命令上传到你的开发板上：

shell 复制代码

scp luci-app-poweroffdevice_1.0_all.ipk root@192.168.8.88:/tmp/

远程执行安装ipk的命令：

shell 复制代码

ssh root@192.168.8.88 "opkg install /tmp/luci-app-poweroffdevice_1.0_all.ipk"

一个ipk包就安装成功了，现在你可以在你的开发板的LuCI上见到这个菜单了。

2.3. 前后端目录结构是怎样的

如果我们观察 luci-app-poweroffdevice ，我们会发现结构相对清晰。它是这样组织的：

luasrc下有controller和view，view里就是htm，controller中就是后端。我们可以通过稍微修改htm文件查看效果。由于我们都不希望每次更新敲一堆命令行，所以我分享一个更新脚本给大家：

bash 复制代码

#!/bin/bash

increment_version() {
    # 将版本号按"."分割成数组
    IFS='.' read -r -a parts <<< "$1"

    # 获取最后一个元素的索引
    last_index=$(( ${#parts[@]} - 1 ))

    # 将最后一个部分转换为整数并递增
    (( parts[last_index]++ ))

    # 将递增后的数组重新组合成版本号字符串
    incremented_version=""
    for part in "${parts[@]}"; do
        incremented_version+="${part}."
    done
    incremented_version="${incremented_version%?}" # 删除末尾多余的点

    echo "$incremented_version"
}

cd /openwrt/package/feeds/luci/luci-app-poweroffdevice/
current_version=`cat Makefile|grep PKG_VERSION|awk -F '=' '{print $2}'`
new_version=$(increment_version "$current_version")
filename="Makefile"
sed -i "s/^PKG_VERSION:=.*$/PKG_VERSION:=$new_version/g" "$filename"
echo "version was updated to: $new_version"
echo "start make..."
cd /openwrt
make package/feeds/luci/luci-app-poweroffdevice/clean && make package/feeds/luci/luci-app-poweroffdevice/compile
echo "start to deploy..."
cd /openwrt/bin/packages/mipsel_24kc/luci/
file_path="./luci-app-poweroffdevice_${new_version}_all.ipk"
scp ${file_path} root@192.168.8.88:/tmp/
ssh root@192.168.8.88 "opkg install /tmp/luci-app-poweroffdevice_${new_version}_all.ipk"

这里插一句，如果你不提升Makefile中的版本号，有一定概率是会更新失败的。

2.4. 前端如何调用后端

我们知道怎么更新代码后，就需要知道前后端是如何交互的。这里我们可以看到前端的 poweroffdevice.htm 有这么一句：

js 复制代码

(new XHR()).post("<%=controller%>/admin/system/poweroffdevice/call", { token: "<%=token%>" }, check);

这里的 /admin/system/poweroffdevice/call 恰好对应 lua 脚本中的：

lua 复制代码

entry({"admin","system","poweroffdevice","call"},post("action_poweroff"))

这样你就会交互了，接下来就是看更多的例子了。比如luci-app-netdata可控制的实时监控，相信你用不了多久，就能够自如开发这样的插件了。

3. 致谢

感谢开源项目sirpdboy-package

OpenWrt-LuCI 插件开发入门

背景