Angular - file upload request, adding @RequestParam

Question

I want to add @RequestParam to my http request so it will match spring MVC @RequestParam.

How can I add this to my file upload request:

/*
@param file - file from input

@param uploadUrl - url
*/    

    this.uploadFileToUrl = function(file, uploadUrl){
                var fd = new FormData();
                //add file to FormData
                fd.append(file.name, file);
                //send request
                $http.post(uploadUrl, fd,  {
                    transformRequest: angular.identity,
                    headers: {'Content-Type': undefined}
                })
                .success(function(result){
                    console.log(result);
                })
                .error(function(err){
                    console.log(err);
                });
            }

In my backend the error is Required String parameter 'filename' is not present Here is my Spring MVC controller (only the header part):

@Controller
@RequestMapping("/file")
public class FileUploadController {
    /**
     * Upload single file using Spring Controller
     */
    @RequestMapping(value = "/uploadFile", method = RequestMethod.POST)
    public @ResponseBody String uploadFileHandler(@RequestParam("filename") String filename, @RequestParam("file") MultipartFile file) {
//rest of the function

}

I presume you have consulted the documentation for either Angular $http or FormData and tried to add the parameters as described. What problems did you experience? — a better oliver
– a better oliver, Commented Nov 10, 2016 at 14:41
The backend error - Required String parameter 'filename' is not present, error code 400 — Itsik Mauyhas
– Itsik Mauyhas, Commented Nov 10, 2016 at 14:44

Itsik Mauyhas · Accepted Answer · 2016-11-10 14:46:36Z

2

So I just append another param to my FormData:

fd.append('file', file);
fd.append('filename', file.name);

Match the @RequestParam's.

Thanks.

answered Nov 10, 2016 at 14:46

Itsik Mauyhas

4,01415 gold badges75 silver badges119 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Angular - file upload request, adding @RequestParam

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related