国产探花免费观看_亚洲丰满少妇自慰呻吟_97日韩有码在线_资源在线日韩欧美_一区二区精品毛片,辰东完美世界有声小说,欢乐颂第一季,yy玄幻小说排行榜完本

首頁 > 課堂 > 小程序 > 正文

微信小程序?qū)崿F(xiàn)圖片上傳功能

2020-03-21 16:17:16
字體:
供稿:網(wǎng)友

本文實例為大家分享了微信小程序實現(xiàn)圖片上傳功能的具體代碼,供大家參考,具體內(nèi)容如下

前端:微信開發(fā)者工具

后端:.Net

服務(wù)器:阿里云

這里介紹微信小程序如何實現(xiàn)上傳圖片到自己的服務(wù)器上

前端代碼

data: {  productInfo: {} }, //添加Banner bindChooiceProduct: function () {  var that = this;   wx.chooseImage({   count: 3, //最多可以選擇的圖片總數(shù)   sizeType: ['compressed'], // 可以指定是原圖還是壓縮圖,默認(rèn)二者都有   sourceType: ['album', 'camera'], // 可以指定來源是相冊還是相機(jī),默認(rèn)二者都有   success: function (res) {    // 返回選定照片的本地文件路徑列表,tempFilePath可以作為img標(biāo)簽的src屬性顯示圖片    var tempFilePaths = res.tempFilePaths;    //啟動上傳等待中...    wx.showToast({     title: '正在上傳...',     icon: 'loading',     mask: true,     duration: 10000    })    var uploadImgCount = 0;    for (var i = 0, h = tempFilePaths.length; i < h; i++) {     wx.uploadFile({      url: util.getClientSetting().domainName + '/home/uploadfilenew',      filePath: tempFilePaths[i],      name: 'uploadfile_ant',      formData: {       'imgIndex': i      },      header: {       "Content-Type": "multipart/form-data"      },      success: function (res) {       uploadImgCount++;       var data = JSON.parse(res.data);       //服務(wù)器返回格式: { "Catalog": "testFolder", "FileName": "1.jpg", "Url": "https://test.com/1.jpg" }       var productInfo = that.data.productInfo;       if (productInfo.bannerInfo == null) {        productInfo.bannerInfo = [];       }       productInfo.bannerInfo.push({        "catalog": data.Catalog,        "fileName": data.FileName,        "url": data.Url       });       that.setData({        productInfo: productInfo       });        //如果是最后一張,則隱藏等待中       if (uploadImgCount == tempFilePaths.length) {        wx.hideToast();       }      },      fail: function (res) {       wx.hideToast();       wx.showModal({        title: '錯誤提示',        content: '上傳圖片失敗',        showCancel: false,        success: function (res) { }       })      }     });    }   }  }); } 

后端上傳代碼(將文件上傳到服務(wù)器臨時文件夾內(nèi))

[HttpPost] public ContentResult UploadFileNew() {   UploadFileDTO model = new UploadFileDTO();   HttpPostedFileBase file = Request.Files["uploadfile_ant"];   if (file != null)   {     //公司編號+上傳日期文件主目錄     model.Catalog = DateTime.Now.ToString("yyyyMMdd");     model.ImgIndex = Convert.ToInt32(Request.Form["imgIndex"]);      //獲取文件后綴     string extensionName = System.IO.Path.GetExtension(file.FileName);      //文件名     model.FileName = System.Guid.NewGuid().ToString("N") + extensionName;      //保存文件路徑     string filePathName = System.IO.Path.Combine(CommonHelper.GetConfigValue("ImageAbsoluteFolderTemp"), model.Catalog);     if (!System.IO.Directory.Exists(filePathName))     {       System.IO.Directory.CreateDirectory(filePathName);     }     //相對路徑     string relativeUrl = CommonHelper.GetConfigValue("ImageRelativeFolderTemp");     file.SaveAs(System.IO.Path.Combine(filePathName, model.FileName));      //獲取臨時文件相對完整路徑     model.Url = System.IO.Path.Combine(relativeUrl, model.Catalog, model.FileName).Replace("//", "/");   }   return Content(Newtonsoft.Json.JsonConvert.SerializeObject(model)); } 
/// <summary> /// 上傳文件 返回數(shù)據(jù)模型 /// </summary> public class UploadFileDTO {   /// <summary>   /// 目錄名稱   /// </summary>   public string Catalog { set; get; }   /// <summary>   /// 文件名稱,包括擴(kuò)展名   /// </summary>   public string FileName { set; get; }   /// <summary>   /// 瀏覽路徑   /// </summary>   public string Url { set; get; }   /// <summary>   /// 上傳的圖片編號(提供給前端判斷圖片是否全部上傳完)   /// </summary>   public int ImgIndex { get; set; } } 
#region 獲取配置文件Key對應(yīng)Value值 /// <summary> /// 獲取配置文件Key對應(yīng)Value值 /// </summary> /// <param name="key"></param> /// <returns></returns> public static string GetConfigValue(string key) {   return ConfigurationManager.AppSettings[key].ToString(); } #endregion

設(shè)置配置文件上傳文件對應(yīng)的文件夾信息

<appSettings>  <!--圖片臨時文件夾 絕對路徑-->  <add key="ImageAbsoluteFolderTemp" value="D:/Images/temp" />  <!--圖片正式文件夾 絕對路徑-->  <add key="ImageAbsoluteFolderFinal" value="D:/Images/product" />   <!--圖片臨時文件夾 相對路徑-->  <add key="ImageRelativeFolderTemp" value="http://192.168.1.79:9009/temp"/>  <!--圖片正式文件夾 相對路徑-->  <add key="ImageRelativeFolderFinal" value="http://192.168.1.79:9009/product"/> </appSettings> 

PS:上傳到服務(wù)器的臨時文件夾內(nèi),當(dāng)用戶點(diǎn)擊保存才把這些文件移動到正式目錄下。

以上就是本文的全部內(nèi)容,希望對大家的學(xué)習(xí)有所幫助,也希望大家多多支持VEVB武林網(wǎng)。


發(fā)表評論 共有條評論
用戶名: 密碼:
驗證碼: 匿名發(fā)表
主站蜘蛛池模板: 张家口市| 宣汉县| 凤阳县| 武冈市| 米脂县| 日喀则市| 苍山县| 于田县| 拜泉县| 固安县| 友谊县| 喀喇| 昌都县| 洛扎县| 赣州市| 蚌埠市| 芮城县| 麦盖提县| 灵川县| 兰溪市| 鲁山县| 宁海县| 藁城市| 安顺市| 宁武县| 泰兴市| 旬阳县| 喀喇沁旗| 桐梓县| 乌拉特后旗| 南平市| 黎川县| 子长县| 彩票| 巴南区| 桂阳县| 沂源县| 九龙县| 南阳市| 图木舒克市| 句容市|