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,然后點擊下方導入即可。如下圖。(導入時需注意,在選擇導入的文件夾時,要選擇含有app.json文件的文件夾導入,不然會報錯。)

本示例程序非常簡單,各位大神可以繼續開發添加各種功能,界面修改,優化色彩等等,如果只是簡單使用,只需修改/pages/index/index.js 文件中uid 和topic 信息為自己的即可,這里的uid和topic需要和esp32-cam填入的uid和topic相同,如下。

  data: {
    uid:"4d9ec352e0376f2110a0c601a2857225",//用戶密鑰,巴法雲控制台獲取
    myTopic:"mypicture",//圖片上傳的主題,圖片雲控制台創建
    num:5,      //獲取的圖片數量,可隨意
    imgList:[], //存儲圖片地址和時間,用於前端展示
    picArr:[], //存儲圖片的地址,用於圖片點擊預覽
  },

修改完畢后,ctrl+s 保存修改。可以點擊左邊屏幕上的按鈕進行調試,如下圖。

console控制台可以查看小程序的調試信息。

如果界面和其他功能都開發完畢。可以點擊微信開發者工具的上面的上傳按鈕,如下圖。

在這里插入圖片描述
上傳成功后,再登陸剛剛注冊的微信公眾平台,在版本管理處,可以看到自己剛剛上傳的小程序,提交審核即可,等一天左右,一般都會通過,通過后登陸微信公眾平台,提交發布即可。如果是自己使用的,做好加上登陸驗證功能,比如驗證匹配一下某個字符串是否正確等等,不然小程序上線后別人也可以隨意控制了。

在這里插入圖片描述


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM