700字范文,内容丰富有趣,生活中的好帮手!
700字范文 > SpringBoot结合angularjs表单上传文件

SpringBoot结合angularjs表单上传文件

时间:2024-01-24 14:53:29

相关推荐

SpringBoot结合angularjs表单上传文件

前端代码:

<form id="form_upload"><input id="upload_img_id" type="file" name="fileName"/><button ng-click="uploadFile()" type="button">上传</button></form>

angularjs代码

this.uploadFile = function(){//重点1:form_upload是form表单的idvar formData = new FormData(document.getElementById("form_upload"));//重点2:upload_img_id是文件input的idvar file = document.getElementById("upload_img_id").files[0];//重点3:向formData中添加数据:formData.append("file",file);//下面是angularjs的代码,可以换成其他前端代码实现,重点是formData上传return $http({method:'post',url:'/seller/fileload/uploadFile.do',data:formData,headers:{'Content-Type':undefined} ,// Content-Type : text/html text/plaintransformRequest:angular.identity//浏览器会帮我们把Content-Type 设置为 multipart/form-data.});}

端java代码(SpringBoot的),SpringBoot自带文件上传,可以直接用

//重点4:@RequestParam("fileName")这个跟前端的input标签的name一致@RequestMapping(value = "uploadFile.do", method = RequestMethod.POST)@ResponseBodypublic String fileUpload(@RequestParam("fileName") MultipartFile file){System.out.println(file.getOriginalFilename()+">>>>>>>>>");if(file.isEmpty()){return "false";}String fileName = file.getOriginalFilename();//z.pngint size = (int) file.getSize();//fileName=fileName.substring(fileName.lastIndexOf("\\")+1);String path = System.getProperty("user.dir");// /Users/apple/Desktop/IDEAWORKSPACE/day2/shoppingmall2File dest = new File(path+"/target/classes/static/img" + "/" + fileName);if(!dest.getParentFile().exists()){ //判断文件父目录是否存在dest.getParentFile().mkdir();}try {file.transferTo(dest); //保存文件return "{\"img_path\":\"http://localhost:8080/img/"+fileName+"\"}";} catch (IllegalStateException e) {e.printStackTrace();return "false";} catch (IOException e) {e.printStackTrace();return "false";}}

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。