WhyCan Forum

本站无需注册,无需积分,无需回复可下载所有资料,如果真的喜欢小站,请您注册之后请至少回复一个帖子激活Id,谢谢支持! 站长QQ: 516333132 (挖坑网/填坑网) admin@whycan.cn

您尚未登录。

#1 2019-03-22 12:32:10

msr06rr
会员
所在地: 苏州
注册时间: 2018-01-11
累计积分: 131
个人网站

ESP32+mDNS+HTTP Server的方案验证

上图,跑的都是官方的示例代码,东拼西凑
A372wD.png

一直觉得ESP32+液晶屏不是物联网GUI最佳方案(当然也有必须要液晶屏的场合),好的液晶屏成本高,想要做酷炫的界面还依赖GUI引擎(很多还是收费的)。但是Web就不同了,做个酷炫的显示界面,有一堆开源前端框架,比如Vue。
最近有空尝试用Vue写个前端,编译后部署在SD卡上。后端的程序不用很复杂,基于IDF现有的组件,实现几条简单的REST API还是没问题的吧。
主要网页中的URL这个有点蛋疼,因为DHCP分到的IP地址是会发生变化

好在局域网中可以使用mDNS,IDF中也已经包含了这个组件,开箱即用

这种方案有个弊端,就是操作系统要支持mDNS才行,Ubuntu自带avahi,mac自带bonjour,但是windows和Android我就不知道了,还没试过。

离线

#2 2019-03-22 13:37:32

IoTer
会员
注册时间: 2019-01-20
累计积分: 25

Re: ESP32+mDNS+HTTP Server的方案验证

谢谢分享,
刚刚特意搜了一下 mDNS,
记得当时做楼宇对讲项目的时候,
要把房号转IP地址,
自己用多播广播写了一个非标协议。

离线

#3 2019-03-28 15:31:21

msr06rr
会员
所在地: 苏州
注册时间: 2018-01-11
累计积分: 131
个人网站

Re: ESP32+mDNS+HTTP Server的方案验证

更新...
小型嵌入式Web开发(不跑Linux)有一个痛点是如何在开发阶段快速迭代,不可能每次修改html代码就要重新烧写程序,哪怕是放在SD卡上,每次插拔也很蛋疼,可能修改html只要几秒,但是部署一次就要花1分钟。
所以就想到了semihost方式的开发,相当于是热部署吧。只要后端程序不改变,就不需要重新烧固件,不需要插拔SD卡,连着JTAG就完事了。
过程如下:
浏览器向esp32发送GET请求,esp32根据请求地址,从host主机端检索文件,然后发送响应数据包给浏览器。网页文件都在host端,基本可以实现开发阶段的热更新,“实时”预览。只是这个实时性能还要看JTAG速度有多快了。
实际测试,VUE编译后大约550K的网站,每次刷新需要5秒左右的时间。

AwJia6.png

最近编辑记录 msr06rr (2019-03-28 15:44:02)

离线

#4 2019-03-28 15:43:22

jimmy
Moderator
注册时间: 2017-10-29
累计积分: 135

Re: ESP32+mDNS+HTTP Server的方案验证

连着 JTAG 是什么操作?
JTAG 控制 ESP32 吗?

离线

#5 2019-03-28 15:48:04

msr06rr
会员
所在地: 苏州
注册时间: 2018-01-11
累计积分: 131
个人网站

Re: ESP32+mDNS+HTTP Server的方案验证

https://github.com/espressif/esp-idf/tree/master/examples/storage/semihost_vfs

确切的说是ESP32控制JTAG,通过JTAG来做IO操作。IDF还将这种semihost封装在了VFS上,所以在esp32上用open,read,write等方式操作PC上的文件。

离线

#6 2019-03-28 15:53:35

jimmy
Moderator
注册时间: 2017-10-29
累计积分: 135

Re: ESP32+mDNS+HTTP Server的方案验证

还是没有脑补成功,

ESP32 是连接 JLINK + OpenOCD ?
再操作电脑上的文件?

离线

#7 2019-03-28 15:55:42

msr06rr
会员
所在地: 苏州
注册时间: 2018-01-11
累计积分: 131
个人网站

Re: ESP32+mDNS+HTTP Server的方案验证

jimmy 说:

还是没有脑补成功,

ESP32 是连接 JLINK + OpenOCD ?
再操作电脑上的文件?

是的哇,ESP32连着JTAG,主机端要开启OpenOCD  smile

离线

#8 2019-03-28 15:57:09

jimmy
Moderator
注册时间: 2017-10-29
累计积分: 135

Re: ESP32+mDNS+HTTP Server的方案验证

msr06rr 说:
jimmy 说:

还是没有脑补成功,

ESP32 是连接 JLINK + OpenOCD ?
再操作电脑上的文件?

是的哇,ESP32连着JTAG,主机端要开启OpenOCD  smile

有没有 OpenOCD 操作 ESP32 的教程, 伸手党捂脸 ...

离线

#9 2019-03-28 15:59:26

msr06rr
会员
所在地: 苏州
注册时间: 2018-01-11
累计积分: 131
个人网站

离线

#10 2019-03-28 16:00:20

jimmy
Moderator
注册时间: 2017-10-29
累计积分: 135

Re: ESP32+mDNS+HTTP Server的方案验证

离线

#11 2019-03-29 10:57:24

msr06rr
会员
所在地: 苏州
注册时间: 2018-01-11
累计积分: 131
个人网站

Re: ESP32+mDNS+HTTP Server的方案验证

A0GIX9.png

用vuetify的模板搭了个框架,可以以此写一个admin页面

不得不说semihost目前加载速度有点慢,加了vuetify库后刷新一次要10秒了

后面部署到SD卡上看看能不能快点

离线

#12 2019-03-29 11:01:50

smartcar
会员
注册时间: 2018-02-19
累计积分: 237

Re: ESP32+mDNS+HTTP Server的方案验证

赞,还可以这么玩!

离线

#13 2019-03-29 15:15:06

msr06rr
会员
所在地: 苏州
注册时间: 2018-01-11
累计积分: 131
个人网站

Re: ESP32+mDNS+HTTP Server的方案验证

Vue这类单页应用的框架,首次加载是会消耗很多时间,但是后续的路由跳转并不会发生太多流量,响应还是很快的。
接下来尝试使用axios发起post请求给esp32,看看能否成功

离线

#14 2019-04-04 14:34:45

msr06rr
会员
所在地: 苏州
注册时间: 2018-01-11
累计积分: 131
个人网站

Re: ESP32+mDNS+HTTP Server的方案验证

网站部署,要么放在spi flash上(如果网站编译后体积较大,可能不太适合),要么放在SD卡或者SD Nand上。

晒一下刚焊接的SD Nand

A2ZWVI.jpg

离线

#15 2019-04-04 14:36:13

晕哥
Administrator
注册时间: 2017-09-06
累计积分: 6,123

Re: ESP32+mDNS+HTTP Server的方案验证

看起来好像是雷龙的吧?

离线

#16 2019-04-04 14:38:15

msr06rr
会员
所在地: 苏州
注册时间: 2018-01-11
累计积分: 131
个人网站

Re: ESP32+mDNS+HTTP Server的方案验证

晕哥 说:

看起来好像是雷龙的吧?

哈哈哈,晕哥好眼力!

离线

#17 2019-04-04 14:51:50

晕哥
Administrator
注册时间: 2017-09-06
累计积分: 6,123

Re: ESP32+mDNS+HTTP Server的方案验证

msr06rr 说:
晕哥 说:

看起来好像是雷龙的吧?

哈哈哈,晕哥好眼力!

因为我也有 哈.

离线

#18 2019-04-08 12:25:38

msr06rr
会员
所在地: 苏州
注册时间: 2018-01-11
累计积分: 131
个人网站

Re: ESP32+mDNS+HTTP Server的方案验证

吼,SD Nand 识别到了。

A4sFIg.png

将网站部署在SD Nand上,网站打开速度可以秒开。

A4smMq.png

离线

#19 2019-04-08 13:40:59

cityf
会员
注册时间: 2017-11-03
累计积分: 120

Re: ESP32+mDNS+HTTP Server的方案验证

msr06rr 说:

吼,SD Nand 识别到了。

https://s2.ax1x.com/2019/04/08/A4sFIg.png

将网站部署在SD Nand上,网站打开速度可以秒开。

https://s2.ax1x.com/2019/04/08/A4smMq.png

这个是用 spi 还是 sdio 访问 sd nand 芯片?

离线

#20 2019-04-08 13:57:49

msr06rr
会员
所在地: 苏州
注册时间: 2018-01-11
累计积分: 131
个人网站

Re: ESP32+mDNS+HTTP Server的方案验证

cityf 说:
msr06rr 说:

吼,SD Nand 识别到了。

https://s2.ax1x.com/2019/04/08/A4sFIg.png

将网站部署在SD Nand上,网站打开速度可以秒开。

https://s2.ax1x.com/2019/04/08/A4smMq.png

这个是用 spi 还是 sdio 访问 sd nand 芯片?

SDIO接口

离线

#21 2019-04-08 14:05:35

smartcar
会员
注册时间: 2018-02-19
累计积分: 237

Re: ESP32+mDNS+HTTP Server的方案验证

又多一个选择了,但是不知道这个吗 sd nand 稳定性如何,得小批量观察一年半载才行吧,斜眼笑

离线

#22 2019-04-11 12:10:16

msr06rr
会员
所在地: 苏州
注册时间: 2018-01-11
累计积分: 131
个人网站

Re: ESP32+mDNS+HTTP Server的方案验证

发现编译后的website不是很大,2M不到,塞到SPI Flash 中刚刚好啊,实测下来速度还不如SD卡。

IDF中有一个好用的制作spiffs bin 文件的工具,目前已经集成到编译系统当中,只需要在Makefile中指定好文件目录,就能在编译阶段自动制作bin,烧写阶段自动烧写到SPI Flash中的指定分区中,超级无敌爽,无需额外的命令行操作。教程:https://docs.espressif.com/projects/esp-idf/en/latest/api-reference/storage/spiffs.html

最近编辑记录 msr06rr (2019-04-11 12:11:34)

离线

#23 2019-04-15 22:48:30

john78
会员
注册时间: 2018-07-19
累计积分: 111

Re: ESP32+mDNS+HTTP Server的方案验证

看上去不错,在非LINUX下HTTP serever不知道怎么下手。

离线

#24 2019-04-19 11:07:58

msr06rr
会员
所在地: 苏州
注册时间: 2018-01-11
累计积分: 131
个人网站

Re: ESP32+mDNS+HTTP Server的方案验证

作为一个电子工程师居然爱上了Vue,真特码好用。我用的前端五件套:Vue+VueRouter+Vuex+axios+Vuetify

EpwNlR.gif

最近编辑记录 msr06rr (2019-04-19 11:08:20)

离线

#25 2019-04-19 11:12:30

msr06rr
会员
所在地: 苏州
注册时间: 2018-01-11
累计积分: 131
个人网站

Re: ESP32+mDNS+HTTP Server的方案验证

* 第一个页面用来展示板卡和软件信息:IDF版本号,芯片特征啥的
* 第二个页面是动态展示ESP32传感器数据(虽然目前我上传的都是随机数)
* 第三个页面是远程控制三色LED(虽然我的板子上并没有这个LED,目前只是在ESP32上print拿到的三色数据

Vue真香~

离线

#26 2019-04-20 10:42:49

还能这么玩
会员
注册时间: 2019-04-14
累计积分: 2

Re: ESP32+mDNS+HTTP Server的方案验证

刚刚去谷了一下Vue, 确实香~~~

离线

页脚