整合营销服务商

电脑端+手机端+微信端=数据同步管理

免费咨询热线:

基于OpenWrt系统路由器的模式切换与网页设计

基于OpenWrt系统路由器的模式切换与网页设计

: 目前商用WiFi路由器已应用到多个领域,商家通过给用户提供一个稳定免费WiFi热点达到吸引客户、提升服务的目标。传统路由器自带的Luci界面提供了工厂模式的Web界面,用户可通过该界面配置路由器。Luci采用MVC模式(Model-View-Controller)构造网页,能实现动态的程序设计,便于修改和扩展。本文主要针对OpenWrt系统的路由器,介绍如何使用Lua和JavaScript脚本语言添加用户模式Web界面。此外,还介绍了工厂模式和用户模式之间的切换、添加Web页面的方法,给出了一些应用实例。

0 引言

基于OpenWrt系统的家用路由器作为免费WiFi以及广告投放的解决方案,具有成本低、部署灵活的优点,被广告商家以及大型连锁门店以集中投放、集中管理的方式运用[1]。采用该方式需要解决以下问题:精简配置管理界面,便于大规模投放部署;屏蔽认证页、广告页投放等设置,避免路由器的经营价值受损。因此需要在路由器管理界面中设定工厂模式以及用户模式,以便于设备的管理、调试、部署[2]。

本文首先介绍了OpenWrt系统网页的工作原理,然后具体介绍了如何添加用户模式以及用户模式和工厂模式的切换原理,接下来分析了基于Luci编写网页的具体过程。文章的最后对下一步的改进工作提出展望。

1 Luci搭建网页

要理解Luci是如何搭建网页的,首先就要了解Luci、Uhttpd、CGI、MVC几个概念。

Luci是OpenWrt上的Web管理界面,它提供给用户UCI、API接口组件,用于用户在Web界面上对路由器进行管理与设置。Luci由Lua编写完成,Lua是一种扩展语言,几乎在所有操作系统和平台上都可以编译、运行。实际上,Lua程序的工作流程是嵌入到其他的程序中运行的[3]。

Uhttpd是OpenWrt系统路由下的一个精简的Web服务器,它具有非常低的内存开销,CPU占用率低,效能好,通常用于轻量级的嵌入式设备[4]。Uhttpd是Luci默认的Web服务器,通过Web界面修改相关参数配置路由器。

CGI(Common Gateway Interface)是通用网关接口,它是外部应用程序与Web服务器之间的接口标准[5]。CGI规定了CGI程序和Web服务器之间传递信息的规则和流程[5]。通常Web服务器Uhttpd的功能并没有强大到直接运行php、asp这样的网页文件,因此与第三方约定,把请求参数发送至第三方,然后接收第三方处理结果给客户端。Lua语言编写的Luci就是这个第三方。

用户端与Web服务器Uhttpd使用CGI方式交互。Uhttpd服务器在工作过程中分叉出一个子进程,用于处理用户的具体需求,然后传递给Luci,并在网页中将子进程的结果进行显示。

Luci、Uhttpd、CGI与网页之间的关系如图1所示。

Luci采用MVC(Model-View-Controller)模式搭建网页。MVC模式把软件系统分为三个基本部分:模型(Model)、视图(View)和控制器(Controller)。

(1)控制器(Controller):负责转发和处理请求。

(2)视图(View):设计的网页界面。

(3)模型(Model):数据模型,是客观事物的抽象。

使用MVC模式的目的是实现一种动态的程序设计,使后续对程序的修改和扩展简化,并且使程序某一部分的重复利用成为可能[6]。

Controller、View、Model三者之间的关系如图2所示[7]。

2 用户模式切换

2.1 MVC框架设计

Luci是一个单用户框架,在/usr/lib/lua/luci/下有三个目录,分别是model、view、controller,它们对应M、V、C[6]。公用的模块放置在/usr/lib/lua/luci/controller/下面,各个用户的模块放置在该路径下面对应的文件夹中。如路由器自带的工厂模式就位于该目录下的admin文件夹下。新增用户模式需新添加文件夹mini,然后在该路径下添加功能程序。这样既有效地管理了不同管理员的权限,又有利于系统的拓展和维护。Controller、Model、View生成网页的关系如图3所示。

在controller目录下,每个Lua程序都以index作为起始函数。在index函数中,通过调用entry函数创建子节点,并把它放在全局节点树的相应位置。entry函数的参数规定了该节点的位置属性。

2.2 利用控制器生成Target

Controller目录下的子节点以Target的方式生成网页。Target是由每个子节点的entry函数创建的,这是dispatch流程最后要执行的方法。Target主要有alise、firstchild、call、cbi、form和template 6种生成方式。总体上可以分成两类,前两种主要用于链接其他节点,后四种则是实现函数方法或页面跳转[7]。

链接节点:alias是网页节点之间的链接。比如,当用户登录路由成功后,进入的网页节点未定义内容,可以用alias的方法,自动链接到有内容的Web节点。

实现函数方法或页面跳转:这种方法一般用于一个路径的叶节点leaf,执行相应的操作,并且动态生成页面html文件,传递给用户。在call、cbi、form、template四种方法中,call调用了自定义的功能函数,直接调用以实现特定的目标,如发送数据、读取文件等。调用cbi函数能够使用CBI模块简洁高效地生成网页。函数template是直接链接到目录view下面的htm页面,实现网页跳转。

如果要添加用户模式(Mini),就必须在Controller目录下添加文件夹mini。这样Luci就能够直接从Controller目录下读取子节点的数目及名称,以便生成对应的节点树。在用户模式的mini目录下至少添加两个文件。第一个是index.lua文件,index.lua程序是为了实现用户名、密码的认证和网页节点的配置。第二个是要具体实现的功能网页,该网页定义了生成的Target。以显示路由系统状态为例,需要添加index.lua和system_state.lua文件。

添加的用户模式(Mini)文件结构如图4所示。

要说明的是,此处system_state.lua规定是用template的方式生成Target,直接跳转到view/mini文件夹下的system_state.htm文件。

实际上,用户模式和工厂模式都是使用Luci搭建网页,二者之间的原理完全相同。不同的是,在用户模式下,给用户显示的是更加贴近实际使用需求的页面。此外,使用用户模式,关闭工厂模式的部分功能,还能使路由器更加高效地运转。

在成功添加了用户模式后,就要考虑登录认证的问题。只有输入正确的用户名和密码之后,才能成功登录用户模式。用户模式下的所有子节点是由上而下逐层索引的,因此只要有一个节点需要认证,在该节点下的所有子节点也需要认证。只要mini节点有sysauth值,它以下的所有子节点都需要认证才能查看、操作。

此外,OpenWrt的精简内核是单用户机制,路由器自动以root用户登录。也就是说,工厂模式和用户模式使用的是同一个用户名和密码。通过认证后,服务器端会发给用户端一个session值,该值以cookie的形式存在于请求报文中,供服务器识别用户。

2.3 Footer页脚标签

用户成功登录路由后,要求能够在工厂模式与用户模式之间自由切换。这个任务就由Footer页脚标签来完成。Footer的工作原理是由Luci的主题决定的,主题包含两个内容,分别是header.htm和footer.htm。header.htm能显示每个页面的菜单栏,footer.htm则会读取Controller目录下的节点,最终显示在页脚中,以链接的方式切换用户。

Footer页脚标签的工作原理如图5所示。

在成功添加页脚之后,整个添加用户模式和模式切换的工作就完成了。结果如图6所示,其中footer.htm显示在右下方,user model就是添加的用户模式。

3 网页设计

前面提到,为了在用户模式下生成满足特定功能的网页,需要在controller/mini目录下添加index.lua和system_state.lua两个文件。在system_state.lua中,规定网页是以template的方式链接到view/mini文件下的system_state.htm文件。这样只要设计system_state.htm的内容,就可以实现对应的功能。

system_state.htm是将Lua和JavaScript两种语言配合使用来完成相应的功能。如果编写的功能模块不需要访问路由器的数据,则利用Lua和JavaScript可以比较轻松地实现[4]。特别地,还可以调用一些辅助性Shell script。在网页中,利用Lua语言的luci.sys.exec函数,就可以调用shell脚本。

例如,要测试路由器与外网是否连通,可以简单地通过ping命令,访问某一主流网站即可。如果ping通,则返回值为1,否则返回0。该功能可以用shell脚本写,在网页中使用如下命令:

state=tonumber(luci.sys.exec("/shellfun/pingtest"))

这样就能执行/shellfun文件夹下的pingtest.sh Shell脚本,返回是否连通的状态,在网页中显示相应的内容。

如果编写的功能模块需要访问路由器的数据,这就需要一个从Lua脚本到JavaScript脚本数据交互的过程。因为JavaScript不太适合直接访问路由器的数据,一般都是由Lua脚本程序读取路由器的数据。然后,用JSON(JavaScript Object Notation)这种轻量级的数据交换格式发送给JavaScript脚本,利用JavaScript脚本在网页上显示出传递的数据。

例如,当要在网页中显示某一端口的实时流量时,需要不断地访问路由器的端口流量数据。可以在/luci/controller/mini的system_state.lua中某一节点规定,通过Lua的函数不断地访问数据,然后用JSON数据格式输出数据[5]。在JavaScript脚本中,利用XHR.poll函数每隔一段时间接收JSON数据,最后将数据以图表的方式动态显示。

最终实现的路由器连通测试和流量监控结果如图7所示。

4 结论

本文深入地分析了路由器Web系统Luci搭建网页的原理和实现细节。MVC模式是软件工程实现网站搭建的核心,通过MVC模式,大大简化了网站的开发和维护工作。在设计网页的过程中,介绍了Lua和JavaScript如何进行数据交互,以及如何配合外部的shell脚本实现特定功能。

目前家用路由已经支持采用TF卡、U盘等外置存储硬件,可以采用Luci搭建接口实现路由器本地存储以及内容的投放,使之具有更高的运营价值和潜力。

参考文献

[1] 海虎,李涛,韩俊刚,等.多态并行处理器的数据通信和路由器的设计[J].电子技术应用,2014,40(8):38-40,47.

[2] 朱云雷.基于互联与认证的无线路由器关键技术[J].微型机与应用,2014,33(24):57-58,65.

[3] 张一弓.基于OpenWrt平台的进程问通信[J].科技创新与应用,2014(21):62.

[4] KIM C G, KIM K J. Implementation of a cost-effective home lighting control system on embedded Linux with OpenWrt[J]. Personal & Ubiquitous Computing, 2014, 18(3):535-542.

[5] PALAZZI C E, BRUNATI M, ROCCETTI M. An OpenWrt solution for future wireless homes[C]. 2010 IEEE International Conference on Multimedia and Expo, IEEE Computer Society, 2010:1701-1706.

[6] 吵吵博客.LuCI界面开发之CBI模块[EB/OL].(2011-09-04)[2015-06-30]http://www.chaochaoblog.com/archives/698.

[7] 吵吵博客.LuCI实现启动应用程序等脚本命令2011[EB/OL].(2011-09-03)[2015-06-30]http://www.chaochaoblog.com/archives/691.

微笑]关键字:腾讯云、DDNS、动态域名、公网IP、群晖、软路由、openwrt、lede

#奇妙知识季#

本文快速的教大家解决域名绑定动态公网IP的问题,帮助大家实现用域名登录家里的设备。

首先您需要一台支持腾讯云DDNS功能路由器,如openwrt、ikuai均可。

这里用openwrt做示范,openwrt具有众多优势,如插件安装自如,相比任何路由固件。

1、安装腾讯云DDNS插件

OpenWRT TencentDDNS插件是一款腾讯云研发的,自动映射动态公网IP至用户指定的DNSPod域名解析记录的官方插件。可在安装了openwrt的软路由上,将运营商分配的家庭宽带公网IP动态关联到指定的DNSPod域名解析记录上。实现通过域名访问家庭内网服务的目的。

标题

名称

中文名称

腾讯云DDNS插件

英文名称

luci-app-tencentddns

最新版本

0.1.0 (2020.09.17)

适用平台

Lean OpenWRT(opens new window)

适用产品

DNSPod(opens new window)

GitHub项目

tencentcloud-openwrt-plugin-ddns(opens new window)

gitee项目

tencentcloud-openwrt-plugin-ddns(opens new window)

主创团队

腾讯云中小企业产品中心(SMB Product Center of Tencent Cloud)

推荐安装方式如下:

登录OpenWrt路由器,进入系统>软件包>动作页面,将下方软件包的地址放入从网络安装的输入框中,点击确认完成安装。 ipk安装地址:https://openwrt-tencentddns-1301800460.cos.ap-guangzhou.myqcloud.com/luci-app-tencentddns_0.1.0-1_all.ipk

官方指导页面如下:

https://openapp.qq.com/docs/OpenWRT/ddns.html

安装完毕后,在过滤器里搜索:tencentddns,检查搜索结果是否正确,显示有结果,版本号对应上即可。

之后找到:网络>腾讯云DDNS菜单,即可找到该插件的配置页面,里面有密钥ID、密钥Token、主域名、子域名等配置需要配置。继续往下看。

名词解释

启用:是否开启腾讯云DDNS

清除所有同名记录:如果一个域名有多个A解析记录,是否一并清除

密钥ID:DNSPod后台密钥管理中的ID,获取地址:DNSPod密钥管理(opens new window)

密钥Token:DNSPod后台密钥管理中的Token。获取地址:DNSPod密钥管理(opens new window)

主域名:主域名,如: github.com

子域名:子域名,如:www

检查时间:后台对域名解析检查的时间间隔

2、申请腾讯云域名

有了腾讯云DDNS插件,我就需要一个域名,当然家里必须要是拨号的公网IP。这是前提。百度搜索腾讯云,点击控制台,经过一系列的认证申请,直到成功登录腾讯云账号。

接入输入dnspod搜索dns业务

进入DNSPOD控制台页面后,点击域名注册,右侧弹出页面点击立即注册。

搜索框输入你想注册的域名,如:qazwsx.top,点击查询,寻找没有注册的域名即可注册。

找一个性价比高的入手,加入购物车,点击立即购买后,会有一个信息模板要求完善,按照要求完成每一步的信息填写和实名认证即可。

注册完毕后,就可以进入https://console.dnspod.cn/控制台,DNS解析>我的域名菜单,就能看到新购买的域名了。

这里我们需要先手动添加基础的解析条目,后面再由DDNS插件自动更新。

点击蓝色的域名名字,进入域名设置

点击添加记录,

记录类型:选A

主机记录:输入域名前面名字,比如openwrt,域名组合后就是openwrt.qazwsx.top

IPV4地址:先随便填,后面由DDNS插件自动更新为公网IP

权重:空

TTL:600

添加好后如下截图。后面开始申请API绑定,实现自动更新公网IP

3、申请腾讯云DDNS POD API

在https://console.dnspod.cn/控制台右上角头像处,点击头像,弹出的菜单选择API密钥,点击后进入API申请页面,选择DNSPod Token。

点击创建密钥,输入密钥名字,后面自动生成密钥

密钥只会展现一次完整,赶紧复制粘贴,接下来需要复制到DDNS插件里。

4、配置OpenWrt DDNS插件

返回本地openwrt配置页面:网络>腾讯云DDNS菜单。点击启用,填入对应信息。

其中openwrt作为旁路由的话,WAN-IP来源选择internet即可,主域名填购买的域名,子域名填dnspod控制台添加的解析记录的“主机记录“名字。这样子域名+主域名+api token,ddns插件就能主动上传动态IP到DDNS后台进行绑定。腾讯无非就是将整个IP的获取,上传,解析更新实现自动化。

设置好后,返回dnspod控制台,过一会添加的记录就会更新。原来设置的192.168.100.2地址自动变成公网IP。

5、检查DDNS更新信息

检查DDNS插件日志,检查dnspod控制台解析记录是否更新成功

这个时候,虽然看到解析成功了,域名成功绑定公网IP,但是你的路由器还没有做端口映射,公网登录后是没有任何内容的,请继续往下看。

6、端口映射

进入主路由,以我的ikuai为例,进入菜单:网络设置>端口映射>添加菜单。

输入需要映射的内网ip+port,协议选择全部,映射类型选择外网接口,外网端口设置大一点,减少扫描风险,允许访问ip可以设置成你单位的公网IP,将进一步提高访问安全。最后保存。之后就可以用你的域名进行公网登陆了。记得域名尾部加端口。

7、测试

以实现路由器功能的开源软件很多,为什么只有OpenWrt成功了?OpenWrt软件成功的关键在于3个方面:领导者、基础设施以及实现软件的技术。通常领导者是最重要的,因为领导者决定着社区的规则和技术方向,但是每个人都是独特的而且是无法复制的,因此通常无法借鉴。基础设施和实现软件的技术则是可以借鉴的。

OpenWrt社区采用六大基础设施工具支撑整个社区的运转,这六大基础设施工具分别是代码管理工具Git、邮件列表、自动构建工具buildbot、文档管理工具WiKi、Trac和技术论坛。

代码管理工具Git

代码管理工具Git可以跟踪文件和目录的历史信息,包含4个W(Who、When、Why和What),即谁做了修改,什么时间做了修改,为什么修改以及修改的内容是什么。此外,Git还支持分布式代码仓库,适合开源软件项目的跨地域开发,这个工具可以让每个人看到代码的变化过程。OpenWrt经过了12年的发展,代码仓库还保留了最初的提交记录。

邮件列表

邮件列表是代码审查及代码提交集成的地方,开发人员将修改代码生成补丁发送给所有的邮件订阅者,每个人都可以进行代码评审,核心开发人员看到后会将代码集成到代码仓库中。邮件内容可以永久保存到邮件列表中。邮件列表和普通邮件的主要区别在于订阅机制和存档机制,每个人都可以自由订阅并查看历史邮件。

自动构建工具buildbot

自动构建工具buildbot的核心是一个作业调度系统,它会将任务排队,当提供了任务所需的资源时,执行任务并报告结果。buildbot不仅仅支持持续集成及自动化测试,还支持应用程序的自动化部署和软件发布的管理。同时在多个平台开发时,通常最后的编译验证都是重复的,编译机器人(buildbot)将这一部分接管过来,每日自动下载代码进行编译验证,并将安装包上传到文件服务器上,如果编译失败则将用邮件通知感兴趣的人。

文档管理工具WiKi

文档管理工具WiKi的特点是具有开放性,可以让任何参与人员非常方便地进行编辑、访问和搜索。大多数软件公司的软件文档均保存为二进制格式,在经过一段时间和人员流动之后,这些文档就会成为固定的资料,因为它会被遗落在某个角落而无法找到,而OpenWrt社区的软件开发文档和使用手册均保存到WiKi上。WiKi是一个协同写作和分享平台,允许所有人修改页面。WiKi使用简化的语法来代替复杂的HTML语言,降低了内容维护的门槛。

Trac

Trac是一个集成WiKi和问题跟踪管理系统的项目管理平台,可以帮助开发人员更好地管理软件开发过程,从而开发出高质量的软件。任何人都可以使用该系统来提交Bug并查询当前的进展。Trac采用面向进度的项目管理模型,采用里程碑的方式来组织开发。里程碑是以ticket(问题)来组织的,所有的问题都解决了,就到达了里程碑。但社区并不完全遵从这个标准,因为其开发人员全部是志愿者,通常到了一定时间会发布一个版本。

技术论坛

技术论坛是一个技术讨论的平台,每个注册用户均可发帖参与讨论。在开发过程中,每个新版本的说明通过该平台发布。

社区的运转是通过以上所述的六大基础设施工具来实现的,我们通过这些工具可以理解到,开源软件和社区的精髓在于其开放性,任何人员均可以通过网络自由地获取其信息并参与其中,这样可以激励每个人贡献出自己的力量,开发人员同时也从社区获得回报。开源社区的工具大多都是相同的,掌握这些工具可以帮助你深入了解开源社区和OpenWrt。

OpenWrt技术上成功的秘诀在于:统一编译框架、统一配置接口(Unified Configuration Interface,UCI)、开放的软件包管理系统及其读写分区系统、系统总线ubus和进程管理模块procd。

  • 统一编译框架使得数千个软件以相同的方式进行编译,并且可以在几十个平台编译。每个软件模块按照相同的步骤进行代码下载、解压缩、打补丁、配置、编译及生成安装包。
  • 统一配置接口使得数千个软件在几十个平台上以相同的方式来存取配置数据,配置以统一格式的文本文件进行管理。
  • 开放的软件包管理系统和读写分区系统使得软件管理非常方便,并且能够方便地处理软件包的依赖关系。读写分区系统可以自由地安装软件,而不像大多数专有系统需要全部重新编译才能安装新的软件。
  • 系统总线ubus。每个进程均可以注册到系统总线上进行消息传递,并且提供命令行工具来访问系统总线。
  • 进程管理模块procd。每一个进程交给procd来启动,并在意外退出之后再次调用。

所有的这些功能并不是一次性设计出来的,而是随着时间的推进,根据用户和开发进展逐步发展起来的,每一种技术都有其独特的价值。


本文节选自《智能路由器开发指南 》

内容简介


OpenWrt是在实现路由器功能方面最受欢迎的开源软件之一。本书基于OpenWrt,详细介绍了智能路由器的开发。

本书共计15章,按照认识路由器的顺序进行编写,介绍了智能路由器、开发环境及编译分析、OpenWrt包管理系统、OpenWrt配置、软件开发、GDB调试、网络基础知识、路由器基础软件模块、常用软件模块、IP路由、DNS与DHCP、iptables防火墙、UCI防火墙、UPnP、网络测试及分析工具等。丰富的理论知识和代码示例可以帮助读者深入认识和理解OpenWrt技术,并能够提升开发水平和开发效率。

本书适合软件架构师、软件开发工程师、软件测试工程师以及计算机相关专业的学生阅读。读者通过阅读本书,不仅可以掌握OpenWrt技术,还能进一步提升自己的软件开发水平。