Question

初学者警惕....

这可能看起来像一个非常奇怪的问题....但我一直在研究如何使用Spring MVC框架进行文件上传。

我发现了很多使用apache common-io依赖的例子。 https://commons.apache.org/proper/commons-fileupload/using.html

因为我正在进一步研究实现progressListener。我找到了这个.... http://howtodoinjava.com/spring/spring-mvc/spring-mvc-multi-file-upload-with-progress-bar/

现在，我一直认为进度条百分比是由服务器计算文件上传的程度。所以我认为我们需要在控制器中实现一个计算，它返回的内容就像传输的字节百分比......或写入目录的字节。

但是从第二个链接示例来看，似乎Spring控制器不执行任何计算只是将文件写入目标。

所以问题是......

文件传输实际上是如何工作的...我只能从示例中假设Spring控制器等到它在写入服务器目录之前收到完整文件？这就是为什么要显示进度条，我们使用javascript来计算已将多少文件传输到服务器但未写入？
在理解javascript时需要一些帮助。

它调用onUploadProgress方法，但不传递任何参数

xhr.upload.addEventListener("progress", onUploadProgress, false);

但是如果你看一下onUploadProgress方法，它需要一个参数（e）这个e是什么？

function onUploadProgress(e) {
    if (e.lengthComputable) {
        var percentComplete = parseInt((e.loaded + totalUploaded) * 100 / totalFileLength);
        var bar = document.getElementById('bar');
        bar.style.width = percentComplete + '%';
        bar.innerHTML = percentComplete + ' % complete';
    } else {
        debug('unable to compute');
    }
}

非常感谢帮助我倾斜

Answer 1

当您在表单中定义enctype：“multipart / form-data”时，服务器端的MutlipartResolver将解析多部分请求。

<bean id="multipartResolver"
class="org.springframework.web.multipart.commons.CommonsMultipartResolver">
  <property name="defaultEncoding"><value>utf-8</value></property>
</bean>

Js方法：

function uploadFile(thisVar,fileName){ 

        var msg='',params="fileName="+fileName;

        var fileContent = new FormData();
        fileContent.append(fileName,thisVar.files[0]);

        $.ajax({
            type: "POST",
            enctype:"multipart/form-data",
            url: "addCoupons?"+params,
            data: fileContent,
            processData: false,
            contentType: false,
            beforeSend: function() { 
                $(thisVar).parent().toggleClass('fa-upload fa-refresh fa-spin');//.click('false');
            },
            complete:function(){ 
                $(thisVar).parent().toggleClass('fa-upload fa-refresh fa-spin');//.click('true');
            }
        }).done(function(responseText) { 
            //alert('on success '+responseText);

        }).fail(function(){ 
          alert("Error");
       });
    }

在控制器上：

 @RequestMapping(value="/addCoupons")
 public  @ResponseBody String insertData(MultipartHttpServletRequest request) //@RequestParam("file") MultipartFile file
       {

                CommonsMultipartFile file = (CommonsMultipartFile) 
                      request.getFile(request.getParameter("fileName"));
        }

Spring MVC fileupload，通常是进度条是由Javascript完成的吗？

1 个答案: