Spring FormData 中的图像、表单值和对象列表

Spring image, form values and list of objects in FormData

我有 RestController 端点:

Mono<A> editA(@PathVariable String id, @Valid A a)

Class A 看起来像这样:

class A {
  private MultipartFile imageToSave;
  private String name;
  private String otherString;
  private ArrayList<B> bList;
}

Class B 看起来与 class A 相似(但仅包含字符串字段)。

前端客户端(React using Axios)发送表单值(两个字符串,图像文件)。我使用 javascript FormData 对象将此值发送到一个请求中,并且工作正常。

但我还想发送一个列表 B 对象。所以我尝试将列表 B 对象添加到 FormData 并发送它。

我如何使用 FormData 发送带有对象的列表并将其映射到 ArrayList?

Resolved [org.springframework.validation.BindException: org.springframework.validation.BeanPropertyBindingResult: 1 errors Field error in object 'a' on field 'bList': rejected value [[object Object]]; codes [typeMismatch.a.bList,typeMismatch.bList,typeMismatch.java.util.ArrayList,typeMismatch]; arguments [org.springframework.context.support.DefaultMessageSourceResolvable: codes [a.bList,bList]; arguments []; default message [bList]]; default message [Failed to convert property value of type 'java.lang.String' to required type 'java.util.ArrayList' for property 'bList'; nested exception is java.lang.IllegalStateException: Cannot convert value of type 'java.lang.String' to required type 'java.util.ArrayList' for property 'bList': no matching editors or conversion strategy found]]

我在 laravel 中使用 formData 传递错误时遇到了类似的错误。事实证明您不能将 formData API 与数组一起使用。 看看下面的 url : https://developer.mozilla.org/en-US/docs/Web/API/FormData/append 它只接受字符串或 blob。 对于您的解决方案,您将必须像我所做的那样。

  let formData = {};
            for (var property in this.form) {
                if (this.form.hasOwnProperty(property)) {
                      //  formData.append(property,this.form[property]);
                        formData[property] = this.form[property];

                }
            }

我在这里所做的基本上只是从表单输入属性构建对象,然后使用下面的代码传递 axios。

axios({
                    method: 'post',
                    url: url
                    data : formData,
                    headers:{
                        'Content-Type': 'application/json',
                    }
                }).then((response) => { ... });