时间戳

首页 > 解决方案 > 如何在单个请求中发布 PDF 和 FormGroup？

javascript - 如何在单个请求中发布 PDF 和 FormGroup？

问题描述

我需要在一个请求中发布 PDF 文件和 FormGroup。我尝试将 PDF 作为 FormData 和 FormGroup 原样传递，并将两者都添加到 FormData 中。我不知道如何同时传递两者，或者我需要在我的 REST 请求中添加哪些注释。
在我的 ts 中：

 onSubmit() {
    const formData = new FormData();
    formData.append('pdfFile', this.myfile);

    this.form.removeControl('pdfFile');
    formData.append('invoice', this.form.value)

    this.http.post("http://localhost:8080/zugferd/matform", formData)
      .subscribe(res => {
        console.log(res);
      });
  }

在我的 Spring 控制器中：

@CrossOrigin(origins = "http://localhost:4200")
@PostMapping(value = "/matform")
public void both(@RequestPart("pdfFile") MultipartFile pdfFile, @RequestPart("invoice") MyInvoice invoice ,HttpServletResponse response) throws IOException {
    System.out.println(invoice.getSender().getStreet());
    System.out.println(pdfFile);
}

编辑：找到解决方案：

      onSubmit() {
        const formData = new FormData();
        formData.append('pdfFile', this.myfile);
        this.form.removeControl('pdfFile');
        
        const json = JSON.stringify(this.form.value);
        const blob = new Blob([json], {type: 'application/json'})
        formData.append('form', blob)
        this.http.post("http://localhost:8080/zugferd/matform", formData)
          .subscribe(res => { 
            //stuff
        });
       }

标签： javascriptjavaangularspringrest

解决方案

看起来你在角度部分方面做得很好。我做了类似的事情，需要将文件作为“文件 [0]”传递，以便让我的后端（带有 Nancy 的 C#）将文件作为Files集合的单个元素来获取。

const formData = new FormData();
formData.append('file[0]', this.file, this.file.name);
formData.append('editObject', JSON.stringify(this.editObject));

const uri = "/v1/someUri";
this.httpService.post(uri, formData, 'json', true)
    .subscribe(() => this.onDataSaved(), err => this.onError("Could not save file.", err));

在服务中，我认为您需要掌握整个请求并根据边界分隔条目（至少我找不到任何其他方法）。我不熟悉 Spring，但也许这段 C# 代码可以帮助你；

var contentType = new ContentType(Request.Headers.ContentType);
var boundary = $"--{contentType.Boundary}";

using (var reader = new StreamReader(Request.Body))
{
    var body = reader.ReadToEnd();
    var startTag = "Content-Disposition: form-data; name=\"editObject\"";
    var jsonPart = StringHelper.ValueBetween(body, startTag, boundary);

    var editObject = JsonConvert.DeserializeObject<SomeEditObject>(jsonPart);

    return await ExecuteCommandAsync(commandProcessorAsync, new AddFileCommand(editObject, Request.Files));
}

推荐阅读