Skip to content

Programming based on Arduino IDE, implementation of file upload and download, webpage flash game, video offline play, clipboard and AP STA AP + sta mode conversion.

Notifications You must be signed in to change notification settings

heluoly/ESP32-SDcard-WebServer

Repository files navigation

ESP32-SDcard-WebServer

项目名称:ESP32便携SD(TF)卡服务器

作者:B站 狼尾巴的猫

项目实现文件上传下载、网页flash游戏、播放视频、模式转换(AP STA AP+STA互相转换)、剪切板功能

image

image

服务器演示:

1、https://www.bilibili.com/video/BV1pu4m1A7bo

2、https://www.bilibili.com/video/BV1r34117746

3、https://www.bilibili.com/video/BV1SG411x7tz

PCB工程:https://oshwhub.com/heluoly/esp32-fu-wu-qi_copy_copy_copy_copy

新UI效果图:https://www.bilibili.com/opus/1143729492954447892

功能

1、文件上传下载

可将终端设备的文件上传到服务器的内存卡中,也可将服务器中的文件取回。

2、网页视频

可用手机或电脑上的浏览器播放服务器内存卡中存放的视频,视频播放器使用videoJS

3、剪切板

一个临时的文本中转站,可将文本临时保存在服务器上。

4、网页flash游戏

可使用电脑浏览器游玩服务器中的flash游戏,flash播放器使用objecty。

5、WiFi配网(模式转换)

服务器默认为AP模式,可通过网页让服务器连接WiFi接入局域网,然后通过局域网访问服务器。

6、AP修改设置

可通过网页修改服务器的WiFi名称、密码、信道。

7、OLED屏显示服务器状态及时间。

8、服务器低功耗模式。

关于使用异步库版本的说明

1、这是一个采用webserver异步库的版本,程序在"ESP32-SDcard-WebServer/Arduino程序/Arduino库版本3.x/ESP32_SDwebserver_async"文件夹下,使用异步库可以并发处理任务。

2、目前测试该版本只适用于ESP32-S3,且使用ESP32-S3运行能大幅提高视频播放的流畅性,而普通的ESP32运行起来会卡死。

3、使用该版本需要额外安装如下依赖库:

ESPAsyncWebServer

https://github.com/ESP32Async/ESPAsyncWebServer

AsyncTCP

https://github.com/ESP32Async/AsyncTCP

4、该版本程序需要搭配"内存卡_async"内的文件,目前对在线影院的界面进行了美化,采用了动态加载的方式。

5、该版本文件管理中支持了断点下载和多线程下载,最高支持4线程下载。

6、烧录程序时需要修改分区表,改成“FATFS”格式

7、电池电压检测引脚在battery.h中修改

8、OLED显示屏的I2C引脚在oled.cpp中修改

9、该版本可推流mp4格式视频,并可以对视频进度拖拽,配置方式参考"内存卡_async"内的"README.txt"

开始前准备

1、选择你的内存卡连接方式,参照"image/连接图"上的方式连接,目前只支持MMC_4bit和MMC_1bit连接,如需SPI连接请自行修改程序;ESP32-S3可用SD_MMC.setPins(clk, cmd, d0, d1, d2, d3);函数自由设置SD卡管脚;OLED屏幕使用I2C驱动,sda:21,scl:22。

2、使用arduino将程序编译烧录进入ESP32,arduino-esp32库版本为2.0.14+或3.3.4+(需选择对应版本程序),根据你内存卡的连接方式修改程序中"ONE_BIT_MODE"参数,默认为MMC_4bit,注意,烧录时需要将内存卡从卡槽中取出,同时确保IO12管脚悬空。

3、其中"Arduino库版本3.x"烧录程序时需要修改分区表,在下拉菜单Partition Scheme选择包含“FATFS”格式的分区表

3、准备一张32G以下大小的内存卡,将“内存卡”文件夹中的所有文件复制进入内存卡根目录,同时参照下一节存入你的swf游戏文件或m3u8视频文件。

4、将内存卡插入内存卡插槽,参照"image/连接图"上的方式连接。

5、接上电源开机。

内存卡中网页视频与flash游戏的配置,以及服务器配置

参考视频:https://www.bilibili.com/video/BV1r34117746/

1、flash游戏配置

请将swf文件复制到内存卡中的/webgame/oldGame内。

(注:flash浏览器推荐使用CefFlashBrowser,https://github.com/Mzying2001/CefFlashBrowser/releases

2、网页视频配置

请先新建一个文件夹(文件夹名称不能带有中文),使用mp4转m3u8软件将视频转换为m3u8的格式并存放在刚刚新建的文件夹中,m3u8文件命名为index.m3u8,将切片好的视频文件连同文件夹一同复制到/video/shortvideo或/video/movie内。

视频的标题存放在与视频相同路径下的 0.txt文件内,编码格式为utf-8。

视频的预览图存放在与视频相同路径下的 0.jpg文件内。

3、服务器配置

服务器配置存放位置通过common.h中的CONFIG_SD设置,0为FATFS,1为SD_MMC,默认存放在FATFS中,文件名为config.txt,其中存放WiFi名称密码等信息。

使用说明

1、Boot键功能

单击:服务器状态/时钟表盘切换显示

长按:关闭/开启WIFI

如果单击boot按键屏幕没有任何反应,可能由于内存卡未初始化成功,请检查内存卡的连接。

2、如何连接服务器

服务器上电默认处于AP模式,使用手机或者电脑,找到ESP32_webserver这个WIFI进行连接,密码是123456789,连接成功后,用浏览器访问192.168.1.1即可进入服务器主页。

参考项目

SD卡代码参考 https://youtu.be/e1xOgZsnAuw

网页响应代码参考 http://www.taichi-maker.com/homepage/esp8266-nodemcu-iot/iot-c/spiffs/spiffs-web-server/file-upload-server/

文件上传代码参考 https://github.com/smford/esp32-asyncwebserver-fileupload-example

flash播放器使用objecty

视频播放器使用videoJS、videojs-contrib-hls https://github.com/videojs/video.js https://github.com/videojs/videojs-contrib-hls

网页配网代码参考 https://github.com/yuan910715/Esp8266_NTP_Clock_Weather 中的网页配网部分

OLED屏幕时钟参考 https://github.com/ThingPulse/esp8266-oled-ssd1306 中的 examples/SSD1306ClockDemo

Font Awesome https://fontawesome.com/

额外说明

如需旧版代码,请到release中下载

About

Programming based on Arduino IDE, implementation of file upload and download, webpage flash game, video offline play, clipboard and AP STA AP + sta mode conversion.

Topics

Resources

Stars

Watchers

Forks

Packages

No packages published

Languages