此后台方法使用于所有上传,前台代码属于AJAX异步上传,需要下载jquery.form.js,以及upload.jar和io.jar
后台代码 @RequestMapping("/upload") @ResponseBody public String upload(HttpServletRequest request, String fileNames) throws IOException{ System.out.println("11111111111111111"); //强制转换request MultipartHttpServletRequest mr = (MultipartHttpServletRequest) request; //获得到文件 CommonsMultipartFile cmf = (CommonsMultipartFile) mr.getFile(fileNames); //获得文件的字节数组 byte[] fbyte = cmf.getBytes(); String fileName = ""; SimpleDateFormat format = new SimpleDateFormat("yyyyMMddHHmmssSSS"); fileName = format.format(new Date()); Random random = new Random(); for(int i = 0; i < 3; i++){ fileName = fileName + random.nextInt(10); } //获得原始文件名 String oriFileName = cmf.getOriginalFilename(); //获得文件的后缀名 String suffix = oriFileName.substring(oriFileName.lastIndexOf(".")); //获得发布后的根路径 String realPath = request.getSession().getServletContext().getRealPath("/"); realPath=realPath.substring(0, realPath.indexOf(":")+1)+File.separator+"localspace"+File.separator+company; System.out.println(realPath); File f=new File(realPath); if(!f.exists()){ f.mkdirs(); } OutputStream out = new FileOutputStream(new File(realPath+File.separator+fileName+suffix)); /*OutputStream out = new FileOutputStream(f);*/ System.out.println(fileName); out.write(fbyte); out.flush(); out.close(); return "success"; } } 前台代码 function submitUpload(){ var option = { url:basePath+"/uaModueItemService/upload.do", type:"post", dataType:"text", data:{ fileNames:"imgsFile" }, success:function(responseText){ alert(responseText); /*var obj = $.parseJSON(responseText); $("#imgsImgSrc").attr("src", obj.realPath); $("#imgs").val(obj.raltivePath);*/ }, error:function(){ alert("系统错误"); } } //以ajax的方式提交表单,如果option中指定url那么表单就不再提交到表单中action,而是提交option中的url上 $("#form111").ajaxSubmit(option); } return " <form id='form111' method='post' enctype='multipart/form-data'>" + "<input type='file' name='imgsFile' οnchange='submitUpload(this)' value='请选择文件'/></form>"; 如果使用springmvc 需要在配置文件中写 如下代码 <bean id="multipartResolver" class="org.springframework.web.multipart.commons.CommonsMultipartResolver"> <!-- 以字节为单位 --> <property name="maxUploadSize" value="1024000"></property> </bean> 如果是上传头像
<style>
.fileInputContainer {
height: 40px;
left: 50px;
width: 15px;
}
.fileInput {
height: 40px;
right: 0;
top: 0;
opacity: 0;
filter: alpha(opacity = 0);
cursor: pointer;
}
</style>
<img οnclick="openFile();" src="<%=request.getContextPath()%>/myinfo/loadPhoto.do"
id="imgPhoto" class="photo"
style="height:180px;width:150px;margin-left:5px;margin-top:5px;">
function openFile() {
return $("#file_upload").click();
}
<form id='file' method='post' enctype='multipart/form-data'>
<input class="fileInput" type="file" id="file_upload" name="imgsFile" οnchange="submitUpload();" />
</form>
|
SpringMVC实现文件上传
最新推荐文章于 2023-05-04 16:10:06 发布