webUploader 在 IE 浏览器下上传失败的原因(uploadError:http)

260 阅读1分钟

一、现象

项目中使用了 webuploader 组件,在chrome,firefox 上传图片正常,在IE上总是上传失败; 打开调试工具,发现上传后总是会触发 uploadError 回调函数,并且第二个参数reason值为http;

二、解决过程

查看资料说是因为后台接口返回的数据类型是json类型,需要转换为String类型;抱着试一试的态度,让后台把接口返回值改为string类型之后;发现还是上传不成功;查看控制台network,发现 xxx/crossdomain.xml 资源文件报404;让后台他们加上试了下,奇迹般的上传成功了!!

三、思考

  1. 为什么在chrome、firefox上返回的json格式的数据能上传成功? 因为webuploader是采用html5上传和flash上传,优先采用html5上传;Chrome、firefox采用html5上传可以接受json格式;而IE采用flash上传

  2. 为什么IE上不支持json格式的数据? ie无法解析回调里的json数据,就是说如果服务器返回json数据,ie会把它当做文件来处理,显示打开或保存。解决方法:在后端返回的时候自定义contype-type为"text/html" 比如在node中这样写res.setHeader('Content-Type', 'text/html')。 参考资料:# 如何解决“文件上传返回JSON数据,在IE下提示下载文件”的问题?

  3. xxx/crossdomain.xml 为什么需要这个文件? 采用flash跨域上传,会先读取上传文件服务器上根目录上的 crossdomain.xml

<?xml version="1.0" encoding="UTF-8"?>  
<cross-domain-policy>  
    <allow-access-from domain="*"/>
</cross-domain-policy> 

放置在服务器的根目录上 xxx.com/crossdomain.xml