1. 程式人生 > >微信公眾號開發之選擇圖片,上傳圖片,下載圖片,顯示圖片

微信公眾號開發之選擇圖片,上傳圖片,下載圖片,顯示圖片

function clickImg(that){
	wx.chooseImage({  
		count: 1,  
		needResult: 1,  
		sizeType: ['original', 'compressed'], // 可以指定是原圖還是壓縮圖,預設二者都有  
		sourceType: ['album', 'camera'], // 可以指定來源是相簿還是相機,預設二者都有  
		success: function (data) {                  
			var localId=data.localIds;//把圖片的路徑儲存在images[localId]中--圖片本地的id資訊,用於上傳圖片到微信瀏覽器時使用
			 wx.uploadImage({
			 	localId: localId.toString(),
			   	isShowProgressTips: 1, // 預設為1,顯示進度提示  
			   	success: function (res) {                                        
			   		var mediaId = res.serverId;
		   			//呼叫後臺方法儲存medidld
					//圖片上傳完成之後,進行圖片的下載,圖片上傳完成之後會返回一個在騰訊伺服器的存放的圖片的ID--->serverId
				    wx.downloadImage({
				    serverId: res.serverId, //需要下載的圖片的伺服器端ID,由uploadImage介面
				    isShowProgressTips: 1, // 預設為1,顯示進度提示
				    success: function (res) {
				    var localId = res.localId; // 返回圖片下載後的本地ID
				    //通過下載的本地的ID獲取的圖片的base64資料,通過對資料的轉換進行圖片的儲存
				    wx.getLocalImgData({
				    localId: localId, // 圖片的localID
				    success: function (res) {
				    var mediaId = res.serverId;
					if (window.__wxjs_is_wkwebview){ //判斷ios是不是用的wkwebview 核心		
						var localData = res.localData;//localData是圖片的base64資料,可以用img標籤顯示
						localData = localData.replace('jgp', 'jpeg');
						$("#kin_img").attr("src", localData);
					}else{
							$("#kin_img").attr("src", mediaId );
						}
	 				});
				}
 			})
		},  
   		fail: function (error) {  
   		     picPath = '';  
   		     localIds = '';  
   		     console.log(error);          
   		 }          
	   });  
	},  
	fail: function (res) {
		 console.log(res);
	}    
});
};