Ajax上传File对象到服务器

Posted 2020-12-16 代码很疯狂

html代码：

<input type="file" name="uploadFile" id="uploadFile">

javascript:

$("#uploadFile").on("change", function() {
　　var formData = new FormData();                      // 创建一个form类型的数据
　　formData.append(‘file‘,‘$("#uploadFile")[0].files);     // 获取上传文件的数据
　　$.ajax({
　　　　url: "/API/Face/SubmitFile",
　　　　type: "POST",
　　　　processData: false， // 将数据转换成对象，不对数据做处理，故 processData: false 
　　　　contentType: false,    // 不设置数据类型
　　　　xhrFields: {                // 这样在请求的时候会自动将浏览器中的cookie发送给后台
　　　　　　withCredentials: true
　　　　}，
　　　　data: formData,
　　　　success: function(data) {
　　　　　　console.log(data)
　　　　},
 　　　error: function(data) {
　　　　}
　　})
})

 java代码

    @RequestMapping(value ="/SubmitFile",method = RequestMethod.POST)
    public JsonResult SubmitFile(HttpServletRequest request, HttpServletResponse response) {
        try {
            String faceuid=UUID.randomUUID().toString();
            MultipartHttpServletRequest filerequest=(MultipartHttpServletRequest)request;
            MultipartFile file=filerequest.getFile("file");
　　　　　　　//保存file并返回路径
            String localfilepath = FileHelper.SaveMultipartFile(file, WebConfig.getUploaddir(), "face", faceuid + ".jpg");
            return Json.getJsonResult(true,localfilepath);
        }catch(Exception ex) {
            return Json.getJsonResult(ex.getMessage());
        }
    }