图片上传组件webuploader

前端组件webuploader

 

当时也是搞了很久参考这种demo，但是没记、现在事后大致总结下。直接上大概代码（我使用asp.net  MVC来做的）：

执行顺序：（get）Record/Add——Add.cshtml页面，点击确认上传执行上传图片，可多选——（post）Photo/UploadPhotos，完成图片上传。多图分别执行post接口上传、1张图失败可能不会有提示；返回图片url保存在页面的隐藏字段内——（post）Record/Add保存整个实体信息，图片url解析(用|或;)保存

 1    public ActionResult Add()
 2         {
 3             return View();
 4         }
 5 
 6         [HttpPost]
 7         public JsonResult Add(string key1, string key2, string photoUrlSplits, int typeId = 1, string remark = "")
 8         {
 9             if (key1.IsNullOrWhiteSpace() || photoUrlSplits.IsNullOrWhiteSpace() || photoUrlSplits.Length < 3)
10                 return Json(new BaseResponse(ApiCodeEnum.ParamError.GetHashCode(), "参数错误"));
11 
12             var photoUrls = photoUrlSplits.Trim(';').Split(';').ToList();
13             _service.SaveRecord(CurrentUser, key1, key2, photoUrls, typeId, remark);
14             return Json(new BaseResponse());
15         }

View Code