当前位置: 代码迷 >> Web前端 >> uploadify3.1版本下传附件,后台用webservice处理下传文件总结
  详细解决方案

uploadify3.1版本下传附件,后台用webservice处理下传文件总结

热度:437   发布时间:2013-01-26 13:47:02.0
uploadify3.1版本上传附件,后台用webservice处理上传文件总结

最近修改之前用过的上传文件的代码,发现uploadify版本升级后,和之前的版本API出入很大,各种搜索,把总结记录下来。

uploadify3.1官网下载地址和API说明:http://www.uploadify.com/download/

结合网上的资源,总结如下:

$(document).ready(function() {

$("#file_upload").uploadify({
//开启调试
'debug' : false,
//是否自动上传
'auto':false,
//超时时间
'successTimeout':99999,
//附带值
'formData':{
'userid':'用户id',
'username':'用户名',
'rnd':'加密密文'
},

//flash
'swf': "uploadify.swf",
//不执行默认的onSelect事件
'overrideEvents' : ['onDialogClose'],
//文件选择后的容器ID

'queueID':'uploadfileQueue',

//服务器端脚本使用的文件对象的名称 $_FILES个['upload']
'fileObjName':'upload',
//上传处理程序
'uploader':‘WebService.asmx/API',
//浏览按钮的背景图片路径
'buttonImage':'upbutton.gif',
//浏览按钮的宽度
'width':'100',
//浏览按钮的高度
'height':'32',
//expressInstall.swf文件的路径。
'expressInstall':'expressInstall.swf',
//在浏览窗口底部的文件类型下拉菜单中显示的文本
'fileTypeDesc':'支持的格式:',
//允许上传的文件后缀
'fileTypeExts':'*.jpg;*.jpge;*.gif;*.png',
//上传文件的大小限制
'fileSizeLimit':'3MB',
//上传数量
'queueSizeLimit' : 25,
//每次更新上载的文件的进展
'onUploadProgress' : function(file, bytesUploaded,
bytesTotal, totalBytesUploaded, totalBytesTotal) {
//有时候上传进度什么想自己个性化控制,可以利用这个方法
//使用方法见官方说明
},
//选择上传文件后调用
'onSelect' : function(file) {
},

//返回一个错误,选择文件的时候触发
'onSelectError':function(file, errorCode, errorMsg){
switch(errorCode) {
case -100:
alert("上传的文件数量已经超出系统限制的"+$('#file_upload').uploadify('settings','queueSizeLimit')+"个文件!");
break;
case -110:
alert("文件 ["+file.name+"] 大小超出系统限制的"+$('#file_upload').uploadify('settings','fileSizeLimit')+"大小!");
break;
case -120:

alert("文件 ["+file.name+"] 大小异常!");
break;
case -130:
alert("文件 ["+file.name+"] 类型不正确!");
break;
}
},
//检测FLASH失败调用
'onFallback':function(){
alert("您未安装FLASH控件,无法上传图片!请安装FLASH控件后再试。");
},
//上传到服务器,服务器返回相应信息到data里
'onUploadSuccess':function(file, data, response){
alert(data);
}
});
});

////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////

这里需要注意的就是属性swf和uploader属性的地址,如果是同一个站点下没问题,如果是webservice单独站点,那么可能会报SecurtiyError#2049错误,从官网上查看,好像也有些人遇到这个问题,但他们提供的解决方案是在swfupload.swf文件所在目录下和服务器的根目录下放置一个crossdomain.xml文件,其内容如下:

 <?xml version="1.0"?>
<!DOCTYPE cross-domain-policy SYSTEM "http://www.macromedia.com/xml/dtds/cross-domain-policy.dtd">
<cross-domain-policy>
<allow-access-from domain="*" headers="*" secure="false"/>
</cross-domain-policy>
        我的实践告诉我仍然解决不了问题。我的解决办法如下:
        在对SWFUpload进行实例化时要传参数,如果采用完整路径,其中必须保证upload_url和flash_url所使用的服务器描述一致。例如:
        (假设服务名为TestServer,其IP为192.168.1.100)
        upload_url:"http://TestServer/Test/SFileUpload",
        flash_url:"http://192.168.1.100/Test/flash/swfupload.swf",
        如果如上代码,则会报告2049错误。你必须将其改成:
        upload_url:"http://192.168.1.100/Test/SFileUpload",
        flash_url:"http://192.168.1.100/Test/flash/swfupload.swf",
        或
        upload_url:"http://TestServer/Test/SFileUpload",
        flash_url:"http://TestServer/Test/flash/swfupload.swf",
        要保证两个url对服务器的描述是一致的。另外最后在后面还要加上:
        prevent_swf_caching : false,
        preserve_relative_urls : false,

  相关解决方案