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页面设置上传照片的代码,其中upload和quxiao方法的代码如下
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("取消成功,请重新选择!");
}
});
},