Skip to content

Instantly share code, notes, and snippets.

@bverbeken
Last active July 22, 2018 13:37
Show Gist options
  • Save bverbeken/8282925 to your computer and use it in GitHub Desktop.
Save bverbeken/8282925 to your computer and use it in GitHub Desktop.
angular, spring MVC and multipart/form-data
$scope.saveMyObject = function () {
return $http({
method: 'POST',
url: '/my/url',
headers: {
'Content-Type': undefined // --> makes sure the boundary is set in the Content-Type header, see result file
},
data: {
file: $scope.file,
startDate: $scope.startDate,
endDate: $scope.endDate
},
transformRequest: function(data) {
var fd = new FormData();
angular.forEach(data, function(value, key) {
fd.append(key, value);
});
return fd;
}
});
};
...
@RequestMapping(method = POST, consumes = "multipart/form-data")
public void submit(@RequestBody MultiValueMap<String, Object> requestBody) {
// do stuff
}
Request Headers
===============
POST /my/url HTTP/1.1
Host: localhost:8083
Connection: keep-alive
Content-Length: 355
Authorization: Basic ZDpk
Accept: application/json, text/plain, */*
Origin: http://localhost:8083
X-Requested-With: XMLHttpRequest
User-Agent: Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/28.0.1500.71 Safari/537.36
Content-Type: multipart/form-data; boundary=----WebKitFormBoundaryPcJBO0iJ6WlKSynv
Referer: http://localhost:8083/
Accept-Encoding: gzip,deflate,sdch
Accept-Language: en-US,en;q=0.8,fr;q=0.6
Request Payload
===============
------WebKitFormBoundaryPcJBO0iJ6WlKSynv
Content-Disposition: form-data; name="file"
somefile.txt
------WebKitFormBoundaryPcJBO0iJ6WlKSynv
Content-Disposition: form-data; name="startDate"
2014-01-09
------WebKitFormBoundaryPcJBO0iJ6WlKSynv
Content-Disposition: form-data; name="endDate"
2014-01-30
------WebKitFormBoundaryPcJBO0iJ6WlKSynv--
@gcuisinier
Copy link

I'am not sure that @requestbody and MessageConverter is needed.

You can try with

RequestMapping(method = POST, consumes = "multipart/form-data")
public void submit(@RequestParam("startDate") String startDate,
@RequestParam("startDate") String endDate,
@RequestParam("file") MultipartFile file) {

But that need you to add some configuration to handle MultipartFile :

<!-- one of the properties available; the maximum file size in bytes -->
<property name="maxUploadSize" value="100000"/>

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment