mui 上传图片
mui前端传输文件
//上传图片 document.getElementById('photo').addEventListener('tap', function(e) { if (mui.os.plus) { var buttonTit = [{ title: "拍照" }, { title: "从手机相册选择" }]; plus.nativeUI.actionSheet({ title: "上传图片", cancel: "取消", buttons: buttonTit }, function(b) { /*actionSheet 按钮点击事件*/ switch (b.index) { case 0: break; case 1: getImage(); /*拍照*/ break; case 2: galleryImg(); /*打开相册*/ break; default: break; } }) } }); // 拍照获取图片 function getImage() { var c = plus.camera.getCamera(); c.captureImage(function(e) { plus.io.resolveLocalFileSystemURL(e, function(entry) { var imgSrc = entry.toLocalURL() + "?version=" + new Date().getTime(); //拿到图片路径 setHtml(imgSrc); var dstname = "_downloads/" + getUid() + ".jpg"; //设置压缩后图片的路径 newUrlAfterCompress = compressImage(imgSrc, dstname); appendFile(dstname, imgSrc); }, function(e) { console.log("读取拍照文件错误：" + e.message); }); }, function(s) { console.log("error" + s); }, { filename: "_doc/camera/" }) } // 从相册中选择图片 function galleryImg() { plus.gallery.pick(function(e) { for (var i in e.files) { var fileSrc = e.files[i]; setHtml(fileSrc); var dstname = "_downloads/" + getUid() + ".jpg"; //设置压缩后图片的路径 newUrlAfterCompress = compressImage(e.files[i], dstname); appendFile(dstname, fileSrc); } }, function(e) { console.log("取消选择图片"); }, { filter: "image", multiple: true, maximum: 5, system: false, onmaxed: function() { plus.nativeUI.alert('最多只能选择5张图片'); } }); } function setHtml(e) { var divHtml = "<div class=\"a-add\"><img src=" + encodeURI(e) + " class=\"file_img\" style=\"width:96px;height:96px\"><img src=\"../../images/remove.png\" class=\"a-remove\"></div>"; $("#imgDiv").prepend(divHtml); } //压缩图片，这个比较变态的方法，无法return function compressImage(src, dstname) { plus.zip.compressImage({ src: src, dst: dstname, overwrite: true, quality: 20 }, function(event) { return event.target; }, function(error) { console.log(error); return src; }); } // 产生一个随机数 function getUid() { return Math.floor(Math.random() * 100000000 + 10000000).toString(); }
var files = [];
var index = 1;
var newUrlAfterCompress;
function appendFile(p, fileSrc) {
files.push({
name: "img" + index, //这个值服务器会用到，作为file的key
path: p,
fileSrc: fileSrc
});
index++;
}
//上传文件 function upload() { var url = ServerIp + "/api/upload/upload"; var task = plus.uploader.createUpload(url, { method: "POST" }, function(t, status) { if (status == 200) { $("#imgDiv").find(".a-add").remove(); files = []; index = 1; } else { files = []; } } ); //添加其他参数 for (var i = 0; i < files.length; i++) { var f = files[i]; task.addFile(f.path, { key: f.name }); } task.addData("business_id", confirm_id); task.addData("business_type", "整改确认"); task.addData("item_id", _localStorage.getItem("record_id")); //记录表id task.addData("file_type", 1); task.addData("create_user", localStorage.getItem("realName")); task.start(); }
后台接口设置
[Route("upload"), HttpPost] public IHttpActionResult Upload() { bool result = false; int count = HttpContext.Current.Request.Files.Count; string filename = ""; string compressname = ""; try { for (int i = 0; i < count; i++) { int l = HttpContext.Current.Request.Files["img" + (i + 1)].ContentLength; byte[] buffer = new byte[l]; Stream s = HttpContext.Current.Request.Files["img" + (i + 1)].InputStream; //System.Drawing.Bitmap image = new System.Drawing.Bitmap(s); string imgname = Guid.NewGuid().ToString() + ".png"; string comname = Guid.NewGuid().ToString(); AliyunOSS.PutObject(bucketName, "不符合项/" + imgname, s); // string path = "/UploadFile/upload/"; // string webPath = ConfigurationManager.AppSettings["UploadPath"].ToString(); //web下的绝对路径 // filename = path + imgname + ".png";//大图相对路径及名字 // compressname = path + comname + ".png";//小图相对路径及名字 // string savePath = webPath + path + imgname + ".png"; // string comsavePath = webPath + path + comname + ".png"; //大图 //var bitImage = GetThumbnailImage(image, image.Width, image.Height); //bitImage.Save(savePath, System.Drawing.Imaging.ImageFormat.Png);//保存 //小图 // var combitImage = GetThumbnailImage(image, 69, 69); // combitImage.Save(comsavePath, System.Drawing.Imaging.ImageFormat.Png);//保存 #region 记录表 im_file file = new im_file(); file.id = Guid.NewGuid().ToString(); file.business_id = HttpContext.Current.Request.Form["business_id"]; file.business_type = HttpContext.Current.Request.Form["business_type"]; file.item_id = HttpContext.Current.Request.Form["item_id"]; // file.file_name = imgname + ".png"; file.file_name = "不符合项/" + imgname; file.file_path = filename; file.compressedfile_path = compressname; file.file_type = 1; file.create_user = HttpContext.Current.Request.Form["create_user"]; file.create_date = DateTime.Now; _fileRepository.Insert(file); #endregion result = true; } } catch (Exception e) { result = false; } return Ok(result); } //图片压缩 public static Image GetThumbnailImage(Image srcImage, int width, int height) { Image bitmap = new Bitmap(width, height); Graphics g = Graphics.FromImage(bitmap); //设置高质量插值法 g.InterpolationMode = System.Drawing.Drawing2D.InterpolationMode.High; g.SmoothingMode = System.Drawing.Drawing2D.SmoothingMode.HighSpeed; //在指定位置并且按指定大小绘制原图片的指定部分 g.DrawImage(srcImage, new Rectangle(0, 0, width, width), new Rectangle(0, 0, srcImage.Width, srcImage.Height), GraphicsUnit.Pixel); return bitmap; }
