405 错误：带有 Spring 的多部分/表单数据

Question

我正在尝试将一个 Json 字符串连同多个文件发送到我的 Spring Controller，但是它总是给我一个 405 方法不允许错误，我做错了什么？

Javascript 代码：

var formdata = new FormData();
formdata.append('user', JSON.stringify(userData));

files.forEach(file=> {
  formdata.append('files', file);
});

jQuery.ajax({
    url: "user/submitForm",
    type: "POST",
    data: formdata,
    enctype: 'multipart/form-data',
    processData: false,
    contentType: false,
    success: function (data)
    {
        console.log("SUCCESS");
    },
    error: function (request, status, error) {
        alert(status + " : " + JSON.stringify(request));
    }
});

Controller 在 Spring：

@PostMapping(value= "/submitForm", consumes = { 
                        MediaType.APPLICATION_JSON_VALUE, 
                        MediaType.MULTIPART_FORM_DATA_VALUE })
public ResponseEntity<?> userRegistration( @RequestPart("user") String user,
            @RequestPart("files") List<MultipartFile> files, BindingResult bindingResult) {
        
        ObjectMapper obj = new ObjectMapper();
        User newUser = new User();
        newUser = obj.readValue(user, User.class);
        
        System.out.println("User : \n"+ newUser.toString());
        System.out.println("Files : \n"+ files.toString());
        return null;
}

Answer 1

这是我从Antonio112009 的回答中找到的解决方案

解决方案

@PostMapping(value = "/submitForm")
public ResponseEntity<?> userRegistration(
            @RequestParam("user") String user,
            @RequestParam(value = "files", required = false) List<MultipartFile> files) {

        ObjectMapper obj = new ObjectMapper();
        User user = new User();
        .
        .
        .
}
    

Answer 2

我使用另一种解决方案，它按预期工作，并且从我的角度来看更加灵活。

前端部分在Typescript。

前端

var formData = new FormData();
options.files.forEach(function (file) {
    formData.append(file.name, file);
});
formData.append("myParam", "coucou");
var xhr = new XMLHttpRequest();
xhr.open("POST", "/rest/upload");
xhr.onload = function () {
    var data = JSON.parse(xhr.responseText);
    options.callback("success", options.files.map(function (file) {
        return {
            file: file,
            content: data[file.name]
        };
    }));
}; 
xhr.send(formData);

后端（Java Spring）

@RestController
@RequestMapping(value = "/rest")
public class UploadController {
    
    @PostMapping(value = "/upload", consumes = MediaType.MULTIPART_FORM_DATA_VALUE)
    public ResponseEntity<Boolean> upload(MultipartHttpServletRequest request) {
        // Get param
        Object myParam = request.getParameter("myParam");
        // Get iteretaor on all files
        Iterator<String> iterator = request.getFileNames();
        MultipartFile multipartFile = null;
        while (iterator.hasNext()) {
            multipartFile = request.getFile(iterator.next());
            final String fileName = multipartFile.getOriginalFilename();
            final String fileSize = String.valueOf(multipartFile.getSize());
            // Add logic ....      
        }      
    }
    return new ResponseEntity(true);
}