Java in the use of Webuploader plug-ins to upload large file documents and multiple files method summary _java

I. Reasons for using the Webuploader plug-in

The project which was now done pits.

Let's talk about my project architecture Spring+struts2+mybatis+mysql

And then what. Previously agreed to upload in accordance with 2G can be, as a result, using the Ajaxfileupload plug-ins, because the image upload is used before, so upload the attachment when it is used directly

A variety of code codes, testing has also been tested, 2G file upload no problem, the pit came, the project on the line, the customer also asked to upload 4G files, and even 20G above. Nani, you didn't say that before.

In the IE11 under the Ajaxfileupload.js plug-in upload more than 4G files, ie directly throw an exception. A message pops up with more than 32 digits of arithmetic results.
The following figure:

Plus, my system is 64-bit, 8G RAM, and Google browsers and IE11 browsers are 32-bit. Google Ajaxfileupload upload 8G with the problem. Will not have an error.

IE11 more than 4G Direct report on the map this is wrong. No way. Replace the plugin.

Two. Plug-in selection

1.stream Upload plugin. Stream is to solve different browser upload file Plug-ins, is uploadify Flash version and HTML5 combination. Plugin address http://www.twinkling.cn/

The feature is really powerful, but the CSS style is fixed to death, and my current project's progress bar style is very different. Or did you give up this plugin?

2.Webuploader plugin. Webuploader was developed by the Baidu Webfe (FEX) team, a simple HTML5-oriented, flash supplemented by a modern file upload component. In the modern browser can give full play to the advantages of HTML5, while not abandoning mainstream IE browser, the original flash run, compatible with Ie6+,ios 6+, Android 4+. Two sets of operation, the same way of invocation, can be optional for users.

The use of large file fragmentation concurrent upload, greatly improve the efficiency of file upload. Plugin address http://fex.baidu.com/webuploader/
This plugin can customize CSS style. function is also very powerful, so decisively adopt this plug-in.

Three. Webuploader Single File Upload

I use the Webuploader0.1.5 version of the Webuploader is mainly to the large file in the client, such as in accordance with every 5 m to send a fragment request, the background to receive files to merge files. Two ways to merge files, the first and all of the fragments are uploaded to the background, and then in the merger, this to ensure that the slice sequence is correct, the second is the edge of the fragment edge merge. I use the second type in the project. Use Web Uploader file upload need to introduce three kinds of resources: JS, CSS, SWF.

1. Introduction of JS File

<script type= "Text/javascript" src= ". /main/js/webuploader.js "></script>
<script type=" Text/javascript "src=". /main/js/webuploader.min.js "></script>

2. Introducing CSS Styles

<link href= ". /main/css/webuploader.css "rel=" stylesheet "type=" Text/css "/>"

3. The introduction of SwF, SWF is not directly referenced, in Webuploader initialization when the path of the SWF can be specified.

4.upload3.html

<! DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 transitional//en" "Http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd ">  

The picture is simpler and looks like this.

5.upload3.js

Contains single file uploads, multiple file uploads, and Webuploader multiple instances

/*********************************webupload Single File upload begin*****************************************/$ (function () {
var $list = $ ("#thelist"); var uploader//instantiated uploader = webuploader.create ({auto:false,//whether automatically uploaded pick: {id: ' #attach ', Name: ' File ',//the place Nam e no use, although open the debugger, the name of the input is indeed changed over. However, the file cannot be submitted to the background.
If you want to customize the Name property of file, use it with Fileval. Label: ' Click to select Picture ', Multiple:false//default is True, you can select more}, SWF: '. /..
/main/js/uploader.swf ',//fileval: ' multifile ',//Custom file Name property, I use the version is 0.1.5, open the client debugger found the generated input of the name did not change. The name is still the default file, but it's not useless.
Although the client name has not changed, but submitted to the background, is to use multifile this object to fetch files, with file is not to get the document///suggest that the author has time to change this place, the dead. Server: "Contentsdetail!ajaxattachupload.action", duplicate:true,//whether the same file Resize:false can be repeatedly selected, FormData: {"Status": "
File "," Contentsdto.contentsid ":" 0000004730 "," Uploadnum ":" 0000004730 "," EXISTFLG ": ' false '}, compress:null,//picture not compressed Chunked:true,//Fragment processing Chunksize:5 * 1024 * 1024,//5M chunkretry:false,//per piece if failed, threads:1,//upload concurrency number is not retried.
Allows the maximum number of simultaneous upload processes. Runtimeorder: ' Flash ',//Prohibit the overall drag and drop function. 
This does not appear when the picture dragged into the page, the picture open. 
Disableglobaldnd:true});
When a file is added Uploader.on ("filequeued", function (file) {Console.log ("filequeued:"); $list. Append ("<div id=" "+ file.id +" ' class= ' item ' > "+" 
 

6.contentsdetail.action

Single File upload background code public
void Ajaxattachupload () {
String path = ' d:\\test\\ ' +filefilename;
try {
File File = This.getfile ();
Fileutil.randomaccessfile (path, file);
If the file is small and 5M, the value of the fragment parameter chunk is null if
(Stringutils.isempty (chunk)) {
Outjson ("0", "Success", "");
} else{
//chunk Fragment index, subscript starting from 0
//chunks Total fragment
if (integer.valueof (chunk) = = (Integer.valueof (chunks)-1)) { C14/>outjson ("0", "Upload succeeded", "");
} else {
Outjson ("2", "upload" + filefilename + "chunk:" + chunk, "");}}}
catch (Exception e) {
Outjson ("3", "Upload Failed", "");
}

Fileutil.java

/**
* Specify location to start writing
to file * @param tempfile input File
* @param the path (path + filename) of the Outpath output file
* @throws ioexception
*/< C6/>public static void Randomaccessfile (String outpath,file tempfile) throws ioexception{randomaccessfile rafile
= null;
Bufferedinputstream Inputstream=null;
try{
File Dirfile = new file (Outpath);
Open the target file in read-write mode
rafile = new Randomaccessfile (dirfile, rw); 
Rafile.seek (Rafile.length ());
InputStream = new Bufferedinputstream (new FileInputStream (Tempfile));
byte[] buf = new byte[1024];
int length = 0;
while (length = Inputstream.read (BUF))!=-1) {
rafile.write (buf, 0, length);
}
} catch (Exception e) {
throw new IOException (E.getmessage ());
} finally{
try {
if (InputStream!= null) {
inputstream.close ();
}
if (rafile!= null) {
rafile.close ();
}
} catch (Exception e) {
throw new IOException (E.getmessage ());}}}

7. Effect Drawing

The above is a small set of Java in the introduction of the use of Webuploader plug-ins to upload large file documents and multiple files of the method summary of the relevant knowledge, hope to help everyone, if you have any questions please give me a message, small series will promptly reply to everyone. Here also thank you very much for the cloud Habitat Community website support!