今天又同事反映uploadify在Safari浏览器里不能上传和不能点击的,于是就去排查,由于对前端的经验不是很足,导致调试了很久都没有发现问题(这个可以略过),
第一个问题:layer与uploadify上传在Safari浏览器里点击没有反应和不能上传文件的原因,主要是由于浏览器的兼容性导致的,这个也是uploadify在Mozilla Firefox里也不能上传返回302的错误,这个是由于Safari和Firefox里都不能穿session的id给后端,导致系统认为不是同一个用户会报出错误。下面是解决的方法就是在上传的时候增加sesion_id
var formData={'type' : type,'field':Filedata,'path':path,'upload_allowext':upload_no_allowext,'upload_maxsize':upload_maxsize,'timestamp' : '<?php echo $timestamp;?>','token': "<?php echo md5('unique_salt' . $timestamp);?>",'PHPSESSID': "<?php echo session_id();?>"}; //增加session_id 信息
$('#file_upload').uploadify({
'debug' : false,
'swf' : '__STATIC__/uploadify/uploadify.swf?ver=', //指定上传控件的主体文件
'uploader' : upload_url+'?jsessionid=<?php echo session_id();?>&ver='+Math.random(), //指定服务器端上传处理文件
'buttonText' : '选择文件', //上传按钮样式
'buttonClass' : 'glyphicon glyphicon-plus', //添加按钮class类
'auto' : false, //是否自动上传
'fileSizeLimit': parseInt(upload_maxsize), //允许文件大小KB,3M,否则最大100M
'uploadLimit' : parseInt(upload_maxnum),//可上载的文件的最大数目。
'queueSizeLimit' : parseInt(upload_maxnum),
'fileTypeExts' : upload_allowext, //文件类型
'height' : 36, //按钮高度
'queueID' : 'queue', //文件显示队列的DOM id
'formData' : formData, //额外发送数据
'fileObjName' : Filedata, //$_FILES['Filedata']
'uploadScript' : upload_url, //服务器处理函数
'removeCompleted' : true, //移除上传的队列
'dnd' : true, //文件拖拽上传
'onUploadComplete' : function(file) {
},
'onSelect' : function(file) {
var total_file=parseInt($("#total_file").html());
$("#total_file").html(total_file+1);
},
'onUploadStart' : function(filesToUpload){
indexA = parent.layer.load(2,{shade:[0.3,'#000']});
if($('#water').prop('checked')){
$("#file_upload").uploadify("settings", "formData", { "watermark": 1 });
}
},
'onUploadSuccess':function(file, data, response){
var json = $.parseJSON(data);
//上传成功处理的。
},
'onQueueComplete' : function(){
parent.layer.close(indexA);
},
'onUploadError':function(file, errorCode, errorMsg){
parent.layer.alert("上传失败:"+errorMsg+"=="+file.name+"=="+errorCode);
}
});前端增加好了,那么后端用同样的处理方式,在获取使用到session的地方前面增加PHPSESSIONID标识是同一个用户
if(isset($_POST['PHPSESSID'])){
session_id($_POST['PHPSESSID']);
}第二个问题:uploadify在Safari 点击没反应,是由于浏览器的滚动条导致的,让你把滚动条拉到最低在点击选择文件按钮会发现无法点击,只有把滚动条拉到最上顶端才可以继续点击。这个是由于layer增加了一个fixed的功能,默认是true,导致页面都固定在上面了,不会随着滚动条移动而移动,现在只需要吧fixed的参数改为false就可以正常了。
/**
* [dialogIframe iframe弹窗]
* @param {[type]} url [iframe地址]
* @param {[type]} title [标题]
*/
function dialogIframe(url,title){
var url = url + "?iframe=" + window.name+"&ver="+Math.random();
layer.open({
title:title,
type:2,
area: ['60%','480px'],
maxmin:true,
zIndex:1989101400,
scrollbar:false,
shadeClose:true,
fixed:false,
content:url
});
}