图片的上传(多张图片的上传)
页面展示:点击链接查看图片(用到了jstl插件)
jsp页面: <LINK href="${basePath}plugins/uploadify/uploadify.css" type="text/css" rel="stylesheet" /> <script language="javascript" type="text/javascript"> //防止客户端缓存文件,造成uploadify.js不更新,而引起的“喔唷,崩溃啦” document.write ("<script type='text/javascript' " + "src='${basePath}plugins/uploadify/jquery.uploadify.min.js?" + new Date () + "'><\/script>"); </script> <style> .uploadify-box { width: 130px; margin: 0px; margin-top: 10px; } <%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%> <%@taglib prefix="f" uri="http://java.sun.com/jsp/jstl/fmt"%> <%@taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions"%> <script type="text/javascript"> $(function() { //图片上传 $('.uploadImage').each(function(){ var id= $(this).attr("id"); var $this = $(this); $("#"+id).uploadify({ fileSizeLimit : '1024KB', uploader : '${basePath}/core/upload!uploadImage.action', // 服务器端处理地址 swf : '${basePath}js/uploadify/uploadify.swf', // 上传使用的 Flash buttonText : "上传图片", buttonCursor : 'hand', fileObjName : 'uploadify',// 上传参数名称 后台action里面的属性uploadify fileTypeExts : "*.jpg;*.png;*.gif", // 扩展名 fileTypeDesc : "请选择 jpg png gif 文件", removeTimeout : 1, // 文件说明 auto : true, // 选择之后,自动开始上传 multi : true, // 是否支持同时上传多个文件 queueSizeLimit : 10, // 允许多文件上传的时候,同时上传文件的个数 queueID : 'show_queueID', onUploadSuccess : function(file,data, response) { var data = jQuery.parseJSON(data); if(data.error == 1){ ldDialog.alert(data.message); }else{ //地址赋值 var fname=data.fileName; var pth=data.url; var ul=$("#workSecurityCheck\\.checkPhoto").val(); $("#workSecurityCheck\\.checkPhoto").val(ul+fname+";"+pth+"|"); //图片显示 var htmlString ="<a target='_blank' href='${basePath}/"+data.url+"' style='color: #ff7800;padding-right:20px;'>"+fname+"</a>"; $("#workSecurityCheck\\.checkPhoto").after(htmlString); } } }); }); }); </script> <tr> <td width="20%" class="right yhItem1"> <span class="font12">*</span>照片: </td> <td> <c:if test="${readOnly == null }"> <input type="button" id="uploadImage" class="uploadImage" name="button" ${readOnly} value="上传图片"/> </c:if> </td> </tr> <tr> <td width="20%" class="right yhItem1"></td> <td> <div id="deleteID"> <c:if test="${not empty workSecurityCheck.checkPhoto}"> <c:forEach items="${fn:split(workSecurityCheck.checkPhoto,'|')}" var="val" > <a target='_blank' href="${basePath}/${fn:substring(val, fn:indexOf(val, ';')+1 , fn:length(val))}" style="color: #ff7800;padding-right:20px;">${fn:substring(val, 0, fn:indexOf(val, ';') )}</a> </c:forEach> </c:if> </div> <input name="workSecurityCheck.checkPhoto" type="hidden" class="input138 ldText" id="workSecurityCheck.checkPhoto" value="${workSecurityCheck.checkPhoto}" /> </td> </tr> java : @RequestMapping("core/upload!uploadImage.action") public void uploadImage(@RequestParam(value = "uploadify", required = false) MultipartFile uploadify,HttpServletResponse response,ModelMap modelMap)throws Exception { String savePath = getRequest().getServletContext().getRealPath("/")+ "/" + "upload/"; String saveUrl = "upload/"; HashMap<String, String> extMap = new HashMap<String, String>(); extMap.put("image", "gif,jpg,jpeg,png,bmp"); extMap.put("csv", "csv"); //获取系统定义的上传最大限值 Integer uploadMaxSize =Integer.valueOf(optionService.getByOptionName(CoreValue.OPTION_UPLOAD_MAX_SIZE).getOptionValue()); long maxSize = Long.valueOf(String.valueOf(uploadMaxSize)).longValue(); String maxSizeKb = StringUtil.formatNumber(new Double(maxSize / 1024L),"0"); response.setContentType("text/html; charset=UTF-8"); String jsonString =""; if (uploadify==null || uploadify.isEmpty()) { jsonString = getError("请选择文件。"); response.getWriter().println(jsonString); return; } File uploadDir = new File(savePath); if (!uploadDir.isDirectory()) { jsonString = getError(savePath + "上传目录不存在。"); response.getWriter().println(jsonString); return; } if (!uploadDir.canWrite()) { jsonString = getError("上传目录没有写权限。"); response.getWriter().println(jsonString); return; } String dirName = getRequest().getParameter("dir"); if (dirName == null) { dirName = "image"; } if (!extMap.containsKey(dirName)) { jsonString = getError("目录名不正确。"); response.getWriter().println(jsonString); return; } savePath = savePath + dirName + "/"; saveUrl = saveUrl + dirName + "/"; File saveDirFile = new File(savePath); if (!saveDirFile.exists()) { saveDirFile.mkdirs(); } SimpleDateFormat sdf = new SimpleDateFormat("yyyy/MM/dd"); String ymd = sdf.format(new Date()); savePath = savePath + ymd + "/"; saveUrl = saveUrl + ymd + "/"; File dirFile = new File(savePath); if (!dirFile.exists()) { dirFile.mkdirs(); } String fileName = uploadify.getOriginalFilename(); long fileSize = uploadify.getSize(); if (fileSize > maxSize) { jsonString = getError("上传文件大小超过限制。最大为" + maxSizeKb + "kb"); response.getWriter().println(jsonString); return; } String fileExt = fileName.substring(fileName.lastIndexOf(".") + 1).toLowerCase(); if (!Arrays.asList(((String) extMap.get(dirName)).split(",")).contains(fileExt)) { jsonString = getError("不允许的上传文件类型。"); response.getWriter().println(jsonString); return; } SimpleDateFormat df = new SimpleDateFormat("yyyyMMddHHmmss"); String newFileName = df.format(new Date()) + "_"+ new Random().nextInt(1000) + "." + fileExt; File uploadedFile = null; try { uploadedFile = new File(savePath, newFileName); if(uploadedFile.exists()){ } if(!uploadedFile.exists()){ uploadedFile.mkdirs(); } uploadify.transferTo(uploadedFile); } catch (Exception e) { jsonString = getError("上传文件失败。"); response.getWriter().println(jsonString); return; } JSONObject obj = new JSONObject(); obj.put("error", Integer.valueOf(0)); obj.put("url", saveUrl + newFileName); obj.put("fileName", fileName); jsonString = obj.toJSONString(); modelMap.put("fileName", fileName); modelMap.put("newFileName", newFileName); modelMap.put("url", saveUrl + newFileName); response.getWriter().println(jsonString); return; }
private String getError(String message) { JSONObject obj = new JSONObject(); obj.put("error", Integer.valueOf(1)); obj.put("message", message); return obj.toJSONString(); }