Angular 5 春季启动图像上传



我正在尝试将图像从Angular上传到弹簧启动休息。但是它抛出

org.springframework.web.multipart.MultipartException: Current request is not a multipart request
    at org.springframework.web.method.annotation.RequestParamMethodArgumentResolver.handleMissingValue(RequestParamMethodArgumentResolver.java:190) ~[spring-web-4.3.13.RELEASE.jar:4.3.13.RELEASE]

我是两种技术的新手。帮助我上传文件。

这是代码。

RestController

public ResponseMessage addUser(@RequestParam("profileImage") MultipartFile profileImage,
    @RequestParam("user") User user) {
try {
    if (userService.doesUserExist(user.getUsername())) {
    return new ResponseMessage("The username is not available; please choose a different username", 200);
    }
} catch (Exception e) {
    System.out.println(e.getMessage());
}
String extension = FilenameUtils.getExtension(profileImage.getOriginalFilename());
storageService.storeFile(profileImage, user.getUsername() + "." + extension, profilePicturePath);
user.setProfilePicturePath(profilePicturePath + "/" + user.getUsername() + "." + extension);
userService.addUser(user);
return new ResponseMessage(user.getUsername() + " was added successfully!", 200);
}

Angular Service

addUser(user:User,profileImage:File){
      const formData:FormData = new FormData();
     formData.append('profileImage', profileImage);
     formData.append('user',JSON.parse(JSON.stringify(user)));
     return this.http.post<ResponseMessage>("/api/admin/user/new_user",formData,this.postHttpOptions);
    }

Angular Component

setImage(files:FileList){
    this.newProfileImage = files.item(0);
  }
upload(){
if (this.newUser.password == this.newUser.confirmPassword) {
      this.userService.addUser(this.newUser,this.newProfileImage).subscribe(
        res => {
          this.responseMessage = res;
          alert(this.responseMessage.message);
        },
        err => {
          alert("Error Adding the user: " + err.message);
        }
      );
    }
}

角模板

<input type='file' id="imgInp" (change)="setImage($event.target.files)" />

我得到了它。

我所做的更改..

  1. 而不是@requestparam,我添加了@requestpart
  2. 而不是@requestParam用户,我添加了@requestPart字符串用户;然后使用ObjectMapper将字符串转换为用户。
  3. 在客户端,我删除了'contenttype = application/json',并提到没有内容类型

这是代码

public String addUser(@RequestPart("profileImage") MultipartFile profileImage,
        @RequestPart("user") String userString) throws JsonParseException, JsonMappingException, IOException {
    User user = new ObjectMapper().readValue(userString, User.class);
}

最新更新