请教一下如何快速开发嵌入式设备的 web 管理页面 - V2EX
V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
tkwl
V2EX    嵌入式开发

请教一下如何快速开发嵌入式设备的 web 管理页面

  •  
  •   tkwl 2020-06-07 20:50:18 +08:00 5102 次点击
    这是一个创建于 1952 天前的主题,其中的信息可能已经有所发展或是发生改变。
    原始需求就是常见网络监控摄像头的参数设置,登陆后主页面可以在各个 tab 里设置各个参数,而且当后台监控数据变化时,也能及时反应到页面上。
    google 搜了下 web server examples on embedded devices,但大多数页面都是在比较 lightttp uhttpd thttpd Goahead 等 web server 本身,看起来感觉大同小异都是通过某种方式操作 c 程序读取 http request,但是我不太了解怎么和后台已有的程序交互数据呢?必须使用数据库吗?刷新部分数据该怎么操作呢?一般这个 c 程序是执行一次 request 就退出吗?还是一直在后台工作,等 web server 发信号过来?

    其实我是想学习一下实际嵌入式项目上的 webpage 是如何实现的,js 也好,lua 也好,在 github 上都没有找到相关的项目,欢迎各位大佬推荐。
    也有考虑过 openwrt 的管理网页,正在学习中感觉有些复杂。
    本人有 c 语言背景,其他 HTTP 、JS 、Lua 都是听说过不太懂,资质愚钝各个概念还不是很清楚,但是学习下修改应该没问题。
    15 条回复    2020-06-08 00:29:48 +08:00
    zdianj
        1
    zdianj  
       2020-06-07 20:55:04 +08:00
    数据存储可以直接存 flash,一般有单独的存储空间,或者是直接存在 flash 的文件系统上。数据交互可以通过 html 的 js 跟 cgi 交互。比较传统的做法是 c 写 cgi 。也可以移植 php 之类开发会更简单但是占空间和内存。
    tkwl
        2
    tkwl  
    OP
       2020-06-07 21:01:27 +08:00
    @zdianj 谢谢,目前 github 上不知道如何搜索成熟的项目,有些 web server 的小例子都是直接在 c 代码里直接 write html 代码,这个应该不是通用的做法吧,难道不是先搞个 html 模版之类的吗,所以想看看真实项目是怎么搞的
    像 openwrt 是通过 cgi 调用 lua 程序吗?
    anviod
        3
    anviod  
       2020-06-07 21:12:59 +08:00
    最近也在调试嵌入式 http server 你去看看 https://github.com/cesanta/mongoose 你开发板用的什么片子,内存够不。 你写好 CGI 接口 前端 用 js 代码调用就好
    ysc3839
        4
    ysc3839  
       2020-06-07 21:13:05 +08:00
    许多路由器厂商的方案是基于一些简单的 C 语言的 http 服务器进行开发,加个简单的模板引擎,然后 http 服务器上再实现 API 接口用于更新设置或者执行某些操作。
    这类方案可以参考 Padavan 的 WebUI 。
    httpd 下面是 http 服务器的代码 https://gitlab.com/padavan-ng/padavan-ng/-/tree/master/trunk/user/httpd
    www 下面是 Web 模板的代码 https://gitlab.com/padavan-ng/padavan-ng/-/tree/master/trunk/user/www

    OpenWrt 用的 luci 一开始是用 lua 实现的后端渲染,近期在修改为前后端分离,页面由前端 js 渲染,通过 rpc 接口跟后端交互,逐步去除对 lua 的依赖。
    tkwl
        5
    tkwl  
    OP
       2020-06-07 22:34:12 +08:00
    @anviod 谢谢,mongoose 和 civetweb 都实践了一下,就差实际的项目例程看看,example 还是太抽象了,不做过具体 HTTP 有些概念还是不好理解
    vus520
        6
    vus520  
       2020-06-07 22:37:20 +08:00
    如果存储够用,可以考虑 go 一把梭。唯一的问题就是编译的包会比较大,基本上都是 1MB 往上
    zdianj
        7
    zdianj  
       2020-06-07 23:29:51 +08:00
    @tkwl 两种做法都是常见的,第一种算是预留做法了,现在很少这么做,openwrt 是的 lua 就是 cgi,也是模版渲染器。过程:浏览器->uhttpd->lua 。
    zdianj
        8
    zdianj  
       2020-06-07 23:30:20 +08:00
    @vus520 一般来说这种做法都太奢侈。。看设备了。
    zdianj
        9
    zdianj  
       2020-06-07 23:31:37 +08:00   1
    @tkwl 看了下 @ysc3839 的信息 已经很好了。照着去看就行了。
    tkwl
        10
    tkwl  
    OP
       2020-06-07 23:40:01 +08:00 via iPhone
    @zdianj @ysc3839 两位信息很丰富了,谢谢,看来学点 js 必不可少
    imdong
        11
    imdong  
       2020-06-07 23:40:01 +08:00
    为啥我感觉自己实现 非常简易的 Web Server 也不是很多代码吧?是我太天真了?

    起一个 TCP Server,监听 80 端口,截取 path 和 auth 两部分用于鉴权和访问路径。

    path 分两种,静态直接读取然后返回,动态就解析参数,然后交由内部方法处理。

    返回的数据 包上固定的 header 头后发出?不过确实是需要一直监听的?
    ysc3839
        12
    ysc3839  
       2020-06-07 23:47:54 +08:00
    @imdong 实现一个对 HTTP 协议支持不完全的最简单的 HTTP 服务器确实不难,但是要完整支持 HTTP 协议,还要高性能少 bug 的话我觉得很难,至少我自己是没这个时间精力和能力做出来。
    xylophone21
        13
    xylophone21  
       2020-06-07 23:49:23 +08:00
    为何楼上各位都不考虑前后端分离呢?这样后端要做的,与 C 的交互,不就仅仅保留了一些简单的数据或者说设备状态。比如用 RPC 来查询主工作进程。

    至于一个静态的 HTTP Sever 部分,那个简单的开源版本,几本可以直接用了。
    tkwl
        14
    tkwl  
    OP
       2020-06-08 00:06:09 +08:00 via iPhone
    @xylophone21 请教是否有相关实践参考,楼上说的 openwrt 使用 lua 应该也是一种前后端分离吧,除非在 webserver 代码里写死了 html 那种
    systemcall
        15
    systemcall  
       2020-06-08 00:29:48 +08:00 via Android
    见到现在用的比较多的是 html 里用 iframe 来调用不同的功能对应的页面,每个页面是单独的 html 。参数用 js 发送请求,机子上面跑 cgi,收到请求后返回一个 json,浏览器再来解析和渲染。隔一下请求一下,而且要做一下验证,避免没有登录的情况下请求到数据。大部分操作似乎都是在传 JSON
    没做过 cgi,不清楚怎么实现的。上 OpenWRT 应该可以,基本的功能只需要 8M+2M,加上视频方面的东西应该也不会大到哪去。
    或者用 app,只支持 app 的话应该会好做的多,Flash 要求也低一些
    关于     帮助文档     自助推广系统     博客     API     FAQ     Solana     2620 人在线   最高记录 6679       Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 35ms UTC 06:20 PVG 14:20 LAX 23:20 JFK 02:20
    Do have faith in what you're doing.
    ubao snddm index pchome yahoo rakuten mypaper meadowduck bidyahoo youbao zxmzxm asda bnvcg cvbfg dfscv mmhjk xxddc yybgb zznbn ccubao uaitu acv GXCV ET GDG YH FG BCVB FJFH CBRE CBC GDG ET54 WRWR RWER WREW WRWER RWER SDG EW SF DSFSF fbbs ubao fhd dfg ewr dg df ewwr ewwr et ruyut utut dfg fgd gdfgt etg dfgt dfgd ert4 gd fgg wr 235 wer3 we vsdf sdf gdf ert xcv sdf rwer hfd dfg cvb rwf afb dfh jgh bmn lgh rty gfds cxv xcv xcs vdas fdf fgd cv sdf tert sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf shasha9178 shasha9178 shasha9178 shasha9178 shasha9178 liflif2 liflif2 liflif2 liflif2 liflif2 liblib3 liblib3 liblib3 liblib3 liblib3 zhazha444 zhazha444 zhazha444 zhazha444 zhazha444 dende5 dende denden denden2 denden21 fenfen9 fenf619 fen619 fenfe9 fe619 sdf sdf sdf sdf sdf zhazh90 zhazh0 zhaa50 zha90 zh590 zho zhoz zhozh zhozho zhozho2 lislis lls95 lili95 lils5 liss9 sdf0ty987 sdft876 sdft9876 sdf09876 sd0t9876 sdf0ty98 sdf0976 sdf0ty986 sdf0ty96 sdf0t76 sdf0876 df0ty98 sf0t876 sd0ty76 sdy76 sdf76 sdf0t76 sdf0ty9 sdf0ty98 sdf0ty987 sdf0ty98 sdf6676 sdf876 sd876 sd876 sdf6 sdf6 sdf9876 sdf0t sdf06 sdf0ty9776 sdf0ty9776 sdf0ty76 sdf8876 sdf0t sd6 sdf06 s688876 sd688 sdf86