【0531更新教程】Blynk+M5timer_camera，易于实现部署的家居检测

沧海笑1122

   Blynk+M5timer_camera（esp32 core)，易于实现部署的家居监测（0531更新详见四楼）

【背景故事】

本教程源于B站《自制 ESP32+Blynk 无线 Wi-Fi 监控系统，实时画面》 作者：乐鑫物联网学院

作者说明 原始搬运自：https://www.youtube.com/watch?v=PaiDT1t07DU

本人用M5stack timer camera(ESP32)进行复现。

先看一下效果。

Blynk+M5timer_camera（esp32 core)，易于实现部署的家居监测_哔哩哔哩 (゜-゜)つロ 干杯~-bilibili

M5stack timer camera链接：m5-docs(m5stack.com)

基本思路：

手机部分采用blynk，blynk里面有一个获取网络图片的组件，M5 camera和blynk app在一个网段内，触发拍摄后，给bkynk server 一个图片链接，app访问并且显示。

关于触发拍摄按钮，是在blynk 构建一个按钮，关联gpio14，即可形成一个按钮事件，放置在程序主循环里，当按钮按动时，即触发一个拍摄，把图片链接通过虚拟pinV1 推送给blynk server ，从而由app获取并且显示在手机上。

     一、软硬件

硬件：安卓手机一部+ M5timer_camera（esp32core)

软件：arduino IDE 1.8.13

      Blynk以及arduino 库

二、代码

1. /*************************************************************
   
2.   Download latest Blynk library here:
   
3.     https://github.com/blynkkk/blynk-library/releases/latest
   
4. 
   
5.   Blynk is a platform with iOS and Android apps to control
   
6.   Arduino, Raspberry Pi and the likes over the Internet.
   
7.   You can easily build graphic interfaces for all your
   
8.   projects by simply dragging and dropping widgets.
   
9. 
   
10.     Downloads, docs, tutorials: http://www.blynk.cc
    
11.     Sketch generator:           http://examples.blynk.cc
    
12.     Blynk community:            http://community.blynk.cc
    
13.     Follow us:                  http://www.fb.com/blynkapp
    
14.                                 http://twitter.com/blynk_app
    
15. 
    
16.   Blynk library is licensed under MIT license
    
17.   This example code is in public domain.
    
18. 
    
19. *************************************************************
    
20.   This example runs directly on ESP32 chip.
    
21. 
    
22.   Note: This requires ESP32 support package:
    
23.     https://github.com/espressif/arduino-esp32
    
24. 
    
25.   Please be sure to select the right ESP32 module
    
26.   in the Tools -> Board menu!
    
27. 
    
28.   Change WiFi ssid, pass, and Blynk auth token to run :)
    
29.   Feel free to apply it to any other example. It's simple!
    
30. *************************************************************/
    
31. //2021-05-03
    
32. //blynk+m5stack timer_cam ，it works
    
33. //https://www.bilibili.com/video/BV1Si4y1L7gZ
    
34. //https://www.youtube.com/watch?v=PaiDT1t07DU
    
35. 
    
36. /* Comment this out to disable prints and save space */
    
37. #define BLYNK_PRINT Serial
    
38. #include "esp_camera.h"
    
39. 
    
40. #include <WiFi.h>
    
41. #include <WiFiClient.h>
    
42. #include <BlynkSimpleEsp32.h>
    
43. #include "camera_pins.h"
    
44. String local_IP;
    
45. int count = 0;
    
46. void startCameraServer();
    
47. 
    
48. // You should get Auth Token in the Blynk App.
    
49. // Go to the Project Settings (nut icon).
    
50. const char* auth = "your auth";
    
51. 
    
52. 
    
53. // Your WiFi credentials.
    
54. // Set password to "" for open networks.
    
55. const char* ssid = "your ssid";
    
56. const char* pass = "your pass";
    
57. char domain[]="blynk.mixly.org";
    
58. 
    
59. #define PHOTO 14      //ESP32 CAM 1 拍摄按钮
    
60. 
    
61. #define LED 2  //定义led灯，拍摄时闪动
    
62. void takePhoto()
    
63. {
    
64.   digitalWrite(LED, HIGH);//led闪动，表明一个拍摄过程
    
65.   delay(200);
    
66.   uint32_t randomNum = random(50000);
    
67.   Serial.println("http://"+local_IP+"/capture?_cb="+ (String)randomNum);
    
68.   Blynk.setProperty(V1, "urls", "http://"+local_IP+"/capture?_cb="+(String)randomNum); //将cam拍摄的图片通过V1发送至blynk server，从而由blynk图片组件获取后访问并且显示在页面
    
69.   digitalWrite(LED, LOW);
    
70.   delay(1000);
    
71. }
    
72. 
    
73. void setup()
    
74. {
    
75. 
    
76.   Serial.begin(115200);
    
77.   Serial.setDebugOutput(true);
    
78.   Serial.println();
    
79.   pinMode(LED, OUTPUT);
    
80.   digitalWrite(LED, HIGH);
    
81.   //cam初始化
    
82.   camera_config_t config;
    
83.   config.ledc_channel = LEDC_CHANNEL_0;
    
84.   config.ledc_timer = LEDC_TIMER_0;
    
85.   config.pin_d0 = Y2_GPIO_NUM;
    
86.   config.pin_d1 = Y3_GPIO_NUM;
    
87.   config.pin_d2 = Y4_GPIO_NUM;
    
88.   config.pin_d3 = Y5_GPIO_NUM;
    
89.   config.pin_d4 = Y6_GPIO_NUM;
    
90.   config.pin_d5 = Y7_GPIO_NUM;
    
91.   config.pin_d6 = Y8_GPIO_NUM;
    
92.   config.pin_d7 = Y9_GPIO_NUM;
    
93.   config.pin_xclk = XCLK_GPIO_NUM;
    
94.   config.pin_pclk = PCLK_GPIO_NUM;
    
95.   config.pin_vsync = VSYNC_GPIO_NUM;
    
96.   config.pin_href = HREF_GPIO_NUM;
    
97.   config.pin_sscb_sda = SIOD_GPIO_NUM;
    
98.   config.pin_sscb_scl = SIOC_GPIO_NUM;
    
99.   config.pin_pwdn = PWDN_GPIO_NUM;
    
100.   config.pin_reset = RESET_GPIO_NUM;
     
101.   config.xclk_freq_hz = 20000000;
     
102.   config.pixel_format = PIXFORMAT_JPEG;
     
103.   config.frame_size = FRAMESIZE_UXGA;
     
104.   config.jpeg_quality = 4;  //default=10
     
105.   config.fb_count = 2;
     
106. 
     
107.   // camera init
     
108.   esp_err_t err = esp_camera_init(&config);
     
109.   if (err != ESP_OK) {
     
110.     Serial.printf("Camera init failed with error 0x%x", err);
     
111.     return;
     
112.   }
     
113. 
     
114.   sensor_t * s = esp_camera_sensor_get();
     
115.   //initial sensors are flipped vertically and colors are a bit saturated
     
116.   s->set_vflip(s, 1);//flip it back
     
117.   s->set_brightness(s, 1);//up the blightness just a bit
     
118.   s->set_saturation(s, -2);//lower the saturation
     
119. 
     
120.   //drop down frame size for higher initial frame rate
     
121.   s->set_framesize(s, FRAMESIZE_QVGA);
     
122. 
     
123. //建立wifi连接，主要为了获取local_IP
     
124.    WiFi.begin(ssid, pass);
     
125. 
     
126.   while (WiFi.status() != WL_CONNECTED) {
     
127.     delay(500);
     
128.     Serial.print(".");
     
129.   }
     
130.   Serial.println("");
     
131.   Serial.println("WiFi connected");
     
132.   
     
133.   startCameraServer();
     
134.     Serial.print("Camera Ready! Use 'http://");
     
135.   Serial.print(WiFi.localIP());
     
136.   
     
137.   local_IP = WiFi.localIP().toString();  //获取local_IP
     
138.   Serial.println("' to connect");
     
139.   Blynk.begin(auth, ssid, pass,"Blynk.mixly.org",8080);
     
140. }
     
141. 
     
142. void loop()
     
143. {
     
144.   // put your main code here, to run repeatedly:
     
145. 
     
146.     Blynk.run();
     
147.   //用户在app上按动拍摄按钮，则触发本事件
     
148.   if(digitalRead(PHOTO) == HIGH){  
     
149.     takePhoto();
     
150.     }
     
151. }
     

复制代码

一、后续

后续我会利用一个二自由度云台，加上m5的舵机驱动模块，形成一个简单的可以调整摄像头拍摄角度的家具监测。

感谢裘师兄提供blynk.mixly.org服务器。

感谢M5提供好玩有趣的极客工具。

感谢arduino.cn提供平台。

最重要感谢原创者：https://www.youtube.com/watch?v=PaiDT1t07DU
以及乐鑫物联网学院在B站的搬运。
已经立夏，万物勃发。

沧海抱拳。

代码如下：

ESP32_WiFi_cam_upload_0513.zip (2.39 KB, 下载次数: 15)

2021-5-13 22:08 上传

点击文件名下载附件

topdog

谢谢沧海笑1122老师的分享，一起学习一起进步！

沧海笑1122

topdog 发表于 2021-5-14 00:31
谢谢沧海笑1122老师的分享，一起学习一起进步！

感谢师兄支持鼓励

沧海笑1122

【0531更新】

通过舵机控制板+二自由度舵机云台实现了简易的家居监测。用户在手机blynk APP上通过滑动棒来改变舵机的水平旋转或者仰角角度，从而对不同的家居目标进行拍摄，在设置好摄像头位置后，按动拍摄按钮，即可从blynk APP上观察到家居目标的拍摄情况。

先看一下效果。

https://www.bilibili.com/video/BV1Ef4y1Y75S/

l  基本思路：

手机部分安装blynk APP，blynk里面有一个获取网络图片的组件，M5 camera和blynk app在一个网段内，用户触发拍摄后，M5Stack Timer Camera将建立一个照片服务，给blynk server发送一个图片链接，blynk APP访问此链接并且显示。

触发拍摄按钮，就是在blynk 构建一个按钮，关联M5Stack Timer Camera的gpio14，即可形成一个按钮事件，放置在程序主循环里，当按钮按动时，触发一个拍摄行为，M5StackTimer Camera把图片链接通过虚拟pinV1 推送给blynkserver ，从而由app获取并且显示在手机上。

    舵机控制部分的用户界面也在blynk APP上，通过两个slider（滑动棒）组件进行参数设置，很方便拖动设置舵机旋转角度，通过V2和V3下发给仰角以及水平旋转舵机。

l  核心知识点：

1、 blynk的图片组件，可以以虚拟针的方式从M5Stack Timer Camera(内核是esp32)读取照片的链接，展示在手机APP上。

2、 M5Stack Timer Camera在摄像头拍摄照片后，实际上建立了一个基于网络的照片服务器，使得其他客户端可以通过各种形式来访问刚刚拍摄的照片。

3、 M5Stack Timer Camera与M5StickC之间用json格式来传送舵机控制指令，算是这个小玩具的第三个知识点。

下图是Blynk的主要界面以及参数设计：

l  难度以及有趣指数评估：

难度指数：★★

有趣指数：★★★☆

同样是一个易于上手的小项目，便于加深对M5Stack Timer Camera照片服务以及blynk通信机制的理解。

【制作过程】

一、软硬件

硬件：

	内容	参数及版本	备注
1	安卓手机一部	安卓4.44以上	含blynk APP
2	M5Stack Timer Camera	esp32 core
3	8舵机控制板	含750mah电池	M5Stack出品
4	M5StickC		舵机控制的执行元件
5	二自由度舵机云台	9G舵机

软件：

	内容	参数及版本	备注
1	arduino IDE	1.8.13
2	BlynkAPP 以及arduino 库

连线：

M5StickC与8舵机控制板直接插接即可，二自由度舵机云台的水平旋转舵机以及垂直仰角舵机分别接8舵机控制板的CH1和CH2。

二自由度舵机云台与摄像头的装配

二、逻辑示意图

三、代码：

1. /*舵机控制的json数据格式
   
2. {
   
3.   "CH": 1,
   
4.   "value":90
   
5. }
   
6.   s_json="{"CH":+str(1)+","value":+str(pinValue1)}"
   
7. 
   
8. 
   
9. */
   
10. 
    
11. //编写调试：2021-05-03
    
12. //整理于2021-05-26
    
13. //blynk+m5stack timer_cam ，it works
    
14. //https://www.bilibili.com/video/BV1Si4y1L7gZ
    
15. //https://www.youtube.com/watch?v=PaiDT1t07DU
    
16. 
    
17. /* Comment this out to disable prints and save space */
    
18. #define BLYNK_PRINT Serial
    
19. #include "esp_camera.h"
    
20. 
    
21. #include <WiFi.h>
    
22. #include <WiFiClient.h>
    
23. #include <BlynkSimpleEsp32.h>
    
24. #include "camera_pins.h"
    
25. String local_IP;
    
26. int count = 0;
    
27. String s_json1;
    
28. String s_json2;
    
29. #include "HardwareSerial.h"
    
30. HardwareSerial MySerial(1);
    
31. 
    
32. void startCameraServer();
    
33. 
    
34. // You should get Auth Token in the Blynk App.
    
35. // Go to the Project Settings (nut icon).
    
36. const char* auth = "your auth";
    
37. 
    
38. // Your WiFi credentials.
    
39. // Set password to "" for open networks.
    
40. const char* ssid = "your ssid";
    
41. const char* pass = "your psw";
    
42. char domain[]="blynk.mixly.org";
    
43. 
    
44. #define PHOTO 14      //ESP32 CAM
    
45. #define LED 2
    
46. 
    
47. void takePhoto()
    
48. {
    
49.   digitalWrite(LED, HIGH); //板载led闪动，表明一次拍摄过程
    
50.   delay(200);
    
51.   uint32_t randomNum = random(50000);
    
52.   Serial.println("http://"+local_IP+"/capture?_cb="+ (String)randomNum);
    
53.   Blynk.setProperty(V1, "urls", "http://"+local_IP+"/capture?_cb="+(String)randomNum); //将本次拍摄照片的网络链接发送给V1，用于blynk APP展示
    
54.   digitalWrite(LED, LOW);
    
55.   delay(1000);
    
56. }
    
57. //垂直仰角舵机控制CH2---V2
    
58. BLYNK_WRITE(V2) {
    
59.   int pinValue2 = param.asInt(); // assigning incoming value from pin V2 to a variable
    
60.   // process received value
    
61.   Serial.print("V2: ");
    
62.   Serial.println(pinValue2);
    
63.   //生成一个json串，带有通道号以及旋转角度等参数
    
64.   s_json2="{"CH":"+String(2)+","value":"+String(pinValue2)+"}";
    
65.   MySerial.println(s_json2);
    
66.   delay(50);
    
67. }
    
68. 
    
69. //水平旋转舵机控制CH1---V3
    
70. BLYNK_WRITE(V3) {
    
71.   int pinValue1 = param.asInt(); // assigning incoming value from pin V3 to a variable
    
72.   // process received value
    
73.   Serial.print("V3: ");
    
74.   Serial.println(pinValue1);
    
75.    //生成一个json串，带有通道号以及旋转角度等参数
    
76.   s_json1="{"CH":"+String(1)+","value":"+String(pinValue1)+"}";
    
77.   MySerial.println(s_json1);
    
78.   delay(50);
    
79. }
    
80. 
    
81. void setup()
    
82. {
    
83. 
    
84.   Serial.begin(115200);
    
85.   //自定义硬串口
    
86.   MySerial.begin(9600, SERIAL_8N1, 13, 4);  //rx 13  white   tx 4 yellow
    
87.   Serial.setDebugOutput(true);
    
88.   Serial.println();
    
89.   pinMode(LED, OUTPUT);
    
90.   digitalWrite(LED, HIGH);
    
91.   //camera_config
    
92.   camera_config_t config;
    
93.   config.ledc_channel = LEDC_CHANNEL_0;
    
94.   config.ledc_timer = LEDC_TIMER_0;
    
95.   config.pin_d0 = Y2_GPIO_NUM;
    
96.   config.pin_d1 = Y3_GPIO_NUM;
    
97.   config.pin_d2 = Y4_GPIO_NUM;
    
98.   config.pin_d3 = Y5_GPIO_NUM;
    
99.   config.pin_d4 = Y6_GPIO_NUM;
    
100.   config.pin_d5 = Y7_GPIO_NUM;
     
101.   config.pin_d6 = Y8_GPIO_NUM;
     
102.   config.pin_d7 = Y9_GPIO_NUM;
     
103.   config.pin_xclk = XCLK_GPIO_NUM;
     
104.   config.pin_pclk = PCLK_GPIO_NUM;
     
105.   config.pin_vsync = VSYNC_GPIO_NUM;
     
106.   config.pin_href = HREF_GPIO_NUM;
     
107.   config.pin_sscb_sda = SIOD_GPIO_NUM;
     
108.   config.pin_sscb_scl = SIOC_GPIO_NUM;
     
109.   config.pin_pwdn = PWDN_GPIO_NUM;
     
110.   config.pin_reset = RESET_GPIO_NUM;
     
111.   config.xclk_freq_hz = 20000000;
     
112.   config.pixel_format = PIXFORMAT_JPEG;
     
113.   config.frame_size = FRAMESIZE_UXGA;
     
114.   config.jpeg_quality = 4;  //default=10
     
115.   config.fb_count = 2;
     
116. 
     
117.   // camera init
     
118.   esp_err_t err = esp_camera_init(&config);
     
119.   if (err != ESP_OK) {
     
120.     Serial.printf("Camera init failed with error 0x%x", err);
     
121.     return;
     
122.   }
     
123.   
     
124.   sensor_t * s = esp_camera_sensor_get();
     
125.   //initial sensors are flipped vertically and colors are a bit saturated
     
126.   s->set_vflip(s, 1);//flip it back
     
127.   s->set_brightness(s, 1);//up the blightness just a bit
     
128.   s->set_saturation(s, -2);//lower the saturation
     
129. 
     
130.   //drop down frame size for higher initial frame rate
     
131.   s->set_framesize(s, FRAMESIZE_QVGA);
     
132. 
     
133.   WiFi.begin(ssid, pass);
     
134.   //wifi连接并且返回一个local_IP，用于传递图片服务器链接
     
135.   while (WiFi.status() != WL_CONNECTED) {
     
136.     delay(500);
     
137.     Serial.print(".");
     
138.   }
     
139.   Serial.println("");
     
140.   Serial.println("WiFi connected");
     
141.   
     
142.   startCameraServer();
     
143.     Serial.print("Camera Ready! Use 'http://");
     
144.   Serial.print(WiFi.localIP());
     
145.   
     
146.   local_IP = WiFi.localIP().toString();
     
147.   Serial.println("' to connect");
     
148.   //Blynk Server连接
     
149.   Blynk.begin(auth, ssid, pass,"Blynk.mixly.org",8080);
     
150.   
     
151. }
     
152. 
     
153. void loop()
     
154. {
     
155.   // put your main code here, to run repeatedly:
     
156.     Blynk.run();
     
157.   //判断是否拍摄按钮在Blynk APP中被按下，photo Pin=gp14
     
158.   if(digitalRead(PHOTO) == HIGH){
     
159.     takePhoto();
     
160.     }
     
161. }
     

复制代码

C端代码

1. /*
   
2. M5StickC端控制程序（来自M5Stack Timer Camera的uart）
   
3. M5StickC端舵机控制json数据格式
   
4. {
   
5.   "CH": 1,
   
6.   "value":90
   
7. }
   
8. 整理：2021-05-26
   
9. */
   
10. #include <M5StickC.h>
    
11. #include "IIC_servo.h"
    
12. #include <ArduinoJson.h>
    
13. #include "HardwareSerial.h"
    
14. HardwareSerial MySerial(1);
    
15. // the setup routine runs once when M5StickC starts up
    
16. void setup(){
    
17.   // Initialize the M5StickC object
    
18.   M5.begin();
    
19.   // LCD display
    
20.   M5.Lcd.println("  IIC_servo");
    
21.   //自定义硬串口
    
22.   MySerial.begin(9600, SERIAL_8N1, 32, 33);  //rx 32 yellow   tx33 white
    
23.   IIC_Servo_Init();     //sda  0     scl  26
    
24.   M5.Lcd.println("  begin :");
    
25. 
    
26. }
    
27. 
    
28. // the loop routine runs over and over again forever
    
29. void loop() {
    
30.   while (!MySerial.available())
    
31.    delay(100);
    
32.   // Deserialize the JSON document
    
33.   const size_t capacity = JSON_OBJECT_SIZE(4) + 50;//定义来自arduinojson.org的助手生成
    
34.   DynamicJsonDocument doc(capacity);
    
35.   DeserializationError error = deserializeJson(doc, MySerial); //解析来自MySerial的数据流
    
36.   // Test if parsing succeeds.
    
37.   if (error) {
    
38.     Serial.print(F("deserializeJson() failed: "));
    
39.     Serial.println(error.c_str());
    
40.     return;
    
41.   }
    
42. int i_ch=doc["CH"]; //解析第X（1或2）路舵机
    
43. int i_value=doc["value"]; //解析角度值
    
44. Servo_angle_set(i_ch,i_value);    //执行，对CHX设定角度value°
    
45. Serial.print(i_ch);
    
46. Serial.print("*");
    
47. Serial.println(i_value);
    
48. delay(100);
    
49. }
    

复制代码

一、后记

Blynk+M5Stack Timer Camera+M5StickC以及一个二自由度云台（当然少不了M5Stack的舵机驱动模块），就形成一个简单的可以调整摄像头拍摄角度的家具监测。

感谢裘师兄提供blynk.mixly.org服务器。

最重要感谢原创者：https://www.youtube.com/watch?v=PaiDT1t07DU
以及乐鑫物联网学院在B站的搬运。
最好人生是小满，花未全开月未圆。

沧海抱拳。