微信小程序拍照和攝像功能實現方法示例

來源：懂視網責編：小采時間：2020-11-27 22:01:15

微信小程序拍照和攝像功能實現方法示例

微信小程序拍照和攝像功能實現方法示例:本文實例講述了微信小程序拍照和攝像功能實現方法。分享給大家供大家參考，具體如下：拍照原先的想法是使用微信的camera組件來實現，并且模擬發朋友圈的樣子來進行相機的設置，其實就是將camera組件的大小設置成根屏幕一樣大，并在上面使用一個cover-

推薦度：

點擊下載本文 文檔為doc格式

導讀微信小程序拍照和攝像功能實現方法示例:本文實例講述了微信小程序拍照和攝像功能實現方法。分享給大家供大家參考，具體如下：拍照原先的想法是使用微信的camera組件來實現，并且模擬發朋友圈的樣子來進行相機的設置，其實就是將camera組件的大小設置成根屏幕一樣大，并在上面使用一個cover-

本文實例講述了微信小程序拍照和攝像功能實現方法。分享給大家供大家參考，具體如下：

拍照

原先的想法是使用微信的camera組件來實現，并且模擬發朋友圈的樣子來進行相機的設置，其實就是將camera組件的大小設置成根屏幕一樣大，并在上面使用一個cover-image組件來給用戶進行點擊，可是實際上的情況是第一，cover-image組件有時候會消失，第二，整個流程實現起來很僵硬，頁面跳轉也是卡的要死，后來無意間發現了另一個API：wx.chooseImage，這個API會自己去調用相機和相冊，之后的工作完全交給底層去實現，簡直是簡單到沒朋友：

// 拍照功能
getLocalImage:function(){
 var that=this;
 wx.chooseImage({
 count:1,
 success:function(res){
 // 這里無論用戶是從相冊選擇還是直接用相機拍攝，拍攝完成后的圖片臨時路徑都會傳遞進來
 app.startOperating("保存中")
 var filePath=res.tempFilePaths[0];
 var session_key=wx.getStorageSync('session_key');
 // 這里順道展示一下如何將上傳上來的文件返回給后端，就是調用wx.uploadFile函數
 wx.uploadFile({
 url: app.globalData.url+'/home/upload/uploadFile/session_key/'+session_key,
 filePath: filePath,
 name: 'file',
 success:function(res){
 app.stopOperating();
 // 下面的處理其實是跟我自己的業務邏輯有關
 var data=JSON.parse(res.data);
 if(parseInt(data.status)===1){
 app.showSuccess('文件保存成功');
 }else{
 app.showError("文件保存失敗");
 }
 }
 })
 },
 fail:function(error){
 console.error("調用本地相冊文件時出錯")
 console.warn(error)
 },
 complete:function(){
 }
 })
 },

其中封裝在app.js中的函數可以看我這篇文章：微信小程序一些簡易小函數總結。

攝影

其實跟上面的原理是一樣的，對應的API就是wx.chooseVideo，其中可以設置拍攝時間，用戶拍攝結束以及用戶拍攝時間超時等，都會調用success的回調函數，所以又是可以安心處理接下來的業務流程，而不用需要調用camera組件。

// 攝像功能
 getLocalVideo:function(){
 var that=this;
 var session_key=wx.getStorageSync('session_key');
 wx.chooseVideo({
 maxDuration:10,
 success:function(res1){
 app.startOperating("上傳中")
 // 這個就是最終拍攝視頻的臨時路徑了
 var tempFilePath=res1.tempFilePath;
 },
 fail:function(){
 console.error("獲取本地視頻時出錯");
 }
 })
 },

實現起來也是很簡單，但是有一個問題就是沒有辦法像調用camera組件一樣獲取視頻的縮略圖，這是現在唯一的缺陷。但是總體來說，比起調用camera組件，這樣實現起來的確簡單了很多。

希望本文所述對大家微信小程序開發有所幫助。

聲明：本網頁內容旨在傳播知識，若有侵權等問題請及時與本網聯系，我們將在第一時間刪除處理。TEL:177 7030 7066 E-MAIL:11247931@qq.com