2

我正在尝试使用 HTML5 多文件输入将多个图像文件存储到 GAE Blobstore。

由于摄影师将使用我的 Web 应用程序批量上传照片,因此在客户端的浏览器上启用多个文件选择绝对至关重要(一次上传 200 多张照片会很痛苦)

客户端 HTML 如下所示:

   <form action = "/upload" method="post" enctype="multipart/form-data">
     <input type="file" name="myFiles[]" multiple="true"/>
     <input type="submit"/>
   </form>

在服务器端,将使用 Java HttpServlet 来存储照片组:

public class PhotoUploadServlet extends HttpServlet {

  @Override
  protected void doPost(HttpServletRequest req, HttpServletResponse resp)
      throws ServletException, IOException {
      //Upload each photo of myFiles[] in sequence to the GAE Blobstore
  }

我计划使用此处说明的过程单独存储每张照片。

问题:我不知道如何从 HttpServletRequest 的 myFiles[] 参数中单独提取每个图像。

有人可以解释一下如何将 myFiles[] 参数解释为可以轻松按顺序使用的东西,例如List<SomeImageType>. 然后我可以轻松地将每张照片List<SomeImageType>单独保存到 Blobstore!

提前致谢!

PS:我已经看过这篇文章,但是由于我不懂 Python,所以我对 Nick Johnson 的博客文章中提出的解决方案有点迷茫。

4

1 回答 1

3

在 servlet 中,您可以通过以下方式获取 blob:

Map<String, BlobKey> blobs = blobstoreService.getUploadedBlobs(req);

但是您需要一个小技巧来更改文件的名称,否则 blobs 字段将只包含一个键:

<script type="text/javascript">
   function uploadFile() {
     if (window.File && window.FileList) {
      var fd = new FormData();
      var files = document.getElementById('fileToUpload').files;
      for (var i = 0; i < files.length; i++) {  
        fd.append("file"+i, files[i]);
      }
      var xhr = new XMLHttpRequest();
      xhr.open("POST", document.getElementById('uploadForm').action);
      xhr.send(fd);
    } else {
      document.getElementById('uploadForm').submit();   //no html5
    }
}
</script>

<form id="uploadForm" enctype="multipart/form-data" method="post"
        action=<%=blobstoreService.createUploadUrl("/upload") %>">
   <input type="file" name="fileToUpload" id="fileToUpload" multiple />
   <input type="button" onclick="uploadFile();" value="Upload" />
</form>

这是 GAE 问题:http ://code.google.com/p/googleappengine/issues/detail?id=3351

于 2011-11-24T10:25:52.037 回答