Existen tutoriales que explican como hacer fotos con una ESP32-CAM, pero ahora vamos a ver como pasar esas fotos a un servidor API-REST, para poder consultarlas desde cualquier parte.
El código completo lo puedes descargar de: [https://github.com/alfredodemiguel/Proyectos/tree/master/PhotoPlug]
Como veras si entras en el repositorio, el proyecto completo consiste en un dispositivo, cuya función es permitirnos monitorizar una impresora 3D. De modo que podamos ver desde localizaciones remotas como va la impresión, y detenerla en el caso de que algo no esté funcionando como debiera.
El proyecto completo abarca, el diseño de la placa base del dispositivo, el diseño 3d de la caja que lo albergará, la programación de la ESP32-CAM, la web de administración, el servidor API-Rest que se encuentra alojado en Heroku dentro de un contenedor Docker, y una app móvil android.
Para lograr nuestro objetivo tenemos dos pasos el primero tomar una foto y guardarla en la memoria SPIFFS, esta primera parte del código, basada en el trabajo de randomnerdtutorials.
// Capture Photo and Save it to SPIFFS
void _capturePhotoSaveSpiffs( void ) {
camera_fb_t * fb = NULL; // pointer
bool ok = 0; // Boolean indicating if the picture has
been taken correctly
do {
// Take a photo with the camera
Serial.println("Taking a photo...");
fb = esp_camera_fb_get();
if (!fb) {
Serial.println("Camera capture failed");
return;
}
// Photo file name
Serial.printf("Picture file name: %s\n", FILE_PHOTO);
File file = SPIFFS.open(FILE_PHOTO, FILE_WRITE);
// Insert the data in the photo file
if (!file) {
Serial.println("Failed to open file in
* writing mode");*
}
else {
file.write(fb->buf, fb->len); // payload (image),
payload length
}
// Close the file
file.close();
esp_camera_fb_return(fb);
// check if file has been correctly saved in SPIFFS
ok = _checkPhoto(SPIFFS);
} while ( !ok );
}
Ahora en está segunda parte lo que vamos a hacer es introducir la foto dentro de un String, para ello la codificamos en base64.
String _encodePhoto () {
File file = SPIFFS.open(FILE_PHOTO);
String photoString = "";
String photoEncoded = "";
if(!file){
Serial.println("Failed to open file for reading");
} else {
while(file.available()){
photoString += char(file.read());
}
}
photoEncoded = "data:image/jpeg;base64," +
(base64::encode(photoString));
return (photoEncoded);
}
Como puedes observar, añado una cadena de texto a la foto, con el propósito de que se pueda leer fácilmente desde la página web. Le indico que es una imagen y mas concretamente un jpg, que muestro en la página web mediante el siguiente comando:
<img src={elemento.smPG3} width="100%" height="100%" alt ="Foto"/>
Una vez llegados a este punto, solo resta hacer un POST a nuestro servidor API-REST.
Si te animas a hacerte este dispositivo, para controlar tu impresora 3d o cualquier otra cosa, y tienes alguna duda, ponlo por aquí.
Top comments (0)