Angular 上传图片并保存在spring-backend

Question

我是 Angular/Spring 的新手，必须存储（H2-Database）图像（jpeg/png），我不太确定应该如何做到这一点。 我在模板中得到我的文件：

<input #img type = "file"  accept="image/jpeg,image/png"  (change)="onFileSelected($event)">

我的组件类如下所示：

private userDto: User = {
    id: 0,
    name: null,
    img: null
  }

  save(name:string){
      this.userDto.name = name;
      this.userService.saveUser(this.userDto).subscribe(
        newUser => this.createdUser = newUser)
  }

  onFileSelected(event){
    this.user.img = event.target.files[0];
  }

我的服务（简化）：

saveUser(user: User): Observable<User>{
    return this.http.post<User>(this.userURI, user);
  }

我在 Spring 中使用 @PostMapping/@RequestBody 捕捉帖子。 我现在的问题是：我必须在 Angular 和 Spring [java] 中发送和使用哪种类型，我可以将图像存储在后端并在返回时显示我刚刚存储的图像。 （或者我做错了什么？）对于可能转储的问题很抱歉，但我以前从未使用过 Angular 或 Spring。 提前致谢

Answer 1

uploadFile( file: File , id : number ) : Observable<any>  
  {  
    let url = this.baseUrl + "uploadImage/" + id ;  

    const formdata: FormData = new FormData();  

    formdata.append('file', file);  

    return this.http.post(url , formdata);  
  }  

在 event.target.files.item(0) 中检索 File 类型的文件参数

查看更多详细信息： https : //www.javatpoint.com/angular-spring-file-upload-example