前期配件准备
ESP32-CAM开发环境配置
程序下载
连接小车
控制台查看图片
微信小程序的开发

1.前期配件准备

小车套件（网上购买即可，较为方便的选择）

ESP32-CAM （推荐安信可，外加TTL下载器，方便烧录程序）

L298N马达驱动模块

3节18650电池，杜邦线

2.ESP32-CAM开发环境设置

本例程是利用arduino IDE开发，关于arduino IDE 的esp32环境配置可参考：环境配置: 点击跳转

安装好esp32 环境，开发板选择AI Thinker ESP32-CAM开发板，其他默认即可。

3.程序下载

示例程序下载：百度网盘请输入提取码提取码：0qsv （注：代码为作者将其他作者代码结合成，若有疑问请参考原作者esp32-cam拍照上传，微信小程序照片显示_巴法云的博客-CSDN博客_esp32cam拍照

ESP_S_test52229999.zip - 蓝奏云）

需要修改的信息有WIF名称，WIFI密码，用户私钥UID，设备主题topic。

用户私钥可以巴法云控制台点击跳转获取，注册登陆即可在巴法云控制台获取。https://cloud.bemfa.com/tcp/images.html

关于主题topic：主题可在控制台图云处创建，点击跳转新建，字母+数字自定义组合即可。

上传后打开串口监视器即可查看连接WiFi是否成功，成功后会显示WIFI的IP地址以及控制小车网页的链接

注意：手机（控制小车）、小车、电脑（查看云平台）三者必须在同一个WiFi下，否则无法上传图片到云平台。建议用手机热点，路由器似乎会导致小车控制有一定延迟。

控制网页如图：

4.连接小车

参考B站UP：arduino捣鼓室视频链接

三分钟学会制作esp32 cam监控车|附代码_哔哩哔哩_bilibili

升级版监控小车+舵机云台二合一路由WiFi连接模式_哔哩哔哩_bilibili

上图开发板5V单独供电也可直接连接L298N的5V输出，但可能会导致小车不能正常控制的问题，所以建议马达驱动单独供电，开发板单独5v供电，一起供电电压不稳定。

连接好后通电即可通过网页控制小车

5.控制台查看照片

登陆巴法云控制台，点击进入图云，即可查看到已经上传的图片，双击可查看大图。

第四、微信小程序开发
在微信公众平台注册小程序账号，拿到小程序 appid，右侧点击 -开发–> 开发管理–>开发设置---->开发者ID，里面可以看到，长的大概是这样：wx34a2063de5cec04b，下面导入项目的时候会用到。

右侧点击 -开发–> 开发管理–>开发设置---->服务器域名。下方服务器域名处，点击修改，在request合法域名处，添加域名https://images.bemfa.com 保存提交即可。如下图。

下载安装微信开发者工具，可百度下载。

下载demo示例程序。下载地址：点击下载

打开微信开发者工具，小程序项目，导入项目。在目录处选择刚刚下载解压的demo示例程序，AppID处填入你的小程序AppID，然后点击下方导入即可。如下图。（导入时需注意，在选择导入的文件夹时，要选择含有app.json文件的文件夹导入，不然会报错。）

本示例程序非常简单，各位大神可以继续开发添加各种功能，界面修改，优化色彩等等，如果只是简单使用，只需修改/pages/index/index.js 文件中uid 和topic 信息为自己的即可，这里的uid和topic需要和esp32-cam填入的uid和topic相同，如下。

修改完毕后，ctrl+s 保存修改。可以点击左边屏幕上的按钮进行调试，如下图。

console控制台可以查看小程序的调试信息。

如果界面和其他功能都开发完毕。可以点击微信开发者工具的上面的编译按钮，如下图。

编译成功后，打开模拟器即可在左侧看到在巴法云平台上上传的图片

点击真机测试微信扫码即可在手机上查看.

部分文章转载自:https://blog.csdn.net/bemfa/article/details/117434333

部分图片转载自：三分钟学会制作esp32 cam监控车|附代码_哔哩哔哩_bilibili

升级版监控小车+舵机云台二合一路由WiFi连接模式_哔哩哔哩_bilibili

制作esp32-cam拍照上传，微信小程序照片显示的监控小车相关推荐

uni-app uni-file-picker文件上传实现拍摄从相册选择获取图片上传文档服务器（H5上传-微信小程序上传）
前言最近在使用uni-app写H5移动端,有一个从手机拍摄从相册选择获取图片上传到文档服务器功能. 查阅uni-app发现关于上传图片,uni-file-picker文件上传,uni.chooseI ...
php 点击选择图片上传,微信小程序图片选择、上传到服务器、预览（PHP）实现实例...
微信小程序图片选择.上传到服务器.预览(PHP)实现实例小程序实现选择图片.预览图片.上传到开发者服务器上后台使用的tp3.2 图片上传请求时候的header参考时可以去掉(个人后台验证权限使用 ...
上传微信小程序项目到Github
问题最近做完了一个微信小程序的项目,想着把代码放到github上面,于是就上网查找有关的文章,在阅读相关操作后我发现微信开发者工具这个ide自带这个功能,显示在有上角.点击版本管理进入即可. STE ...
php实现批量上传微信小程序（在windows系统上实现）
准备工作: 1.安装php环境(本文以phpstudy为例),下载地址:https://www.xp.cn/download.html 2.安装微信开发者工具,下载地址:https://develop ...
基于ESP32的智能家居控制系统-微信小程序
一. 课题研究意义.现状及应用分析 1.1课题研究意义及现状目前,科学技术发展十分迅速,其渗透到各行各业以及生活的方方面面,室内设计和高科技结合便出现了"智能家居".所谓智能家居 ...
阿里云服务器上搭建微信小程序服务端环境。
无论是搭建个人博客空间也好,微信小程序也罢,搭建环境必需的两点:云服务器.域名,下面一步步给搭建演示如果在一台阿里云服务器上搭建微信小程序服务端环境. 1.云服务器准备:可在阿里云购买ECS服务器 ...
微信php echo换行,微信小程序文字显示换行问题
微信小程序文字显示换行问题小程序文字显示换行问题用户在上传图文时,输入换行符.导致我在拿到数据后JSON.parse的时候报错. 大概这样的结构: [{ text:'落魄前端在线炒粉!!!' ...
ESP8266读DHT11温湿度，开发微信小程序实时显示
ESP8266读DHT11温湿度,开发微信小程序实时显示第一.原理讲解第二.ESP8266读取DHT11 第三.温湿度推送到云端第四.微信小程序开发个人可免费注册五个微信小程序账号. 第一.原 ...
关于微信小程序不能显示图片
本人场景:wxml <image> 标签设置 src="../../images/中文名.png" 时出现 IOS 端显示没问题,而安卓端不显示图片的问题. 上网一查才 ...

制作esp32-cam拍照上传，微信小程序照片显示的监控小车