web uploader(上传控件 WebUploader 判断有没有上传成功)

本文目录
上传控件 WebUploader 判断有没有上传成功
该控件使用比较方便,但是准备做权限的时候确实让我头疼了。
默认如果啥也不处理,只要有返回数据就认为是成功,就算返回的是错误信息,也认为是成功了。
但是,在认为成功前会派送一个事件uploadAccept,这个事件是用来询问是否上传成功的。在这个事件中你可以拿到上传的是哪个文件,以及对应的服务端返回reponse。
//如:上传成功返回 {"success" :"1"} //如:上传失败返回 {"success" :"0"}
uploader.on("uploadAccept", function( file, data){ if (
data.success=="0") { // 通过return false来告诉组件,此文件上传有错。 return false; } });
response是个对象,如果服务器返回是json格式,那么正和你意,都已经解析好了,如果不是json格式,response._raw里面可以拿到原始数据。所以,webuploader对于后端返回的数据格式是没有要求的。
用webuploader怎么解决跨域上传文件的问题
跨域请求前浏览器会自动发出一个options请求,如果服务器的响应头部中有如下信息:
Access-Control-Allow-Origin: #允许访问的源,如ht localhost:3000
Access-Control-Allow-Methods: #允许的方法,如get, post
浏览器收到这个响应就会继续原来的请求,否则就会终止。
在webuploader中可以在uploadBeforeSend的回调中设置请求的头部,例如
uploader.on(’uploadBeforeSend’, function(obj, data, headers) {
_.extend(headers, {
"Origin": "h /localhost:3000",
"Access-Control-Request-Method": "POST"
});
});
在服务端的post响应中增加头部:Access-Control-Allow-Origin //localhost:3000
完整配置参考:
跨域请求的问题 · Issue #1265 · fex-team/webuploader · GitHub
还有相关讨论
麻烦讲一下跨域的相关配置,谢谢! · Issue #135 · fex-team/webuploader · GitHub
使用webuoploader遇到的几个问题
最近做公司官网的项目,其中有一个上传证件照的功能,其实就是上传图片的功能,小萌是使用百度的一款插件WebUploader来做的,为什么使用这个插件呢?其原因是:WebUploader是一个简单的以HTML5为主,FLASH为辅的现代文件上传组件。在现代的浏览器里面能充分发挥HTML5的优势,同时又不摒弃主流IE浏览器,沿用原来的FLASH运行时,兼容IE6+,iOS 6+, android 4+。两套运行时,同样的调用方式,可供用户任意选用。还有一点就是采用大文件分片并发上传,极大的提高了文件上传效率。基于这些优点,小萌选择了这款插件。
对于webuploader的使用方法,那么今天要介绍的是小萌在做官网项目的时候使用webuoploader遇到的几个问题。
问题一:WebUploader 某些浏览器如chrome,点击上传文件,选择框会延迟几秒才显示,反应很慢
一开始遇到这个问题的时候,小萌以为是因为网速慢的原因,并没有对此有过多的纠结,后来发现并不是,于是把测试地址丢给小呆,问在他那边慢不慢,事实证明,真的不是网络的问题,在webuploader的API中查了下,并没有查到什么,然后小呆在github中找到了一个解决办法,在webuploader初始化的时候改变其中的一个参数:
accept: {
title: ’Images’,
extensions: ’jpg,jpeg,png’,
mimeTypes: ’image/*’
}accept: {
title: ’Images’,
extensions: ’jpg,jpeg,png’,
mimeTypes: ’image/jpg,image/jpeg,image/png’ //修改位置
}此方法有点简单粗暴,看了之后才明白 webuploader 如果定义*的话,会检索所有格式,修改这个参数的原因是有选择的扫描文件类型,只选择扫描你设置的类型。小萌试了一下,修改之后确实不会再有延迟了,但是之前小萌初使用webuploader的时候并没有这种情况的发生,而且webuploader官网上的DEMO也是不延迟的,有人解释说是因为谷歌浏览器的更新,chrome 52.0.2743.80版本以上的版本都会出现延迟的情况,但是小萌不明白为啥官网的DEMO就不会有延迟呢。不过纠结这个问题是没有多大意义的,我们旨在解决问题。那么这个问题这样修改下就OK了。
问题二:WebUploader Firefox浏览器 点击上传文件无反应
这个问题其实比问题一更为严重,反应慢就算了,我可以等等,但是根本就无反应就苍了个天了,怎么办??哦怎么办??为什么火狐你就是不能用,害得我你害得我在你面前呼吸急促想要卸载掉你??各种百度无果,又让小呆帮忙我一起在github寻找解决方法,后来看到有个人说是有可能是因为上传按钮使用的是button的原因,建议修改为div。我修改了下,问题果然解决了,说是火狐对button按钮支持的问题,所以才会出现这个情况,虽然不知道为啥会这样,但是问题解决了就好。
问题三:WebUploader 部分低版本IE浏览器 点击上传文件无反应
对于IE这个问题,其实有些公司任性,不考虑IE兼容的话,可以不用理会,这个是因为IE不支持html5上传造成的,虽然说webuploader具有“默认会先尝试 html5 是否支持,如果支持则使用 html5, 否则则使用 flash”这个功能,但是对于IE这种浏览器,有些问题你还真的没办法说出来个所以然,所以如果遇到此问题,可以将可以将runtimeOrder的值设置成flash,来强制使用 flash 运行。不过也不需要担心设置默认为flash 运行上传就会影响其速度,这点webuploader处理的还是很好的。
到这里,这篇文章就结束了,不知道有木有朋友遇到跟我一样的问题,小萌讲此记录下来,一个是用来提醒自己,一个是希望帮助到需要解决这些问题的小伙伴儿们。喜欢的给小萌点个喜欢哦,O(∩_∩)O谢谢
webuploader用java怎么接收
和普通的上传请求一样,你可以使用commons-upload来解析请求,spring的话可以通过action的注解参数来获取上传的文件,jfinal可以用getFile()方法来获取。
如果你想简单,可以以字节流的形式发送文件,webuploder有个参数sendAsBinary ,将其设置为true,这样你java后端用request.getInputStream()即可获取文件的字节流,文件名等参数你可以通过request.getParameter()方法获得。推荐你这么做,最简单的方式。

更多文章:
全球新冠肺炎疫情背景下航运发展(盐田港复苏日志:半年历劫从“低谷”到“爆仓” 疫情之后巨轮如何越洋航行)
2026年9月7日 17:10
matlab求解带字母参数方程组(我想matlab求一个关于x,y的方程组 ab c d f e h m n 都是参数)
2026年9月7日 16:30
oracle中的循环语句(下面哪个不是oracle程序设计中的循环语句 a for)
2026年9月7日 15:30
电脑里2个系统怎么删除一个(电脑开机显示有两个系统,如何删除一个)
2026年9月7日 12:20
scrollthrough意思(“scroll”是什么意思)
2026年9月7日 08:00
怎么激活keygen(注册机如何激活cad2008一个简单激活cad2008的方法)
2026年9月7日 06:30
vba编写excel插件(excel vba中能否动态创建控件)
2026年9月7日 04:40




