ICode9

精准搜索请尝试: 精确搜索
首页 > 编程语言> 文章详细

esp32-cam拍照上传+微信小程序照片显示

2021-06-02 09:32:48  阅读:278  来源: 互联网

标签:微信 esp32 点击 cam 控制台 上传 下载


1、ESP32-cam开发环境配置

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

安装好esp32 环境,开发板选择esp32 wrover module开发板,其他默认即可。

2 、程序下载

示例程序下载:点击下载

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

/*********************需要修改的地方**********************/

const char* ssid = "newhtc";           //WIFI名称
const char* password = "qq123456";     //WIFI密码
int capture_interval = 20*1000;        // 默认20秒上传一次,可更改(本项目是自动上传,如需条件触发上传,在需要上传的时候,调用take_send_photo()即可)
const char*  post_url = "http://images.bemfa.com/upload/v1/upimages.php"; // 默认上传地址
const char*  uid = "4d9ec352e0376f2110a0c601a2857225";    //用户私钥,巴法云控制台获取
const char*  topic = "mypicture";     //主题名字,可在控制台新建

/********************************************************/

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

关于主题topic:主题可在控制台 点击跳转 新建,字母+数字自定义组合即可。

连线

在这里插入图片描述
注意:下载的时候 ESP32-cam的io0要接GND,下载结束后,必须断开io0和GND的连接。

在arduino IDE 点击烧录上传,然后需要按一下esp32-cam的reset按键,程序才会下载。下载完成后,断开io0的连线,再按一下reset按键,就退出下载模式了,即可正常使用。注意:由于部分电脑USB电压不稳,会导致esp32反复重启,可使用充电宝等供电。

如果WIFI信息正常,esp32就会自动连接wifi,并进行拍照上传,默认20秒上传一次,可自行修改频率,或者更改为触发条件拍照,需要拍照上传的时候,调用一下take_send_photo()函数即可,比如

if(引脚==高电平)
{
   take_send_photo();
}

3、 控制台查看图片

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

在这里插入图片描述
在这里插入图片描述

第四、微信小程序开发

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

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

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

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

打开微信开发者工具,小程序项目,导入项目。在目录处选择刚刚下载解压的demo示例程序,AppID处填入你的小程序AppID,然后点击下方导入即可。如下图。

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

  data: {
    uid:"4d9ec352e0376f2110a0c601a2857225",//用户密钥,巴法云控制台获取
    myTopic:"mypicture",//图片上传的主题,图片云控制台创建
    num:5,      //获取的图片数量,可随意
    imgList:[], //存储图片地址和时间,用于前端展示
    picArr:[], //存储图片的地址,用于图片点击预览
  },

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

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

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

在这里插入图片描述
上传成功后,再登陆刚刚注册的微信公众平台,在版本管理处,可以看到自己刚刚上传的小程序,提交审核即可,等一天左右,一般都会通过,通过后登陆微信公众平台,提交发布即可。如果是自己使用的,做好加上登陆验证功能,比如验证匹配一下某个字符串是否正确等等,不然小程序上线后别人也可以随意控制了。

在这里插入图片描述

标签:微信,esp32,点击,cam,控制台,上传,下载
来源: https://www.cnblogs.com/bemfa/p/14839921.html

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有