webuploader 获取文件md5_webuploader 上传文件参数设置

webUploader 是款很好用的优秀的开源上传组件，由百度公司开发，详细的介绍可参见webUploader 的官方文档：

最近在使用webUploader时，需要添加额外的参数，并在后台获取，参数的格式是json，刚开始一直设置不对，在参考了官网的api文档及相关热心网友的回答后，终于弄明白了webUploader 上传参数的设置。设置的方法一般是在uploader 对象创建后的 fileQueued  或 uploadBeforeSend 事件 中设置 ，也可以对webUploader 对象的属性 formData 进行直接 设置。

具体如下 ：

uploader = WebUploader.create({

auto: false,

// swf文件路径

swf: '/Scripts/webUploader/Uploader.swf',

// 文件接收服务端。

server: '@Url.Action("Upload", "Home")',

// 选择文件的按钮。可选。

// 内部根据当前运行是创建，可能是input元素，也可能是flash.

pick: '#myPicker',

// formData: { "name": name, "desc": desc},

prepareNextFile:true,

chunked: true, // 分片上传大文件

chunkRetry: 10, // 如果某个分片由于网络问题出错，允许自动重传多少次？

thread: 100,// 最大上传并发数

method: 'POST',

fileSizeLimit: 1024,

// 只允许选择图片文件。

accept: {

title: 'HTML5组态文件',

extensions: 'gif,jpg,jpeg,bmp,png',

mimeTypes: 'img/*'

}

});

5

6

7

8

9

10

11

12

13

//当文件被加入队列之前触发

uploader.on('beforeFileQueued', function (file) {

//如果是单文件上传，把旧的文件地址传过去

if (!p.multiple) {

if (p.sendurl.indexOf("action=itemcode") > 0) {

if ($("#txtItemCode").val() == '') {

layer.msg('请先填写商品编码再上传图片！');

//layer.alert('请先填写商品编码再上传图片！');

return false;

}

data.formData= { "name": name, "desc": desc};

}

}

});

uploader.on('fileQueued', function (file) {

$("#listFile").append('

' +

'

' + file.name + '

' +

'

等待上传...

' +

'

');

});

uploader.on('uploadProgress', function (file, percentage) {

var li = $('#' + file.id),

percent = li.find('.progress .progress-bar');

// 避免重复创建

if (!percent.length) {

percent = $('

' +

'

' +

'

' +

'

').appendTo(li).find('.progress-bar');

}

li.find('p.state').text('上传中');

percent.css('width', percentage * 100 + '%');

});

uploader.on('uploadSuccess', function (file) {

$('#' + file.id).find('p.state').text('已上传');

});

uploader.on('uploadError', function (file) {

$('#' + file.id).find('p.state').text('上传出错');

});

uploader.on('uploadComplete', function (file) {

$('#' + file.id).find('.progress').fadeOut();

//$("#editModal").fadeOut(2000, window.location.reload());

//destory();

//$("#editModal").destory();

});

//当某个文件的分块在发送前触发，主要用来询问是否要添加附带参数，大文件在开起分片上传的前提下此事件可能会触发多次。

uploader.on('uploadBeforeSend', function (obj, data, headers) {

// data.DelFilePath = parentObj.siblings(".upload-path").val();

// data.ItemCode = $("#txtItemCode").val();

data.formData= { "name": name, "desc": desc};

});

uploader.on('all', function (type) {

if (type === 'startUpload') {

state = 'uploading';

} else if (type === 'stopUpload') {

state = 'paused';

} else if (type === 'uploadFinished') {

state = 'done';

}

if (state === 'uploading') {

$('#btnBeginUpload').text('暂停上传');

} else {

$('#btnBeginUpload').text('开始上传');

}

});

} else {

geap.alertPostMsgDefault("请选择一个文件!", "info");

}

});

// 点击上传事件

$('#btnSave').bind('click', function () {

var name = $("#txtName").val();

var id = $("#txtId").val();

if (!name || name.length == 0) {

alert("请填写名称");

return false;

}

var obj = new Object();

obj.name = name;

obj.id = id;

uploader.options.formData = obj;

// uploader.options.formData = { "name": name, "id": id, };

if (state === 'uploading') {

uploader.stop();

} else {

uploader.upload();

}

});