This is the CameraWebServer example sketch that comes with the ESP32 framework for the IDE. However, this sketch is a bit, well, sketchy.
The main html pages are stored in a header file, which would be bad enough, except it is written out in array initializer notation, one agonizing byte at a time. Ridiculous? What if I told you it was gzipped, too? Now how much would you pay?
And, yes, the browser knows how to unzip stuff. That's not the point. My editor don't do gzip, yo.
So, I converted the header file mess into files, and then unzipped them (call me stubborn). They now reside in the data folder as index_ov2640.html and index_ov3660.html and will be uploaded to the board's SPIFFS filesystem. The proper one will be selected and served depending on the camera model. Mine was an OV2640.
You need an ESP32 development board with a camera. I used an ESP32-cam. That one comes with the OV2640 camera already installed with sample code preloaded. I found this example sketch while trying to find the source for the preloaded code. Since I just wanted to play with some code, I was satisfied to hack the example!
You need the Arduino IDE, of course. It must be set up for ESP32 development, including the sketch data uploader. Check out my guide if you need help!
You will also need the ArduinoJSON library. I have a guide that includes downloading and setting that up, too!
Once you have this project downloaded there are still a couple of things to do.
You will need to rename the file sample.config.json to config.json and move it to the data directory. Edit the file to reflect the ssid and key for your network. The ESP32 will connect to this network and attempt to establish an mDNS responder.
Speaking of that mDNS responder, there is a key to control the responder name in config.json. In case you want multiple cameras. You're welcome!
Upload sketch data to the board first, then upload the sketch. Watch the serial monitor for WiFi to connect. If the mDNS responder was set up successfully, browse to the camera URL shown in the serial monitor (http://espcam.local by default). If the mDNS didn't work, it will spit its IP to the serial monitor instead. However you get there, this will let you see the (not gzipped) UI from the example. It lets you do a bunch of stuff with the camera, including face detection and recognition! 🤯
🍀 Good Luck! 🍀