uploadify插件在文件上传方面还是很不错的,这不我需要往sae 的storage上上传文件,就用了它。
下面我就分享一下如何实现的吧。
我们先到官网下载最新的uploadify最新的插件包。
在页面中引用以下必须js/css文件,注意uploadify是基于Jquery的所以必须在之前引用一下Jquery包。
<link rel='stylesheet' href='../script/uploadify/uploadify.css?v=2' type='text/css' /> <script type="text/javascript" src="../script/uploadify/jquery.min.js"></script> <script type="text/javascript" src="../script/uploadify/jquery.uploadify.min.js"></script>
页面中定义上传的容器
<div id="file_upload"></div>
然后创建上传插件
$('#file_upload').uploadify({
'onSelect' : function(file){
},
'formData': {
'token':'<?php echo $token; ?>', //token
'userid':'<?php echo $current_user->ID; ?>',
'email':'<?php echo $current_user->user_email; ?>'
},
'removeCompleted':false,
'buttonText' : '选择文件',
'swf' : '../script/uploadify/uploadify.swf',
'uploader' : 'http://codeo.cn/wp-content/themes/xiu-new/pages/co_upload.php',
'method' : 'POST',
'fileObjName':'imgFile',
'queueID':'queue',
'fileSizeLimit':'200k',
'onUploadSuccess' : function(file, data, response) {
data=eval("("+data+")");
if(data.s){
$("#"+file.id).find(".data").html("-完成");
var cancel=$('#'+file.id).find(".cancel a");
if (cancel) {
cancel.attr("rel", data);
cancel.click(function () {
//删除文件及数据
});
}
}else{
$("#"+file.id).find(".data").html("失败:"+data.m);
}
},
'onCancel':function(file){
}
,'overrideEvents': ['onSelectError', 'onDialogClose'],
//返回一个错误,选择文件的时候触发
'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;
}
return true;
},
//检测FLASH失败调用
'onFallback': function () {
alert("您未安装FLASH控件,无法上传图片!请安装FLASH控件后再试。");
}
});
介绍一下uploadify相关参数
- formData:可以填写要传递的参数,以供后台使用;
- uploader:后台处理文件
- overrideEvents:重写事件,以便于自定义提示
- onSelectError:错误提示重写
- onUploadSuccess:每个文件成功后执行的事件,在这里我们可以绑定uploadify的取消按钮的点击事件,实现uploadify的真删除
sae 后台是如何接收uploadify参数进行处理
<?php
//允许的文件后缀
$fileTypes = array('jpg','jpeg','gif','png');
if (!empty($_FILES)) {
//得到上传的临时文件流
$tempFile = $_FILES['imgFile']['tmp_name'];
//得到文件原名
$fileName = $_FILES["imgFile"]["name"];//iconv("UTF-8","GB2312",$_FILES["imgFile"]["name"]);
$fileName=strFilter($fileName);
//扩展名
$temp_arr = explode(".", $fileName);
$file_ext = array_pop($temp_arr);
$file_ext = trim($file_ext);
$file_ext = strtolower($file_ext);
if (in_array($file_ext, $fileTypes) === false) {
echo "2";
exit;
}
//传值 本次唯一id
$tank=$_POST['token'];
$userid=$_POST['userid'];
$email=$_POST['email'];
$file_dir=date("Y/m/d").'/';
$storage = new SaeStorage();
$domain = 'codeku';
$destFileName = $file_dir.create_guid().'_'.$fileName;
$srcFileName = $tempFile;
//$attr = array('encoding'=>'gzip');
$result = $storage->upload($domain,$destFileName, $srcFileName);
if(!$result) {
echomsg('false','文件上传失败!');
exit;
}
if($result){
//也可以插入数据库等操作
}
echomsg('true','操作成功!'.$destFileName.$fileName);
}
?>
sae 保存文件核心方法是
$result = $storage->upload($domain,$destFileName, $srcFileName);
接收uploadifyformDatapost数据方式$_POST['token'];。
来源:http://www.cnblogs.com/huhangfei/p/4989238.html