文件上传是网站开发必不可少的，常见的有图片上传。但是大文件和视频上传不常见。这里我将自己写的视频上传demo贴出来供大家参考：
利用是最新的WebUploader插件请 下载使用最新版即可
js代码
[javascript] view plain copy
print?
1._extensions ='3gp,mp4,rmvb,mov,avi,m4v';
2._mimeTypes ='video/*,audio/*,application/*';
3.
4.$(function(){
5.var chunkSize = 500 * 1024; //分块大小
6.var uniqueFileName = null; //文件唯一标识符
7.var md5Mark = null;
8.
9.// var _backEndUrl = '';
10.
11.ister({
12."before-send-file": "beforeSendFile"
13., "before-send": "beforeSend"
14., "after-send-file": "afterSendFile"
15.}, {
16.beforeSendFile: function(file){
17.console.log(file);
18.//秒传验证
19.var task = new $.Deferred();
20.var start = new Date().getTime();
21.(new WebUploader.Uploader()).md5File(file, 0, 10*1024*1024).progress(function(percentage){
22.}).then(function(val){
23.
24.md5Mark = val;
25._userInfo.md5 = val;
26.
27.$.ajax({
28.type: "POST",
29.url: _backEndUrl,
30.data: {
31.status: "md5Check",
32.md5: val
33.},
34.cache: false,
35.timeout: 1000, //todo 超时的话，只能认为该文件不曾上传过
36.dataType: "json"
37.}).then(function(data, textStatus, jqXHR){
38.
39.if(data.ifExist){ //若存在，这返回失败给WebUploader，表明该文件不需要上传
40.ject();
41.
42.uploader.skipFile(file);
43.file.path = data.path;
44.UploadComlate(file);
45.}else{
46.solve();
47.//拿到上传文件的唯一名称，用于断点续传
48.uniqueFileName = md5(_userInfo.openid+_userInfo.time);
49.}
50.}, function(jqXHR, textStatus, errorThrown){ //任何形式的验证失败，都触发重新上传
51.solve();
52.//拿到上传文件的唯一名称，用于断点续传
53.uniqueFileName = md5(_userInfo.openid+_userInfo.time);
54.});
55.});
56.return $.when(task);
57.}
58., beforeSend: function(block){
59.//分片验证是否已传过，用于断点续传
60.var task = new $.Deferred();
61.$.ajax({
62.type: "POST"
63., url: _backEndUrl
64., data: {
65.status: "chunkCheck"
66., name: uniqueFileName
67., chunkIndex: block.chunk
68., size:&d - block.start
69.}
70., cache: false
71., timeout: 1000 //todo 超时的话，只能认为该分片未上传过
72., dataType: "json"
73.}).then(function(data, textStatus, jqXHR){
74.if(data.ifExist){ //若存在，返回失败给WebUploader，表明该分块不需要上传
75.ject();
76.}else{
77.solve();
78.}
79.}, function(jqXHR, textStatus, errorThrown){ //任何形式的验证失败，都触发重新上传
80.solve();
81.});
82.
83.return $.when(task);
84.}
85., afterSendFile: function(file){
86.var chunksTotal = 0;
87.if((chunksTotal =&il(file.size/chunkSize)) > 1){
88.//合并请求
89.var task = new $.Deferred();
90.$.ajax({
91.type: "POST"
92., url: _backEndUrl
93., data: {
大文件发送94.status: "chunksMerge"
95., name: uniqueFileName
96., chunks: chunksTotal
97., ext:&
98., md5: md5Mark
99.}
100., cache: false
101., dataType: "json"
发布评论