Te sugerimos que revises esta respuesta en un ambiente controlado antes de enviarlo a producción, saludos.
Solución:
Sí, simplemente puede hacerlo a través de la clase contenedora.
1) Crea un Class para contener datos de formulario:
public class FormWrapper
private MultipartFile image;
private String title;
private String description;
2) Crear un HTML form para enviar datos:
3) Crear un método para recibir formularios text datos y multipart expediente:
@PostMapping("/api/upload/multi/model")
public ResponseEntity multiUploadFileModel(@ModelAttribute FormWrapper model)
try
// Save as you want as per requiremens
saveUploadedFile(model.getImage());
formRepo.save(mode.getTitle(), model.getDescription());
catch (IOException e)
return new ResponseEntity<>(HttpStatus.BAD_REQUEST);
return new ResponseEntity("Successfully uploaded!", HttpStatus.OK);
4) Método para guardar file:
private void saveUploadedFile(MultipartFile file) throws IOException
if (!file.isEmpty())
byte[] bytes = file.getBytes();
Path path = Paths.get(UPLOADED_FOLDER + file.getOriginalFilename());
Files.write(path, bytes);
Creé algo similar usando JS puro y Spring Boot. Aquí está el Repo. estoy enviando un User objeto como JSON y un File como parte de la multipart/form-data solicitud.
Los fragmentos relevantes están a continuación.
los Controller código
@RestController
public class FileUploadController
@RequestMapping(value = "/upload", method = RequestMethod.POST, consumes = "multipart/form-data" )
public void upload(@RequestPart("user") @Valid User user,
@RequestPart("file") @Valid @NotNull @NotBlank MultipartFile file)
System.out.println(user);
System.out.println("Uploaded File: ");
System.out.println("Name : " + file.getName());
System.out.println("Type : " + file.getContentType());
System.out.println("Name : " + file.getOriginalFilename());
System.out.println("Size : " + file.getSize());
static class User
@NotNull
String firstName;
@NotNull
String lastName;
public String getFirstName()
return firstName;
public void setFirstName(String firstName)
this.firstName = firstName;
public String getLastName()
return lastName;
public void setLastName(String lastName)
this.lastName = lastName;
@Override
public String toString()
return "User [firstName=" + firstName + ", lastName=" + lastName + "]";
los HTML y JS código
Tuve un caso de uso similar en el que tuve algunos datos JSON y carga de imágenes (piense en ello como un usuario que intenta registrarse con detalles personales e imagen de perfil).
Refiriéndose a la respuesta de @Stephan y @GSSwain, se me ocurrió una solución con Spring Boot y AngularJs.
A continuación se muestra una instantánea de mi código. Espero que ayude a alguien.
var url = "https://abcd.com/upload";
var config =
headers :
'Content-Type': undefined
var data =
name: $scope.name,
email: $scope.email
$scope.fd.append("obj", new Blob([JSON.stringify(data)],
type: "application/json"
));
$http.post(
url, $scope.fd,config
)
.then(function (response)
console.log("success", response)
// This function handles success
, function (response)
console.log("error", response)
// this function handles error
);
Y el controlador SpringBoot:
@RequestMapping(value = "/upload", method = RequestMethod.POST, consumes = "multipart/form-data" )
@ResponseBody
public boolean uploadImage(@RequestPart("obj") YourDTO dto, @RequestPart("file") MultipartFile file)
// your logic
return true;