文件上传示例

本例的目的是把本地文件以字节数组的形式保存在服务器的数据库中。

  casemodify.vm

 

 

               <div class="samplePic" id="attachmentId">
     	   			 <div id="attachmentId2" class="attachmentId2Class">
					 #foreach($fileNameAndId in $attachmentNameList)
					 <div class="uploadSamplePic" id="abcd$!{fileNameAndId.id}"><span style="color:blue;line-height:20px;">$!{fileNameAndId.summary}</span></div>
					 #if("$!{fileNameAndId.summary}"!="")
					 <div class="deletefile" id="deleteAttachmentFile$!{fileNameAndId.id}"><span  onClick="confirm_delete_attachment('$!{fileNameAndId.id}','$!{fileNameAndId.summary}')">删除</span></div>#end
					 #end
					 </div>
						<ol class="files" ></ol>
					 <div class="casefilepart2" id="dialog-upload" title="导入文件" >
					 <div class="fb">   <span><input id="button4" type="file" />
						</span><span><input class="submit" type="button"  onClick="doExecuteUploadAttachment()" value="上传" /></span>	</div>
					 </div>
				</div>

 

 

	<!-- AJAX Upload script doesn't have any dependencies-->
	<script type="text/javascript" src="../source/js/fileUpload/ajaxupload.3.6.js"></script>

...
<script type="text/javascript" >

	var riskId = $("#riskId").val();
	var arkUser = $("#arkUser").val();

		new AjaxUpload('#button4', {
		action: 'uploadAttachment.action',
		data:{"riskId":riskId,"arkUser":arkUser},
		name: 'myAttachmentFile',
		onComplete :function(attachmentFile,response){
		   if(response){
		    alert(response);
			}else{
			$("<div class='uploadSamplePic'> </div> ").appendTo($('#attachmentId .files')).text(attachmentFile);
		    }
            }
	});
</script>

 

 

	@RequestMapping("/uploadAttachment.action")
	public ModelAndView handleAttachmentUpload(HttpServletRequest request,
			HttpServletResponse response) throws Exception {
		ModelAndView mav = new ModelAndView("ajaxText");
		String riskId = request.getParameter("riskId");
		String arkUser = request.getParameter("arkUser");

		List<String> fileNames = riskRelationDao.getAttachmentNameListBy(
				riskId,
				Constants4BizType.RELATION_FILE_ATTACHMENT_BUNINESS_TPYE);
		if (fileNames != null && fileNames.size() >= 10) {
			mav.addObject("errorInfo4FileAttachment", "上传附件超过10个，请删除后重新上传！");
			return mav;
		}
		Map<String, Object> retMap = this.executeFileUpload(request);
		if (retMap.get("hadRetError") != null
				&& retMap.get("hadRetError").equals("true")) {
			mav.addObject("errorInfo4FileAttachment",
					retMap.get("errorInfo4FileAttachment"));
			mav.addObject("errorInfo4FileStream",
					retMap.get("errorInfo4FileStream"));
			return mav;
		}

return mav;
}

 

处理上传文件的逻辑：

 

 

public Map<String, Object> executeFileUpload(HttpServletRequest request)
			throws Exception {
		Map<String, Object> retInfo = new HashMap<String, Object>();

		MultipartHttpServletRequest multipartRequest = (MultipartHttpServletRequest) request;
		// 其实就是ajax中传入的name参数对应的值
		String inputFileName = null;
		// 转型为MultipartHttpRequest：
		if (multipartRequest.getFileNames().hasNext()) {
			inputFileName = multipartRequest.getFileNames().next();
		}
		if (StringUtil.isNullOrEmpty(inputFileName)) {
			retInfo.put("errorInfo4SamplePic", "未发现上传文件");
			// 'hadRetError'告诉函数的调用方被调函数有没有逻辑和要求错误
			retInfo.put("hadRetError", "true");
			return retInfo;
		}
		// 获得文件：
		MultipartFile multipartFile = multipartRequest.getFile(inputFileName);
		// 获得文件名：
		String fileName = multipartFile.getOriginalFilename();
		// 过滤文件特殊字符,因为这些在下载时的url请求参数中属于url固有的特殊字符+/?%#&=
		String regEX = "[+%#&=()]";
		Pattern p = Pattern.compile(regEX);
		Matcher m = p.matcher(fileName);
		fileName = m.replaceAll("").trim();

		String fileNameToLower = fileName.toLowerCase();
		boolean pictrueFormat = fileNameToLower.endsWith(".jpg")
				|| fileNameToLower.endsWith(".jpeg")
				|| fileNameToLower.endsWith(".gif")
				|| fileNameToLower.endsWith(".png")
				|| fileNameToLower.endsWith(".bmp");
		boolean attachmentFileFormat = pictrueFormat
				|| fileNameToLower.endsWith(".doc")
				|| fileNameToLower.endsWith(".docx")
				|| fileNameToLower.endsWith(".xlsx")
				|| fileNameToLower.endsWith(".pdf")
				|| fileNameToLower.endsWith(".xls")
				|| fileNameToLower.endsWith(".rar")
				|| fileNameToLower.endsWith(".zip")
				|| fileNameToLower.endsWith(".pptx")
				|| fileNameToLower.endsWith(".ppt")
				|| fileNameToLower.endsWith(".txt");
		// ajax请求中根据是否是"myPicfile"还是"myAttachmentFile"区别图片上传还是附件上传
		if (inputFileName.equals(AJAX_UPLOAD_PIC_FILE_TYPE) && !pictrueFormat) {

			retInfo.put("errorInfo4SamplePic",
					"请上传图片格式的文件（支持.jpg .jpeg .gif .png .bmp格式），上传格式错误！");
			retInfo.put("hadRetError", "true");
			return retInfo;

		}
		if (inputFileName.equals(AJAX_UPLOAD_ATTACHMENT_FILE_TYPE)
				&& !attachmentFileFormat) {
			retInfo.put(
					"errorInfo4FileAttachment",
					"请上传下列格式的文件（支持.jpg .jpeg .gif .png .bmp .doc .rar .zip .txt docx .xlsx .xls.pdf .ppt .pptx格式 ），上传格式错误!");
			retInfo.put("hadRetError", "true");
			return retInfo;
		}
		if (inputFileName.equals(AJAX_UPLOAD_PIC_FILE_TYPE)
				&& multipartFile.getSize() > MAXPICTURESIZE) {
			retInfo.put("errorInfo4SamplePic", "上传图片文件大小超过20M,上传失败！");
			retInfo.put("hadRetError", "true");
			return retInfo;
		}
		if (inputFileName.equals(AJAX_UPLOAD_ATTACHMENT_FILE_TYPE)
				&& multipartFile.getSize() > MAXATTACHMENTSIZE) {
			retInfo.put("errorInfo4FileAttachment", "上传附件大小超过20M,上传失败！");
			retInfo.put("hadRetError", "true");
			return retInfo;
		}

		InputStream is = null;
		ByteArrayOutputStream byteArrayOutputStream = null;
		try {
			is = multipartFile.getInputStream();
			byteArrayOutputStream = new ByteArrayOutputStream();
			byte[] buffer = new byte[1024];
			// int data;
			// while ((data = is.read()) != -1) {
			// byteArrayOutputStream.write(data);
			// }
			int len = 0;
			while ((len = is.read(buffer)) > 0) {
				byteArrayOutputStream.write(buffer, 0, len);
			}
		} catch (IOException e) {
			retInfo.put("errorInfo4FileStream", "读取上传文件流失败！");
			// 异常时对流关闭
			is.close();
			byteArrayOutputStream.close();
			retInfo.put("hadRetError", "true");
			return retInfo;
		}

		byte[] uploadPicureAttachment = byteArrayOutputStream.toByteArray();
		retInfo.put("uploadPicureAttachment", uploadPicureAttachment);
		retInfo.put("uploadFileName", fileName);
		return retInfo;

	}

 如果需要上传组件可以邮件联系。

 

js脚本对上传文件和删除文件的动态效果生成，而不需要进行页面的刷新：

 

	function confirm_delete_attachment(id,str)
	{
	  var fileName=encodeURIComponent(str);
    	if(!window.confirm("亲，您确定删除？")){
    	 return;	        
    	 }
	   $ .post('/deleteAttachment.action?token='+Math.random()*10000000,
       {'fileName':fileName,'riskId':riskId},
	   function(data){
	      alert(data);
      	   $("#deleteAttachmentFile"+id).remove();
           $("#abcd"+id).remove();
    	});	
	}

 

	function doExecuteUploadAttachment(){
    	var fileName=$('.files .uploadSamplePic').html();
    	$ .post('/getUploadedFileId.action?token='+Math.random()*10000000,
		{'fileName':fileName,'riskId':riskId},
		function(data){
		var tem="<div class='uploadSamplePic' id='abcd"+data+"'><span style='color:blue;line-height:20px;'>"+fileName+"</span></div>";
		$('.files .uploadSamplePic').remove();
		$("#attachmentId2").append(tem+"<div class='deletefile' id='deleteAttachmentFile"+data+"'><span  onClick=\"confirm_delete_attachment(\'"+data+"\',\'"+fileName+"\')\">删除</span></div>");
		});
	}