Spring MVC + xmlHttpRequest2.0 implements no flush upload file with progress bar and time remaining

1, SPRINGMVC support file upload, you need to add the following paragraph in the Spring-mvc.xml configuration file:

<!--support uploading files--      

2, the following introduction of the next XMLHttpRequest2.0

At first, Microsoft introduced this interface in IE 5. Because it is too useful, other browsers mimic the deployment, and Ajax operations are thus born.

However, this interface has not been standardized, the implementation of each browser is more or less a little different. After the concept of HTML 5 was formed, the consortium began to consider standardizing the interface. A draft of XMLHttpRequest Level 2 was proposed in February 2008.

This new version of XMLHttpRequest, which presents a number of useful new features, will greatly contribute to internet innovation. This article gives a detailed introduction to this new version.

The old version of the XMLHttpRequest object has several drawbacks:

* Only text data transfer is supported and cannot be used to read and upload binary files.

* When transmitting and receiving data, there is no progress information and can only prompt for completion.

* Subject to "Same domain Restrictions" (same Origin Policy), data can only be requested from servers of the same domain name

The new version of the XMLHttpRequest object, for the shortcomings of the old version, made a significant improvement:

* You can set the time limit for HTTP requests.

* You can use the Formdata object to manage form data.

* Can upload files.

* You can request data under different domain names (cross-domain requests).

* Server-side binary data can be obtained.

* The progress information of the data transfer can be obtained.

The new XMLHttpRequest object can not only send text messages, but also upload files. Assume that files is a form element (input[type= "file") that "selects Files", and we load it into the Formdata object.

var formData = new FormData (); for (var i = 0; i < files.length;i++) {formdata.append (' files[] ', files[i]);}

Then, send this Formdata object

Xhr.send (FormData);

3. Code implementation

Nonsense not much to say, on the code:

Front page code:

<! DOCTYPE html>
Back-end Java code:
@RequestMapping (value = "/uploadfile", method = requestmethod.post) public void upload (@RequestParam (value = "MyFile", Required = true) Multipartfile file, HttpServletRequest request,httpservletresponse response) {String Path = Request.getsession (). Getservletcontext (). Getrealpath ("UploadFile"); String fileName = File.getoriginalfilename (); System.out.println ("File Upload path:" + path); File TargetFile = new file (path, fileName), if (!targetfile.exists ()) {targetfile.mkdirs ();} Save Try{file.transferto (targetfile);} catch (Exception e) {e.printstacktrace ();}}
　　
　　
Spring MVC + xmlHttpRequest2.0 implements no flush upload file with progress bar and time remaining