欢迎您, 来到 宁时修博客.^_^

thinkPHP 3.2.3 之Uploadify文件上传

2016/09/08 宁时修 php,thinkPHP 3.2.3 1384
Uploadify 3.2.1 是JQuery的一个很经典的上传插件,实现的效果也不错,兼容也OK,带进度显示。

Uploadify 3.2.1 是JQuery的一个很经典的上传插件,有些年头了,不过依旧还是那么好用,实现的效果也非常不错,兼容也OK,带进度显示。

下载Uploadify 3.2.1

官方地址:http://www.uploadify.com/

下载地址:http://www.uploadify.com/download/

如图:有2个版本,3.2.1是flash版本的(我目前开发用的就是这个,因为网站对html5兼容不是很好)

1.1.2 这个是H5的版本,目前没用过,先了解的自行下载研究!

我这里下载的是 uploadify 3.2.1


 前端操作

1)引入文件

<link href="__PUBLIC__/uploadify/uploadify.css" rel="stylesheet" />
<script src="__PUBLIC__/js/jquery-1.11.3.js"></script>
<script src="__PUBLIC__/uploadify/jquery.uploadify.min.js"></script>

注意:Uploadify是基于Jquery的,所以必须先加载Jquery 在加载Uploadify 顺序不可改变

2)上传按钮

<div>
    <img src="" id="show-img"><!--显示图片区域-->
    <span id="show-name"></span><!--图片名称-->
</div>
<span id="btn_upload"></span><!--按钮-->

3)javascript 

<script>
   $(function () {
      $('#btn_upload').uploadify({
         uploader: '{:U("Home/Up/send")}',                   //服务器处理地址
         swf: '__PUBLIC__/uploadify/uploadify.swf',          //swf文件地址
         buttonText: "选择文件",                              //按钮文字
         height: 34,                                          //按钮高度
         width: 82,                                           //按钮宽度
         fileTypeExts: "*.jpg;*.png;*.jpeg;*.gif;",           //允许的文件类型
         fileTypeDesc: "请选择图片文件",                       //文件说明
         formData: { "imgType": "normal" },                   //提交给服务器端的参数
         onUploadSuccess: function (file, data, response) {
           var data = $.parseJSON(data);//将服务返回json类型字符串转换成json对象数据
           //file - 包含原始文件的信息;
           //response - 后台返回true或false;
           //data - 后台返回的数据,试例中为Json对象
           //console.log(data); 打印对象
            if (data.status == 1) {
               $("#show-img").attr('src',data.url);
               $("#show-name").html(data.name);
            } else {
               alert(data.msg);
            }
         }
      });
   });
</script>

PHP服务端处理

1)文件上传配置

return array(
    //文件上传配置
    'FILE_MAX_SIZE' => 3145728,                      //设置文件上传的大小,单位为字节
    'FILE_EXT_TYPE' => array('jpg', 'gif', 'png', 'jpeg'),  //允许上传的文件后缀(留空为不限制)
    'FILE_ROOT_PATH'=> './Uploads/',                 //设置文件上传的根目录
    'FILE_SAVE_PATH'=> '/file/',                   //设置文件上传的子目录 目前子目录是:./Uploads/file/
    'FILE_SAVE_NAME'=> 'max_' . date('YmdHis'),         //设置上传后的文件名
    'FILE_SUB_NAME' => date('Y-m-d'),                //设置子目录的具体子目录 目前子目录是:./Uploads/file/2016-06-06
    'FILE_AUTO_SUB' => true,                      //自动使用子目录保存上传文件 默认为true 目前:./Uploads/file/2016-06-06/01.png
    'FILE_REPLACE'  => false,                     //同名文件是否被覆盖 默认false
    'FILE_SAVE_EXT' => '',                       //上传文件的保存后缀,不设置的话使用原文件后缀
    'FILE_MIMES'    => array(),                   //允许上传的文件类型(留空为不限制)
);

2)控制器方法操作

/**
 * 文件上传
 * @param string $rootPath 文件上传的根目录
 * @param string $savePath 文件上传的子目录
 * @param string $saveName 上传后文件名
 * return string (error)| array (success)
 */
protected function uploads($rootPath = '',$savePath = '',$saveName = ''){
    $upload = new \Think\Upload();
    if (empty($rootPath)) {
        $rootPath = C('FILE_ROOT_PATH');
    }
    if(empty($savePath)) {
        $savePath = C('FILE_SAVE_PATH');
    }
    if(empty($saveName)) {
        $saveName = C('FILE_SAVE_NAME');
    }
    //检测上传根目录是否存在
    if (!file_exists($rootPath)) {
        mkdir($rootPath,0777,true);
    }
    if (!file_exists($savePath)) {
        mkdir($savePath,0777,true);
    }
    // 设置文件上传的大小,单位为字节
    $upload->maxSize   =     C('FILE_MAX_SIZE');
    //允许上传的文件后缀(留空为不限制)
    $upload->exts      =     C('FILE_EXT_TYPE');
    //设置文件上传的根目录
    $upload->rootPath  =     $rootPath;
    //设置附件上传(子)目录
    $upload->savePath  =     $savePath;
    //设置上传之后的文件名
    $upload->saveName  =     $saveName;
    //设置子目录文件名
    $upload->subName   =     C('FILE_SUB_NAME');
    //自动使用子目录保存上传文件 默认为true
    $upload->autoSub   =     C('FILE_AUTO_SUB');
    //同名文件是否被覆盖 默认false
    $upload->replace   =     C('FILE_REPLACE');
    //上传文件的保存后缀,不设置的话使用原文件后缀
    $upload->saveExt   =     C('FILE_SAVE_EXT');
    //允许上传的文件类型(留空为不限制)
    $upload->mimes     =     C('FILE_MIMES');
    // 上传文件
    $info   =   $upload->upload();
    if(!$info) {
        // 上传错误提示错误信息
        return $upload->getError();
    }else{
        // 上传成功
        return $info;
    }
}
 
//处理文件上传
public function send() {
    $upload = $this->uploads();
    if (is_array($upload)) {
        //上传成功 组合Url
        $upload['Filedata']['url'] = substr(C('FILE_ROOT_PATH'),1) . substr($upload['Filedata']['savepath'],1) . $upload['Filedata']['savename'];
        $json = array(
            'status' => 1,
            'msg'    => '上传成功',
            'name'   => $upload['Filedata']['name'],
            'url'    => $upload['Filedata']['url']
        );
        exit(json_encode($json));
    } else {
        //上传失败
        exit(json_encode(array('status'=>0,'msg'=>$upload)));
    }
}
点赞
说说你的看法

所有评论: (0)

# 加入组织

1、用手机QQ扫左侧二维码

2、搜Q群:1058582137

3、点击 宁时修博客交流群