这次介绍一个比较好玩的:通过 ESP32 创建一个 WebServer ,通过浏览器访问的时候自动播放预先定义好的图片序列。
制作方法:
1.创建一个 640x480的图片,放上彩色文字,便于观察,保存为 JPG 格式
2.旋转文字,再保存成另外一个文件
3.重复上述动作我们能获得4个文件
4.使用 bin2c 工具将四个文件转化为4个C语言h文件
5.文件头定义中做一点调整,图片大小命名为 picN_size, 内容命名为 picN 这种
6.接下来就可以编写我们的代码了
#include "esp_camera.h"
#include <WiFi.h>
#include "esp_timer.h"
#include "img_converters.h"
#include "Arduino.h"
#include "fb_gfx.h"
#include "soc/soc.h"
#include "soc/rtc_cntl_reg.h"
#include "esp_http_server.h"
#include "pic\ph0.h"
#include "pic\ph1.h"
#include "pic\ph2.h"
#include "pic\ph3.h"
// 这里改成你自己的 WIFI 名称和密码
const char* ssid = "YOUWIFI";
const char* password = "PASSWORD";
#define PART_BOUNDARY "123456789000000000000987654321"
static const char* _STREAM_CONTENT_TYPE = "multipart/x-mixed-replace;boundary=" PART_BOUNDARY;
static const char* _STREAM_BOUNDARY = "\r\n--" PART_BOUNDARY "\r\n";
static const char* _STREAM_PART = "Content-Type: image/jpeg\r\nContent-Length: %u\r\n\r\n";
httpd_handle_t stream_httpd = NULL;
static esp_err_t stream_handler(httpd_req_t *req) {
esp_err_t res = ESP_OK;
size_t _jpg_buf_len = 0;
uint8_t * _jpg_buf = NULL;
char * part_buf[64];
static int index=0;
res = httpd_resp_set_type(req, _STREAM_CONTENT_TYPE);
if (res != ESP_OK) {
return res;
}
while (true) {
// 这里设定一个循环,轮流发送PIC0-4
if (index==0) {
_jpg_buf_len = pic0_size;
_jpg_buf = (uint8_t *)pic0;
} else if (index==1) {
_jpg_buf_len = pic1_size;
_jpg_buf = (uint8_t *)pic1;
} else if (index==2) {
_jpg_buf_len = pic2_size;
_jpg_buf = (uint8_t *)pic2;
} else if (index==3) {
_jpg_buf_len = pic3_size;
_jpg_buf = (uint8_t *)pic3;
}
// 如果发送完PIC3 接来发送PIC0
index=(index+1)%4;
if (res == ESP_OK) {
size_t hlen = snprintf((char *)part_buf, 64, _STREAM_PART, _jpg_buf_len);
res = httpd_resp_send_chunk(req, (const char *)part_buf, hlen);
}
if (res == ESP_OK) {
res = httpd_resp_send_chunk(req, (const char *)_jpg_buf, _jpg_buf_len);
}
if (res == ESP_OK) {
res = httpd_resp_send_chunk(req, _STREAM_BOUNDARY, strlen(_STREAM_BOUNDARY));
}
if (res != ESP_OK) {
break;
}
Serial.printf("MJPG: %uB\n",(uint32_t)(_jpg_buf_len));
}
return res;
}
void startPicServer() {
httpd_config_t config = HTTPD_DEFAULT_CONFIG();
config.server_port = 80;
httpd_uri_t index_uri = {
.uri = "/",
.method = HTTP_GET,
.handler = stream_handler,
.user_ctx = NULL
};
if (httpd_start(&stream_httpd, &config) == ESP_OK) {
httpd_register_uri_handler(stream_httpd, &index_uri);
}
}
void setup() {
WRITE_PERI_REG(RTC_CNTL_BROWN_OUT_REG, 0); //disable brownout detector
Serial.begin(115200);
Serial.setDebugOutput(false);
// Wi-Fi connection
WiFi.begin(ssid, password);
while (WiFi.status() != WL_CONNECTED) {
delay(500);
Serial.print(".");
}
Serial.println("");
Serial.println("WiFi connected");
Serial.print("Camera Stream Ready! Go to: http://");
Serial.print(WiFi.localIP());
//启动
startPicServer();
}
void loop() {
delay(1);
}
7.运行之后串口监视器会输出当前 WebServer 的 IP ,将地址在浏览器中打开即可看到结果: