webuploader解决不能重复上传问题及一些常见问题处理
uploader = WebUploader.create({
    swf: 'resources/js/webuploader-0.1.5/Uploader.swf',
    // 文件接收服务端。
    server: settings.url,
    // 选择文件的按钮。可选。
    // 内部根据当前运行是创建,可能是input元素,也可能是flash。
    pick : '#picker',
    // 不压缩image, 默认如果是jpeg,文件上传前会压缩一把再上传!
    resize : false
});
以上代码是不支持重复上传:根据查看webuploader文档里面有个duplicate属性,是可选的,true为可重复,false为不可重复,默认为undifind,也是不可重复。所以只需在属性的后面追加 duplicate:true 就可以实现重复上传。
uploader = WebUploader.create({
    swf: 'resources/js/webuploader-0.1.5/Uploader.swf',
    // 文件接收服务端。
    server: settings.url,
    // 选择文件的按钮。可选。
    // 内部根据当前运行是创建,可能是input元素,也可能是flash.
    pick : '#picker',
    // 不压缩image, 默认如果是jpeg,文件上传前会压缩一把再上传!
    resize : false,
    //可重复上传
    duplicate :true
});  
文件上传控件:webuploader + jQuery,开源而且好用。但是在使用过程中出现一些问题:
1、上传多张图片,图片的顺序会乱掉。解决方法:threads:1
2、文件没有按照原来比例上传,1M多的文件会被压缩,解决方法:compress: false
3、选择文件的时候浏览器反应迟钝,解决方法:
accept: {
       title: 'Images',
       extensions: "gif,jpg,jpeg,png",
       mimeTypes: ".gif,.jpg,.jpeg,.png"
}
4、ie浏览器,上传文件失败,有可能是"swf"定义的文件路径不对。ie浏览器是用flash模式上传文件的。
var fileCount=;
var fileSize=;
var uploader;
var errorarr=new Array();
function initFile(){
uploader = WebUploader.create({
auto: true,
// swf文件路径
swf : '/ueditor/third-party/webuploader/Uploader.swf',
// 文件接收服务端。
server : "upFiles.do",
// 选择文件的按钮。可选。
// 内部根据当前运行是创建,可能是input元素,也可能是flash.
pick : '#filePicker',
// 不压缩image, 默认如果是jpeg,文件上传前会压缩一把再上传!
//resize : false,//这个不起作用,要用compress
compress: false,//webuploader默认压缩图片,设置compress:false,可以按照原始比例上传图片
accept: {
title: 'Images',
extensions: "gif,jpg,jpeg,png",
mimeTypes: ".gif,.jpg,.jpeg,.png"//解决WebUploader在谷歌浏览器中反应缓慢迟钝,虽然解决了问题,但是火狐浏览器,选择文件的时候不做限制了 },
fileVal:"upfile",//设置文件上传域的name。
fileSizeLimit: * * ,//所有文件上传的大小限制,单位字节
fileSingleSizeLimit: * * ,//单张图片上传限制大小,单位字节
fileNumLimit:,//文件上传数量限制
threads://上传并发数。允许同时最大上传进程数,为了保证文件上传顺序
});
/*当文件被加入队列以后触发。
@param file File对象
@param ret 服务器返回的数据
*/
uploader.on('uploadSuccess', function (file, ret) {
var $file = $('#' + file.id);
try {
if (ret.state == 'SUCCESS') {
var json={};
json.dataid=ret.picId;
json.src=ret.url;
json.width=ret.width;
json.height=ret.height;
if(!putPicMap(json)){//加入图片列表
return false;
}
}else {
//console.log("faile","aa");
}
} catch (e) {
//console.log("faile","bb");
}
});
/**
*文件上传失败
*code=F_DUPLICATE 上传文件重复
**/
uploader.on('error', function (code, file) {
var name=file.name;
var str="";
switch(code){
case "F_DUPLICATE":
str=name+"文件重复";
errorarr.push(str);
break;
case "Q_TYPE_DENIED":
str=name+"文件类型 不允许";
errorarr.push(str);
break;
case "F_EXCEED_SIZE":
var imageMaxSize = ;//通过计算
str=name+"文件大小超出限制"+imageMaxSize+"M";
errorarr.push(str);
break;
case "Q_EXCEED_SIZE_LIMIT":
errorarr.push("超出空间文件大小");
break;
case "Q_EXCEED_NUM_LIMIT":
errorarr.push("抱歉,超过每次上传数量图片限制");
default:
str=name+" Error:"+code;
}
});
uploader.on( 'all', function( type, arg1, arg2 ) {
if(type=="startUpload"){//开始上传
uploadchange();
}else if(type=="uploadFinished"){//上传结束
if(errorarr.length>){
alert(errorarr.join("\n"));
}
//清空错误信息
errorarr.length=;
}
});
}
/**
* 本地上传图片,改变上传的相册,文件上传的路径也会改变
*/
function uploadchange(){
//这里可以限制文件上传个数,未做
/* 添加额外的GET参数 */
uploader.option('server', "upFiles.do?aa=3");
}
webuploader解决不能重复上传问题及一些常见问题处理的更多相关文章
- Vue2.0结合webuploader实现文件分片上传
		
Vue项目中遇到了大文件分片上传的问题,之前用过webuploader,索性就把Vue2.0与webuploader结合起来使用,封装了一个vue的上传组件,使用起来也比较舒爽. 上传就上传吧,为什么 ...
 - 解决Web Uploader上传文件和图片 延迟和not defined
		
1.出现list not define时,var $list = $("#fileList"); 2.选择文件框有延迟,可能是因为选择文件类型过多 mimeTypes: 'imag ...
 - 使用WebUploader实现文件批量上传,进度条显示功能
		
知识点:利用WebUploader,实现文件批量上传,并且实时显示文件的上传进度 参考官方文档:http://fex.baidu.com/webuploader/ (1)引入三个资源 JS,CSS,S ...
 - 使用WebUploader进行文件图片上传
		
官方文档:http://fex.baidu.com/webuploader/getting-started.html 引入Webuploader的css和js文件,下载地址:http://fex.ba ...
 - 微信JSSDK多图片上传并且解决IOS系统上传一直加载的问题
		
微信多图片上传必须挨个上传,也就是不能并行,得串行: 那么我们可以定义一个如下所示的上传函数: var serverIds = []; function uploadImages(localImage ...
 - Webuploader 大文件分片上传
		
百度Webuploader 大文件分片上传(.net接收) 前阵子要做个大文件上传的功能,找来找去发现Webuploader还不错,关于她的介绍我就不再赘述. 动手前,在园子里找到了一篇不错的分片 ...
 - 解决WordPress无法上传媒体文件以及无法下载和安装主题与插件的问题
		
前言: 我的个人博客网站荒原之梦在安装成功WordPress之后本来是可以上传媒体文件,安装主题和插件的,但是后来不知道怎么回事就出了问题:不能上传媒体文件也不能安装主题和插件了.出现这个问题后我尝试 ...
 - [转]通过设置nginx的client_max_body_size解决nginx+php上传大文件的问题
		
转:http://blog.csdn.net/zhengwish/article/details/51602059 通过设置nginx的client_max_body_size解决nginx+php上 ...
 - 通过设置nginx的client_max_body_size解决nginx+php上传大文件的问题
		
通过设置nginx的client_max_body_size解决nginx+php上传大文件的问题:用nginx来做webserver的时,上传大文件时需要特别注意client_max_body_si ...
 
随机推荐
- CentOS 7安装Mysql并设置开机自启动的方法
			
CentOS 7不带Mysql数据库了,默认的数据库是MariaDB(Mysql的一个分支). 可以按照以下步骤手动安装Mysql数据库. 1. 下载rpm安装文件 ? 1 wget http://r ...
 - QString 乱谈(3)-Qt5与中文
			
原文请看:http://blog.csdn.net/dbzhang800/article/details/7542672 两个月前,简单写过QTextCodec中的setCodecForTr等终于消失 ...
 - HDU 5707 Combine String(动态规划)
			
题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=5707 题意: 给你三个字符串 S1, S2, S3, 让你判断 S3 是否恰好由字符串 S1 和 S2 ...
 - 洛谷P2471 [SCOI2007] 降雨量 [RMQ,模拟]
			
题目传送门 降雨量 题目背景 07四川省选 题目描述 我们常常会说这样的话:“X年是自Y年以来降雨量最多的”.它的含义是X年的降雨量不超过Y年,且对于任意Y<Z<X,Z年的降雨量严格小于X ...
 - Python 脚本编程及国际化
			
在前一篇博客文章 <使用 Python 编写脚本并发布> 中,我介绍了如何使用 Python 进行脚本编程,说实话这是我在尝试 Python 进行网站和网络编程之后首次使用 Python ...
 - [BZOJ3203][SDOI2013]保护出题人(凸包+三分)
			
https://www.cnblogs.com/Skyminer/p/6435544.html 先不要急于转化成几何模型,先把式子化到底再对应到几何图形中去. #include<cstdio&g ...
 - 莫队p2 【bzoj3809】Gty的二逼妹子序列
			
发现一篇已经够长了...所以就放在这里吧... http://hzwer.com/5749.html ↑依然是看大牛题解过的 袜子那道题太简单了.... 然后被这道题超时卡了一段时间....... ...
 - python开发_glob
			
''' 在python中,glob模块是用来查找匹配的文件的 在查找的条件中,需要用到Unix shell中的匹配规则: * : 匹配所所有 ? : 匹配一个字符 *.* : 匹配如:[hello.t ...
 - zoj 1610 Count the Colors 线段树区间更新/暴力
			
Count the Colors Time Limit: 1 Sec Memory Limit: 256 MB 题目连接 http://acm.zju.edu.cn/onlinejudge/show ...
 - 几种OutOfMemoryError
			
JAVA虚拟机OutOfMemoryError主要包括以下四类:java.lang.OutOfMemoryError: Java heap spacejava.lang.OutOfMemoryErro ...