spring boot实现上传和删除照片

spring boot实现上传和删除照片

public static void uploadFile(byte[] file, String filePath, String fileName) throws Exception {        
		File targetFile = new File(filePath); 
		if (!targetFile.exists()) {
		   targetFile.mkdirs();    
		}        
		FileOutputStream out = new FileOutputStream(filePath +"/"+ fileName);
		out.write(file);      
		out.flush();   
		out.close(); 
	}
	 //处理文件上传
  	@ResponseBody //返回json数据  
  	@RequestMapping(value = "upload", method = RequestMethod.POST) 
  	public JSONObject uploadImg(@RequestParam("file") MultipartFile file,HttpServletRequest request) {        
  	    String contentType = file.getContentType(); 
  	    
  		String fileName = System.currentTimeMillis()+file.getOriginalFilename();  		
  		String filePath = "E:/Spring Boot/photo/";
	    JSONObject jo = new JSONObject();//实例化json数据
  		if (file.isEmpty()) {   
  			jo.put("success", 0);
  			jo.put("fileName", "");
  		}        
  		try {  
  		   uploadFile(file.getBytes(), filePath, fileName);  
  		   jo.put("success", 1);
  		   jo.put("fileName", fileName);
  		   jo.put("code",0);
		   jo.put("msg", "上传成功");
  		} catch (Exception e) {   
  			jo.put("error", e);
  			jo.put("code",0);
  			jo.put("msg", "上传失败");
  		}   
  		//返回json
  	    return jo;    

  	}  

第一步

首先写一个静态方法uploadFile用于吧照片写入文件中

第二步

写一个处理文件上传的方法,在方法中构建照片的路径,名字,以及字节流,通过第一步的方法传入

第三步

<input type="file" name="file" id="file" @change="upload()">
<p id="url"><img src="" width=200></p> 
<input type="button" @click="quxiao()" value="取消照片" /> 

在html页面设置上传照片的代码,其中uploadquxiao方法的代码如下

upload:function(){
	          var form = new FormData();
	          form.append("file", document.getElementById("file").files[0]);//
	           $.ajax({
	               url: "/home/upload",        //后台url
	               data: form,
	               cache: false,
	               async: false,
	               type: "POST",                   //类型,POST或者GET
	               dataType: 'json',              //数据返回类型,可以是xml、json等
	               processData: false,
	               contentType: false,
	               success: function (data) {      //成功,回调函数
	            	   vm.dat=data;
	                   if (data) {
	                  	 var pic="/imctemp-rainy/"+data.fileName;
	                   	$("#url img").attr("src",pic);
	                   	// alert(JSON.stringify(data));
						//alert(pic);  //
	                   } else {
	                   	alert("失败");
	                   }
	               },
	               error: function (er) {          //失败,回调函数
	              	 alert(JSON.stringify(data));
	               }
	           });
		  },
@RequestMapping(value="quxiao") //控制器里面
	    @ResponseBody
		public String quxiao(String img) {
			boolean file=deleteFile("e:/Spring Boot/photo/"+img);//删除原先的图片   
			String str="1";
			if (!file) {
				str="0";
				return str;
			}
	        return str;
	    }
	    //前端Vue里面
quxiao:function(){
			var img=vm.dat.fileName;
			//alert(img);
			$.post("/news/quxiao",{img:img},function(data){
				//alert(JSON.stringify(data));
				if(data==0){
					alert("取消失败请重新点击!");
				}else{
					alert("取消成功,请重新选择!");
				}
			});
		},
发布了34 篇原创文章 · 获赞 5 · 访问量 2262

猜你喜欢

转载自blog.csdn.net/tanfei_/article/details/103145245