webUploader上传控件 大文件分片上传后生成唯一文件名另辟蹊径的解决方法

webuploader

webUploader是什么？

WebUploader是由Baidu WebFE(FEX)团队开发的一个简单的以HTML5为主，FLASH为辅的现代文件上传组件。在现代的浏览器里面能充分发挥HTML5的优势，同时又不摒弃主流IE浏览器，沿用原来的FLASH运行时，兼容IE6+，iOS 6+, android 4+。两套运行时，同样的调用方式，可供用户任意选用。采用大文件分片并发上传，极大的提高了文件上传效率。

怎么样使用webUploader上传文件大家可以去官方看demo和手册(http://fex.baidu.com/webuploader/)

这篇文章主要解决大文件分片上传和分片后生成唯一文件名的方法

什么是分片上传？

分片就是将一个大文件分割成多块上传，最后在服务器端合并成一个文件。

为什么要分片？

这里以PHP环境为例，Apache单个上传文件大小是有限制的，也就是说超过这个限制就上传不上去了，你也可以修改这个大小，但是结果就是浏览器假死，处于长时间上传的状态。这就需要把大文件切割成一小块一小块的上传了。

webUploader 分片上传时 服务器上的临时文件夹会生成类似下面的分片文件123.pdf_0.parttmp123.pdf_1.parttmp123.pdf_2.parttmp

最后合并成123.pdf

为什么要生成唯一文件名

假设A用户和B用户都上传了一个123.pdf的图片，那么前面一个用户上传的就会被后面一个用户上传的覆盖掉。

好，那么重点来 大文件切成多个文件上传后如果服务单每次都生成唯一的不同文件名，最后合并的成一个文件名时就不好合并了，这时你分不清那几个是分片文件可以最终合并成一个文件

这里给出最简单的解决方案：

就是在选择添加文件时就给文件设置唯一的文件名，服务端就不用生成唯一文件名就认这个文件名就行了

webUploader有个addFile接口 在这里重命名就行了

具体代码：

uploader.addFile = function (file) {

filename = file.name;

file.orgname=filename;

var index1 = filename.lastIndexOf(".");

var index2 = filename.length;

var ext = filename.substring(index1, index2);//后缀名

file.name = WebUploader.guid() + ext;

};