Question

我正在编写Web应用程序，其中前端将在html，backbone.js和后端在jersey上编写。我的html表单中有许多图像上传（输入类型=“文件”）和文本数据（输入类型=“文本”）。我必须在一个请求中将所有这些（图像和纯文本/文本）上传到Jersey服务器。

我读到只有将图像转换为Base64格式时，我才能在一个请求中将带有文本数据的图像发送到服务器。

是否可以将通过html表格上传的图像转换为base64格式，然后将所有数据发送到泽西？

提前感谢：）

Answer 1

我对泽西没有任何经验，但我知道这可以与其他后端一起使用。在此示例中，您的模型会将file_name和file_data发布到服务器图像数据。您需要在后端解码图像。下面的前端代码正在利用FileReader API。它不适用于IE＆lt; 10。

var model = Backbone.Model.extend({
  readFile : function (file, callback) {
    var reader = new FileReader();
    reader.onload = (function (theFile, self) {
      return function (e) {
        self.set({file_name: theFile.name, file_data : e.target.result});
        _.isUndefined(callback) ? null : callback();
      };
    })(file, this);

    reader.readAsDataURL(file);
  }
});

var view = Backbone.View({
  //...
  onRender : function () {
    var self = this,
      fileChangeHandler = function (e) {
      var callback = function () {
        self.model.save({}, {});
      };
      var file = e.originalEvent.target.files[0];
      self.model.readFile(file, callback);
    };
    self.$("input[type='file']").change(fileChangeHandler);
  }
});

Answer 2

您是否只是将表格中的多个文字和图片发布到球衣上？

html代码：

<form action="rest/test" method="post" enctype="multipart/form-data">
    <input type="text" name="text1" /> <br />
    <input type="file" name="file1" /> <br />
    <input type="text" name="text2" /> <br />
    <input type="file" name="file2" /> <br />
    <input type="submit" value="Submit" />
</form>

球衣代码：

@Path("/test")
public class TestResource {

    public TestResource() {
    }

    @POST
    @Consumes("multipart/form-data")
    public Response create(
            @FormDataParam("text1") String text1,
            @FormDataParam("file1") InputStream file1,
            @FormDataParam("text2") String text2,
            @FormDataParam("file2") InputStream file2) {

        //get your data

        return Response.ok().build();
    }
}

上传图片，转换为base64并发送至jersey

2 个答案: