V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
tkwl
V2EX  ›  嵌入式开发

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

  •  
  •   tkwl · 2020-06-07 20:50:18 +08:00 · 3406 次点击
    这是一个创建于 545 天前的主题,其中的信息可能已经有所发展或是发生改变。
    原始需求就是常见网络监控摄像头的参数设置,登陆后主页面可以在各个 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   ·   我们的愿景   ·   广告投放   ·   感谢   ·   实用小工具   ·   983 人在线   最高记录 5497   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 19ms · UTC 22:12 · PVG 06:12 · LAX 14:12 · JFK 17:12
    ♥ Do have faith in what you're doing.