jeefast和Mybatis实现图片上传

数据库加上图片的路径字段

  @Override
    public void addResourceHandlers(ResourceHandlerRegistry registry) {
        registry.addResourceHandler("/imctemp-rainy/**").addResourceLocations("file:D:\\picture\\"); //路经
    }

  filterMap.put("/imctemp-rainy/**", "anon");

js部分

	**// 图片上传部分**
	$(function () {
		$("#button").click(function () {
			var form = new FormData();
			form.append("file", document.getElementById("file").files[0]);
			$.ajax({
				url: baseURL + 'platform/student/upload',        //后台url
				data: form,
				cache: false,
				async: false,
				type: "POST",                   //类型，POST或者GET
				dataType: 'json',              //数据返回类型，可以是xml、json等
				processData: false,
				contentType: false,
				success: function (data) {      //成功，回调函数
					if (data.code == 0) {
						var pic="/jeefast/imctemp-rainy/"+data.img.fileName;
						vm.student.picture = pic;
						$("#url img").attr("src",pic);
					} else {
						alert("失败");
					}
				},
				error: function (er) {          //失败，回调函数
					alert("上传失败");
				}
			});
		});
		$("#t_button").click(function () {
			//这里分割字符串 /imctemp-rainy/157352875235607c10257539a5f4dcdaab233ca2832a5.jpg
			//需要用/分割字符先后获取最后一段字符串去上传到后台
			//alert($("#url img").attr("src"));
			var img = $("#url img").attr("src");
			var str = img.split("/");
			var str_img=str[str.length-1];
			//alert(str_img);
			if(str_img == "1.jpg"){
				//alert(1);
			}else{
				vm.pic = null;
				$.post(baseURL + 'platform/student/deleteImages',{filePath:str_img},function(data){
					// alert(JSON.stringify(data));
					//这里我们取消上传成功之后去给换成一个暂无图片的一个图
					$("#url img").attr("src","/jeefast/imctemp-rainy/1.jpg");
				});
			}
		})
	})

{ label: '学生图片', name: 'picture', width: 75, formatter:function (value,row,index) {
					var img = "<img src='"+value+"'style=width:180px;height:150px;"+vm.student.picture+">";
					return img;
				}},

HTML部分

           <div class="form-group">
				<div class="col-sm-2 control-label">学生照片</div>
				<div class="col-sm-10">
					<input type="file" name="file" id="file" class="form-control">
					<p id="url" height="500px"><img :src=student.picture width=200></p>
					<input type="button" id="button" value="上传" >
					<input type="button" id="t_button" value="取消上传" >
				</div>
			</div>

controller部分

	//图片上传
	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();
	}
	//处理文件上传
	@Log("文件上传")
	@RequestMapping(value = "upload", method = RequestMethod.POST)
	public R uploadImg(@RequestParam("file") MultipartFile file)  {
		String fileName = System.currentTimeMillis()+file.getOriginalFilename();
		String filePath = "D:\\picture\\";
		Map<String,String> jo = new HashMap<>();
		if (file.isEmpty()) {
			jo.put("success", "0");
			jo.put("fileName", "");
		}
		try {
			uploadFile(file.getBytes(), filePath, fileName);
			jo.put("success", "1");
			jo.put("fileName", fileName);
		} catch (Exception e) {
			// TODO: handle exception
		}
		//返回json
		return R.ok().put("img", jo);
	}
	@RequestMapping("deleteImages")
	public R deleteImages(HttpServletRequest request) {
		String resultInfo = null;
		String filePath = request.getParameter("filePath");
		//这里是可以在控制器分割字符的一个方法
		//int lastIndexOf = filePath.lastIndexOf("/");
		//String sb = filePath.substring(lastIndexOf+1,filePath.length());
		//由于我们只获取了图片的名称并没有获取到所有的地址，，所以我们需要去给他进行添加存放图片的地址
		File file = new File("D:\\picture\\"+filePath);
		if (file.exists()) {
			if (file.delete()) {
				resultInfo = "1-删除成功";
			}else {
				resultInfo = "0-删除失败";
			}
		}else {
			resultInfo = "文件不存在！";
		}
		return R.ok().put("resultInfo", resultInfo);
	}

效果图

本文地址：https://blog.csdn.net/fanqingdi092298/article/details/109253602