首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >esp32-cam拍照,微信小程序照片显示

esp32-cam拍照,微信小程序照片显示

原创
作者头像
巴法
修改2021-06-02 10:25:06
1.4K0
修改2021-06-02 10:25:06
举报
文章被收录于专栏:巴法巴法巴法

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 保存提交即可。如下图。

01.png
01.png

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

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

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

03.png
03.png

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

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

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

04.png
04.png

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

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

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

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

在这里插入图片描述
在这里插入图片描述
05.png
05.png

原创声明:本文系作者授权腾讯云开发者社区发表,未经许可,不得转载。

如有侵权,请联系 cloudcommunity@tencent.com 删除。

原创声明:本文系作者授权腾讯云开发者社区发表,未经许可,不得转载。

如有侵权,请联系 cloudcommunity@tencent.com 删除。

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • 1、ESP32-cam开发环境配置
  • 2 、程序下载
    • 连线
    • 3、 控制台查看图片
    • 第四、微信小程序开发
    相关产品与服务
    物联网
    腾讯连连是腾讯云物联网全新商业品牌,它涵盖一站式物联网平台 IoT Explorer,连连官方微信小程序和配套的小程序 SDK、插件和开源 App,并整合腾讯云内优势产品能力,如大数据、音视频、AI等。同时,它打通腾讯系 C 端内容资源,如QQ音乐、微信支付、微保、微众银行、医疗健康等生态应用入口。提供覆盖“云-管-边-端”的物联网基础设施,面向“消费物联”和 “产业物联”两大赛道提供全方位的物联网产品和解决方案,助力企业高效实现数字化转型。
    领券
    问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档