如何向FormData添加多个对象

Question

我可以上传图片。 但是，我需要发送一个带有图像的json对象，以便我可以识别图像所属的记录。 我究竟做错了什么？ 为什么变量信息在服务的Java端通过null传递？

客户：

let file = event.target.files[0];
 let info = {formId:8, formVersionId:2, formIndex:0};
var formData = new FormData();
            formData.append('file', file);
            formData.append('info', info );
            $.ajax({
                url: URL.BUILDER_URL + '/megaUpload',
                type: 'POST',
                data : formData,
                cache : false,
                contentType : false,
                processData : false,
            });

服务器：

public Response uploadFile( @FormDataParam("file") InputStream uploadedInputStream, 
                                @FormDataParam("file") FormDataContentDisposition fileDetail,
                                @FormDataParam("info") GuiCreateResponse info) {
}

Answer 1

https://developer.mozilla.org/zh-CN/docs/Web/API/FormData/append

此处明确指出，FormData值可以是字符串或Blob。

let file = event.target.files[0];
var formData = new FormData();
            formData.append('file', file);
            formData.append('formId', '8' );
            formData.append('formVersionId', '2' );
            formData.append('formIndex', '0');

这应该可以解决您的问题。

Answer 2

您正在使用formId ，但您可能希望将其用引号括起来作为"formId" 。 试试这个代码。

let file = event.target.files[0];
let info = {"formId":8, "formVersionId":2, "formIndex":0}; //See changes here
var formData = new FormData();
            formData.append('file', file);
            formData.append('info', info );
            $.ajax({
                url: URL.BUILDER_URL + '/megaUpload',
                type: 'POST',
                data : formData,
                cache : false,
                contentType : false,
                processData : false,
            });

Answer 3

也许这是你的问题。 文档说：“当使用append（）方法时，可以使用第三个可选参数在发送到服务器的Content-Disposition标头内传递文件名。当未指定文件名时（或未指定参数时，支持），则使用名称“ blob”。”

由于您没有提供第三个参数，因此我认为FormDataContentDisposition需要查找“ blob”。 尝试更改服务器注释以检查该名称：

public Response uploadFile( @FormDataParam("file") InputStream uploadedInputStream, 
                            @FormDataParam("blob") FormDataContentDisposition fileDetail,
                            @FormDataParam("info") GuiCreateResponse info)