本文实例为大家分享了微信小程序实现图片上传功能的具体代码,供大家参考,具体内容如下
前端:微信开发者工具
后端:.Net
服务器:阿里云
前端代码
wx.chooseImage({
count: 3,//最多可以选择的图片总数
sizeType: ['compressed'],// 可以指定是原图还是压缩图,默认二者都有
sourceType: ['album','camera'],// 可以指定来源是相册还是相机,默认二者都有
success: function (res) {
// 返回选定照片的本地文件路径列表,tempFilePath可以作为img标签的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);
//服务器返回格式: { "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: '<a href="https://www.jb51.cc/tag/cuowu/" target="_blank" class="keywords">错误</a><a href="https://www.jb51.cc/tag/tishi/" target="_blank" class="keywords">提示</a>',content: '<a href="https://www.jb51.cc/tag/shangchuan/" target="_blank" class="keywords">上传</a><a href="https://www.jb51.cc/tag/tupian/" target="_blank" class="keywords">图片</a>失败',showCancel: false,success: function (res) { }
})
}
});
}
}
});
}
//<a href="https://www.jb51.cc/tag/huoqu/" target="_blank" class="keywords">获取</a><a href="https://www.jb51.cc/tag/wenjian/" target="_blank" class="keywords">文件</a>后缀
string extensionName = System.IO.Path.GetExtension(file.FileName);
//<a href="https://www.jb51.cc/tag/wenjian/" target="_blank" class="keywords">文件</a>名
model.FileName = System.Guid.NewGuid().ToString("N") + extensionName;
//保存<a href="https://www.jb51.cc/tag/wenjian/" target="_blank" class="keywords">文件</a>路径
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));
//<a href="https://www.jb51.cc/tag/huoqu/" target="_blank" class="keywords">获取</a>临时<a href="https://www.jb51.cc/tag/wenjian/" target="_blank" class="keywords">文件</a>相对完整路径
model.Url = System.IO.Path.Combine(relativeUrl,model.Catalog,model.FileName).Replace("\\","/");
}
return Content(Newtonsoft.Json.JsonConvert.SerializeObject(model));
}
<add key="ImageRelativeFolderTemp" value="http://192.168.1.79:9009/temp"/>
<add key="ImageRelativeFolderFinal" value="http://192.168.1.79:9009/product"/>