上传图片时 Dropzone js 发送空 POST 请求（显然）

Question

我正在尝试使用 Dropzone js 为用户表单上传多张带预览的图像。我已经使用 jsp servlet 实现了它。但是我无法在服务器端获取图像。当在 dropzone 组件上选择图像但 HttpServletequest 请求不包含图像数据（显然）时，将调用服务器端的 doPost 方法。可能是我读取的请求数据有误或其他问题。请帮忙。我正在使用 Netbeans 8.0.2、Wildfly 8.2 final、jdk 1.8。这是我的 html 页面的代码：

Dropzone.options.imagedropform = {
  paramName: 'file',
  addRemoveLinks: true,
  maxFilesize: 10, // MB
  maxFiles: 5
  };

<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <title>Image upload</title>
        <script src="${pageContext.request.contextPath}/imageuploadresources/customdropzone.js" type="text/javascript"></script>
        <script src="${pageContext.request.contextPath}/imageuploadresources/dropzone.js"></script>
        <link rel="stylesheet" href="${pageContext.request.contextPath}/imageuploadresources/dropzone.css">
    </head>
    <body>
        <form id="imagedropform" action="Upload" class="dropzone">
            <div class="dz-message">
                Drop files here or click to upload.
            </div>
        </form>
    </body>
</html>

这是我在 this tutorial:

之后的上传 servlet

@WebServlet("/Upload")
public class Upload extends HttpServlet {

@Override
protected void doPost(HttpServletRequest request, HttpServletResponse response)
        throws ServletException, IOException {
    PrintWriter out = response.getWriter();

    if (!ServletFileUpload.isMultipartContent(request)) {
        throw new IllegalArgumentException("Request is not multipart, please 'multipart/form-data' enctype for your form.");
    }

    ServletFileUpload uploadHandler = new ServletFileUpload(new DiskFileItemFactory());

    fileWriter.println(new File(request.getServletContext().getRealPath("/") + "/images/"));
    try {
        List<FileItem> items = uploadHandler.parseRequest(request);
        fileWriter.println(items.toString());

        for (FileItem item : items) {
            fileWriter.println(item.toString()+"===="+item.getName());
            if (!item.isFormField()) {
                File file = new File(request.getServletContext().getRealPath("/") + "/images/", item.getName());
                item.write(file);

                System.out.println("uploaded");
            }
        }
    } catch (FileUploadException e) {
        throw new RuntimeException(e);
    } catch (Exception e) {
        throw new RuntimeException(e);
    } finally {
        fileWriter.close();
        out.close();
    }
}

}
}

我上传视图的一些截图 initial output

如果可以使用 JSF（没有 Spring）的某些解决方案，也请给我建议。或其他一些易于使用的漂亮插件，用于使用 JSF 2.2（除了 primefaces 或其他一些面孔）上传多张图片。谢谢

Answer 1

经过一番搜索，我已经解决了。事实上，我错误地阅读了 POST 请求数据。这是使用 MultipartParser and example from this link

读取多个文件上传请求的正确方法

import com.oreilly.servlet.multipart.FilePart;
import com.oreilly.servlet.multipart.MultipartParser;
import com.oreilly.servlet.multipart.ParamPart;
import com.oreilly.servlet.multipart.Part;
// and other required classess
@Override
protected void doPost(HttpServletRequest request, HttpServletResponse response)
        throws ServletException, IOException {

    if (!ServletFileUpload.isMultipartContent(request)) {
        throw new IllegalArgumentException("Request is not multipart, please 'multipart/form-data' enctype for your form.");
    }

    MultipartParser mp = new MultipartParser(request, 10*1024*1024); //10MB
    Part part;
    while ((part = mp.readNextPart()) != null) {
    String name = part.getName();
    if (part.isParam()) {
      // it's a parameter part
      ParamPart paramPart = (ParamPart) part;
      String value = paramPart.getStringValue();
      fileWriter.println("param; name=" + name + ", value=" + value);
    }
    else if (part.isFile()) {
      // it's a file part
      FilePart filePart = (FilePart) part;
      String fileName = filePart.getFileName();
      if (fileName != null) {
        // the part actually contained a file
        long size = filePart.writeTo(new File("/path to save directory"+filePart.getFileName()));
        System.out.println("file; name=" + name + "; filename=" + fileName +
          ", filePath=" + filePart.getFilePath() + 
          ", content type=" + filePart.getContentType() + 
          ", size=" + size);
      }
      else { 
        // the field did not contain a file
        System.out.println("file; name=" + name + "; EMPTY");
      }
    }
  }
}

上传图片时 Dropzone js 发送空 POST 请求（显然）

Dropzon js sending empty POST Request (apparently) when images uploaded

java

jsp

dropzone.js