第二步:配置SpringMVC.xml配置文件(具体不一定是SpringMVC.xml,看你哪个xml文件用来配置SpringMVC框架的)commons-io commons-io2.4 commons-fileupload commons-fileupload1.3.1
第三步:编写处理图片上传的方法(Controller)
@Controller
@RequestMapping("/file")
public class UploadController {
//文件上传路径
private String filePath = "C:\upload";
@ResponseBody
@RequestMapping("/upload") // 等价于 @RequestMapping(value = "/upload", method = RequestMethod.POST)
public String uplaod(HttpServletRequest req, @RequestParam("file") MultipartFile file) {//1. 接受上传的文件 @RequestParam("file") MultipartFile file
try {
//2.根据时间戳创建新的文件名,这样即便是第二次上传相同名称的文件,也不会把第一次的文件覆盖了
//获取文件的后缀名 .jpg
int lastIndexOf = file.getOriginalFilename().lastIndexOf(".");
String suffix = file.getOriginalFilename().substring(lastIndexOf);
String fileName = System.currentTimeMillis() + suffix;
//3.通过req.getServletContext().getRealPath("") 获取当前项目的真实路径,然后拼接前面的文件
//String destFileName = req.getServletContext().getRealPath("") + "uploaded" + File.separator + fileName;
String destFileName = filePath+ File.separator+fileName;
//4.第一次运行的时候,这个文件所在的目录往往是不存在的,这里需要创建一下目录(创建到了webapp下uploaded文件夹下)
File destFile = new File(destFileName);
destFile.getParentFile().mkdirs();
//5.把浏览器上传的文件复制到希望的位置
file.transferTo(destFile);
//6.把文件名放在model里,以便后续显示用
return "/image/"+fileName;
} catch (FileNotFoundException e) {
e.printStackTrace();
return "上传失败," + e.getMessage();
} catch (IOException e) {
e.printStackTrace();
return "上传失败," + e.getMessage();
}
}
}
第四步:编写页面表单
第五步:编写Javascript文件
function headFileUploadFunction(){
var formData = new FormData();
formData.append("file",$("#headFileUpload").prop("files")[0]);
$.ajax({
url:"<%=path%>/file/upload",
type:"post",
data: formData,
contentType:"application/x-www-form-urlencoded; charset=utf-8",
async: false,
cache: false,
contentType: false,
processdata: false,
success: function(data){
console.log(data);
$("#head").val(data);
}
});
}
注意看上述的这种写法
var formData = new FormData();
formData.append(“file”,$("#headFileUpload").prop(“files”)[0]);
OK!分享一波用法!不会的给我私信或者回复留言!
觉得有帮助的可以关注一波!经常分享编程踩坑经验!



