java—通过单个端点将字符串数据和文件发送到基于spring的服务器

neskvpey  于 2021-07-12  发布在  Java
关注(0)|答案(0)|浏览(500)

我有一个基于spring的端点:

@PostMapping("/new")
  public ResponseEntity house(@RequestBody Map<String ,Object> data) {
    data.values().forEach(System.out::println); 
    return ResponseHub.defaultFound("");
  }

我只想发送一个文件和一些数据。我用离子和角离子,所以在角离子中我有:

let map = new TSMap();
    map.set('field1', 'wan');
    map.set('field2', 'two');
    this.files = event.target.files;
    map.set('files', this.files);
    let data = map.toJSON();
    const httpOptions = {
      headers: new HttpHeaders({
        'Content-Type': 'application/json'
      })
    };
    let url = "http://localhost:8080/api/data";
    this.http.post<HttpResponse>(url, data, httpOptions).pipe().toPromise().then(response=>{
      console.log(response);
    });

遗憾的是,我在后端得到的输出只是

wan
two
{0={}}

我知道这是因为我的内容类型设置为 application/json 在http请求中,我对angular进行了访问。我到处寻找,我找到了一个解决方案,但允许上传一个文件,我将无法添加任何其他数据连同它。最好的解决办法是什么?
编辑:调用包含Angular 代码的函数的html:

<ion-item>
    <ion-label id="profile_image" stacked>Select File</ion-label>
    <ion-input type="file" accept=".png, .jpg" multiple (change)="selectFile($event)">
      Select Image
    </ion-input>
  </ion-item>

这是它获取文件的地方。
建议的解决方法:我尝试使用 FormData ```
selectFile(event) {
let formData = new FormData();
let map = new TSMap();
map.set('field1', 'wan');
map.set('field2', 'two');
let data = map.toJSON();
formData.append('data', JSON.stringify(data));
this.files = event.target.files;
formData.append('files', this.files);
const httpOptions = {
headers: new HttpHeaders({
'Content-Type': 'multipart/form-data'
})
};
let url = "http://localhost:8080/api/data";
this.http.post(url, formData, httpOptions).pipe().toPromise().then(response=>{
console.log(response);
});
}

后端:

@PostMapping("/data")
public ResponseEntity house(@RequestPart(name = "data") Map<String, Object> data,
@RequestPart(name = "files") MultipartFile[] files) throws IOException {
data.values().forEach(System.out::println);
for (MultipartFile file: files)
System.out.println(file.getInputStream().available());
return ResponseHub.defaultFound("");
}

现在它给了我一个错误:
org.apache.tomcat.util.http.fileupload.fileuploadexception:请求被拒绝,因为找不到多部分边界

暂无答案!

目前还没有任何答案,快来回答吧!

相关问题