微信開發(fā)中如何實現(xiàn)相機(jī)拍照和本地上傳圖片的功能

小編給大家分享一下微信開發(fā)中如何實現(xiàn)相機(jī)拍照和本地上傳圖片的功能,希望大家閱讀完這篇文章之后都有所收獲,下面讓我們一起去探討吧!

成都網(wǎng)站建設(shè)、做網(wǎng)站介紹好的網(wǎng)站是理念、設(shè)計和技術(shù)的結(jié)合。創(chuàng)新互聯(lián)建站擁有的網(wǎng)站設(shè)計理念、多方位的設(shè)計風(fēng)格、經(jīng)驗豐富的設(shè)計團(tuán)隊。提供PC端+手機(jī)端網(wǎng)站建設(shè),用營銷思維進(jìn)行網(wǎng)站設(shè)計、采用先進(jìn)技術(shù)開源代碼、注重用戶體驗與SEO基礎(chǔ),將技術(shù)與創(chuàng)意整合到網(wǎng)站之中,以契合客戶的方式做到創(chuàng)意性的視覺化效果。

今天遇到微信小程序的用戶頭像設(shè)置功能,做筆記.

先上gif:

微信開發(fā)中如何實現(xiàn)相機(jī)拍照和本地上傳圖片的功能

再上代碼:

小demo,代碼很簡單.

1.index.wxml

<!--index.wxml--> 
<button style="margin:30rpx;" bindtap="chooseimage">獲取圖片</button> 
<image src="{{tempFilePaths }}" mode="aspecFill" style="width: 100%; height: 450rpx"/>

2.index.js

//index.js 
//獲取應(yīng)用實例 
var app = getApp() 
Page({ 
 data: { 
  tempFilePaths: '' 
 }, 
 onLoad: function () { 
 }, 
 chooseimage: function () { 
  var _this = this; 
  wx.chooseImage({ 
   count: 1, // 默認(rèn)9 
   sizeType: ['original', 'compressed'], // 可以指定是原圖還是壓縮圖,默認(rèn)二者都有 
   sourceType: ['album', 'camera'], // 可以指定來源是相冊還是相機(jī),默認(rèn)二者都有 
   success: function (res) { 
    // 返回選定照片的本地文件路徑列表,tempFilePath可以作為img標(biāo)簽的src屬性顯示圖片 
    _this.setData({ 
     tempFilePaths:res.tempFilePaths 
    }) 
   } 
  }) 
 } 
})

API 說明:

微信開發(fā)中如何實現(xiàn)相機(jī)拍照和本地上傳圖片的功能

這里說說sourcetype.默認(rèn)是從相冊獲取和使用相機(jī)拍照,跟微信現(xiàn)在選擇圖片的界面一樣,第一格是拍照,后面的是相冊照片.

這里注意:返回的是圖片在本地的路徑.如果需要將圖片上傳到服務(wù)器,需要用到另一個API.

示例代碼:

wx.chooseImage({ 
 success: function(res) { 
  var tempFilePaths = res.tempFilePaths 
  wx.uploadFile({ 
   url: 'http://example.weixin.qq.com/upload', //僅為示例,非真實的接口地址 
   filePath: tempFilePaths[0], 
   name: 'file', 
   formData:{ 
    'user': 'test' 
   }, 
   success: function(res){ 
    var data = res.data 
    //do something 
   } 
  }) 
 } 
})

看完了這篇文章,相信你對“微信開發(fā)中如何實現(xiàn)相機(jī)拍照和本地上傳圖片的功能”有了一定的了解,如果想了解更多相關(guān)知識,歡迎關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道,感謝各位的閱讀!

本文名稱:微信開發(fā)中如何實現(xiàn)相機(jī)拍照和本地上傳圖片的功能
網(wǎng)頁鏈接:http://muchs.cn/article46/iehdhg.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供微信小程序、移動網(wǎng)站建設(shè)、關(guān)鍵詞優(yōu)化、微信公眾號軟件開發(fā)、定制開發(fā)

廣告

聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請盡快告知,我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場,如需處理請聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時需注明來源: 創(chuàng)新互聯(lián)

微信小程序開發(fā)