javascript - 如何在Spring MVC中将图像从jsp传递到 Controller

Question

在 Spring MVC 中将图像文件从 html 发送到 Controller 页面

File to upload: <input type="file" name="UploadFile" id="file"><br>
<input type="submit" value="Upload" onclick="sortByDateeeee()">

在 JavaScript 中获取此图像文件并将其传递给 Controller ​​。

function sortByDateeeee(){
    var request = document.getElementById("file").value;

    var url=CONTEXT_ROOT+"/login/uploadFile";
    $.ajax({  
        type: "POST",  
        url: url,  
        data:{ 
            "request": request
            },
         success: function(response){
            //alert(response);
        }
        });  
}

跟随 Controller

@ResponseBody
    @RequestMapping(value="/uploadFile", method=RequestMethod.POST)
    @HttpMethodConstraint(value = "POST")
    public  String uploadFileHandler(@RequestParam(required=false) HttpServletRequest request)
System.out.println("request: "+request);

}

我的问题是无法调用 Controller 。请帮助我解决这个问题。

Answer 1

<input type="file" name="file" />
<script type="text/javascript">
        function sortByDateeeee() {
            var formData = new FormData();
            formData.append('file', $('input[type=file]')[0].files[0]);
            console.log("form data " + formData);
            $.ajax({
                url : 'login/uploadFile',
                data : formData,
                processData : false,
                contentType : false,
                type : 'POST',
                success : function(data) {
                    alert(data);
                },
                error : function(err) {
                    alert(err);
                }
            });
        }
    </script>

在你的 Controller 中

@RequestMapping(method = RequestMethod.POST)
public @ResponseBody String doUpload(@RequestParam("file") MultipartFile multipartFile) {                 
    return "Uploaded: " + multipartFile.getSize() + " bytes";
}