24Oct

KindEditor,修改图片,附件上传保存原有中文名

时间: 2012-10-24 分类: PHP开发 作者:

TAGS:

kindeditor是一个非常优秀的网页在线编辑器.在使用的过程中,我发现:kindeditor默认的上传功能会重命名文件名,以日期+随机字符的形式!当然,这个功能能够有效地避免了其他一些编码错误的产生!但是,在实际的应用过程中,我需要保留文件名(中文),并且需要在远程服务器中也显示出中文!于是找来了一篇这样的文章跟大家分享,转载,所以里面的版权信息都没有去除,也希望大家能够保留!

1.修改图片上传,默认是显示当天日期/当天日期+随机值.jpg更改为可以显示原始的文件名。支持中文显示

2.修改附件上传,默认是显示当天日期/当天日期+随机值.jpg更改为可以显示原始的文件名。支持中文显示

[ccen_php]//其中:upload_json.jsp,file_manager_json.jsp的文件路径,自己调整.

//文件保存目录路径 $save_path = $php_path . ‘../../../../uploads/’;

//文件保存目录URL $save_url = $php_url .'../../../../uploads/'; [/ccen_php]

修改代码:

1.php/upload_json.php

[cce_php]
<?php
/**
 * KindEditor PHP
 * 
 * 本PHP程序是演示程序,建议不要直接在实际项目中使用。
 * 如果您确定直接使用本程序,使用之前请仔细确认相关安全设置。
  * @modify by Condy 2012.04.05,将文件上传到uploads目录下,去掉生成日期目录,生成随机文件名。
 * 
 */

require_once 'JSON.php';

$php_path = dirname(__FILE__) . '/';
$php_url = dirname($_SERVER['PHP_SELF']) . '/';

//文件保存目录路径
$save_path = $php_path . '../../../../uploads/';
//文件保存目录URL
$save_url = $php_url .'../../../../uploads/';
//定义允许上传的文件扩展名
$ext_arr = array(
        'image' => array('gif', 'jpg', 'jpeg', 'png', 'bmp'),
        'flash' => array('swf', 'flv'),
        'media' => array('swf', 'flv', 'mp3', 'wav', 'wma', 'wmv', 'mid', 'avi', 'mpg', 'asf', 'rm', 'rmvb'),
        'file' => array('doc', 'docx', 'xls', 'xlsx', 'ppt', 'htm', 'html', 'txt', 'zip', 'rar', 'gz', 'bz2'),
);
//最大文件大小
$max_size = 1000000;

$save_path = realpath($save_path) . DIRECTORY_SEPARATOR;

//有上传文件时
if (empty($_FILES) === false) {
        //原文件名
        $file_name = $_FILES['imgFile']['name'];
        //服务器上临时文件名
        $tmp_name = $_FILES['imgFile']['tmp_name'];
        //文件大小
        $file_size = $_FILES['imgFile']['size'];
        //检查文件名
        if (!$file_name) {
                alert("请选择文件。");
        }
        //检查目录
        if (@is_dir($save_path) === false) {
                alert("上传目录不存在。");
        }
        //检查目录写权限
        if (@is_writable($save_path) === false) {
                alert("上传目录没有写权限。");
        }
        //检查是否已上传
        if (@is_uploaded_file($tmp_name) === false) {
                alert("临时文件可能不是上传文件。");
        }
        //检查文件大小
        if ($file_size > $max_size) {
                alert("上传文件大小超过限制。");
        }
        //检查目录名
        $dir_name = empty($_GET['dir']) ? 'image' : trim($_GET['dir']);
        if (empty($ext_arr[$dir_name])) {
                alert("目录名不正确。");
        }
        //获得文件扩展名
        $temp_arr = explode(".", $file_name);
        $file_ext = array_pop($temp_arr);
        $file_ext = trim($file_ext);
        $file_ext = strtolower($file_ext);
        //检查扩展名
        if (in_array($file_ext, $ext_arr[$dir_name]) === false) {
                alert("上传文件扩展名是不允许的扩展名。n只允许" . implode(",", $ext_arr[$dir_name]) . "格式。");
        }
        //创建文件夹
        if ($dir_name !== '') {
                $save_path .= $dir_name . DIRECTORY_SEPARATOR;
                $save_url .= $dir_name .'/';
                if (!file_exists($save_path)) {
                        mkdir($save_path);
                }
        }
        /* modify by Condy 文件名,还是用原来旧的文件名.
        $ymd = date("Ymd");
        $save_path .= $ymd . "/";
        $save_url .= $ymd . "/";
        if (!file_exists($save_path)) {
        mkdir($save_path);
        }
        //新文件名
        $new_file_name = date("YmdHis") . '_' . rand(10000, 99999) . '.' . $file_ext;
        //移动文件
        $file_path = $save_path . $new_file_name;
*/
  $file_path = $save_path . $file_name;
  $file_path=iconv("UTF-8","GBK",$file_path);
        if (move_uploaded_file($tmp_name, $file_path) === false) {
                alert("上传文件失败。");
        }
        @chmod($file_path, 0644);
        #$file_url = $save_url . $new_file_name;
        $file_url =$save_url .urlencode( $file_name);

        header('Content-type: text/html; charset=UTF-8');
        $json = new Services_JSON();
        echo $json->encode(array('error' => 0, 'url' => $file_url));
        exit;
}

function alert($msg) {
        header('Content-type: text/html; charset=UTF-8');
        $json = new Services_JSON();
        echo $json->encode(array('error' => 1, 'message' => $msg));
        exit;
}
?>
[/cce_php]

2.修改php/file_manager_json.php

[cce_php]
<?php
/**
 * KindEditor PHP
 * 
 * 本PHP程序是演示程序,建议不要直接在实际项目中使用。
 * 如果您确定直接使用本程序,使用之前请仔细确认相关安全设置。
 * * @modify by Condy 2012.04.05,增加中文的文件名显示,需要配合plugin/filemanager/filemanager.js使用.
 *      $file_list[$i]['filename'] = urlencode(iconv("GBK","UTF-8",$filename)); //中文的文件名显示,要进行URL编码,包含扩展名
 *  $file_list[$i]['displayfilename'] =iconv("GBK","UTF-8",$filename); //中文的文件名文件名,包含扩展名
 * 
 */

require_once 'JSON.php';

$php_path = dirname(__FILE__) . '/';
$php_url = dirname($_SERVER['PHP_SELF']) . '/';

//根目录路径,可以指定绝对路径,比如 /var/www/attached/
$root_path = $php_path . '../../../../uploads/';
//根目录URL,可以指定绝对路径,比如 http://www.yoursite.com/attached/
$root_url = $php_url . '../../../../uploads/';
//图片扩展名
$ext_arr = array('gif', 'jpg', 'jpeg', 'png', 'bmp');

//目录名
$dir_name = empty($_GET['dir']) ? '' : trim($_GET['dir']);
if (!in_array($dir_name, array('', 'image', 'flash', 'media', 'file'))) {
        echo "Invalid Directory name.";
        exit;
}
if ($dir_name !== '') {
        $root_path .= $dir_name . "/";
        $root_url .= $dir_name . "/";
        if (!file_exists($root_path)) {
                mkdir($root_path);
        }
}

//根据path参数,设置各路径和URL
if (empty($_GET['path'])) {
        $current_path = realpath($root_path) . '/';
        $current_url = $root_url;
        $current_dir_path = '';
        $moveup_dir_path = '';
} else {
        $current_path = realpath($root_path) . '/' . $_GET['path'];
        $current_url = $root_url . $_GET['path'];
        $current_dir_path = $_GET['path'];
        $moveup_dir_path = preg_replace('/(.*?)[^/]+/$/', '$1', $current_dir_path);
}
echo realpath($root_path);
//排序形式,name or size or type
$order = empty($_GET['order']) ? 'name' : strtolower($_GET['order']);

//不允许使用..移动到上一级目录
if (preg_match('/../', $current_path)) {
        echo 'Access is not allowed.';
        exit;
}
//最后一个字符不是/
if (!preg_match('//$/', $current_path)) {
        echo 'Parameter is not valid.';
        exit;
}
//目录不存在或不是目录
if (!file_exists($current_path) || !is_dir($current_path)) {
        echo 'Directory does not exist.';
        exit;
}

//遍历目录取得文件信息
$file_list = array();
if ($handle = opendir($current_path)) {
        $i = 0;
        while (false !== ($filename = readdir($handle))) {
                if ($filename{0} == '.') continue;
                $file = $current_path . $filename;
                if (is_dir($file)) {
                        $file_list[$i]['is_dir'] = true; //是否文件夹
                        $file_list[$i]['has_file'] = (count(scandir($file)) > 2); //文件夹是否包含文件
                        $file_list[$i]['filesize'] = 0; //文件大小
                        $file_list[$i]['is_photo'] = false; //是否图片
                        $file_list[$i]['filetype'] = ''; //文件类别,用扩展名判断
                } else {
                        $file_list[$i]['is_dir'] = false;
                        $file_list[$i]['has_file'] = false;
                        $file_list[$i]['filesize'] = filesize($file);
                        $file_list[$i]['dir_path'] = '';
                        $file_ext = strtolower(array_pop(explode('.', trim($file))));
                        $file_list[$i]['is_photo'] = in_array($file_ext, $ext_arr);
                        $file_list[$i]['filetype'] = $file_ext;
                }
                $file_list[$i]['filename'] = urlencode(iconv("GBK","UTF-8",$filename)); //中文的文件名显示,要进行URL编码,包含扩展名
                $file_list[$i]['displayfilename'] =iconv("GBK","UTF-8",$filename); //中文的文件名文件名,包含扩展名
                $file_list[$i]['datetime'] = date('Y-m-d H:i:s', filemtime($file)); //文件最后修改时间
                $i++;
        }
        closedir($handle);
}

//排序
function cmp_func($a, $b) {
        global $order;
        if ($a['is_dir'] && !$b['is_dir']) {
                return -1;
        } else if (!$a['is_dir'] && $b['is_dir']) {
                return 1;
        } else {
                if ($order == 'size') {
                        if ($a['filesize'] > $b['filesize']) {
                                return 1;
                        } else if ($a['filesize'] < $b['filesize']) {
                                return -1;
                        } else {
                                return 0;
                        }
                } else if ($order == 'type') {
                        return strcmp($a['filetype'], $b['filetype']);
                } else {
                        return strcmp($a['filename'], $b['filename']);
                }
        }
}
usort($file_list, 'cmp_func');

$result = array();
//相对于根目录的上一级目录
$result['moveup_dir_path'] = $moveup_dir_path;
//相对于根目录的当前目录
$result['current_dir_path'] = $current_dir_path;
//当前目录的URL
$result['current_url'] = $current_url;
//文件数
$result['total_count'] = count($file_list);
//文件列表数组
$result['file_list'] = $file_list;

//输出JSON字符串
header('Content-type: application/json; charset=UTF-8');
$json = new Services_JSON();
echo $json->encode($result);
?>
[/cce_php]

3.修改plugins/filemanger/filemanager.js:

[cce_js]
[cce]
/*******************************************************************************
* KindEditor - WYSIWYG HTML Editor for Internet
* Copyright (C) 2006-2011 kindsoft.net
*
* @author Roddy <luolonghao@gmail.com>
* @site http://www.kindsoft.net/
* @licence http://www.kindsoft.net/license.php
* @modify by Condy 2012.04.05,中文显示比较乱,配合file_manager_json.php修改.
* div.append('<div class="ke-name" title="' + data.filename + '">' + data.filename + '</div>');
* 修改为:div.append('<div class="ke-name" title="' + data.displayfilename + '">' + data.displayfilename + '</div>');
*******************************************************************************/

KindEditor.plugin('filemanager', function(K) {
        var self = this, name = 'filemanager',
                fileManagerJson = K.undef(self.fileManagerJson, self.basePath + 'php/file_manager_json.php'),
                imgPath = self.pluginsPath + name + '/images/',
                lang = self.lang(name + '.');
        function makeFileTitle(filename, filesize, datetime) {
                return filename + ' (' + Math.ceil(filesize / 1024) + 'KB, ' + datetime + ')';
        }
        function bindTitle(el, data) {
                if (data.is_dir) {
                        el.attr('title', data.filename);
                } else {
                        el.attr('title', makeFileTitle(data.filename, data.filesize, data.datetime));
                }
        }
        self.plugin.filemanagerDialog = function(options) {
                var width = K.undef(options.width, 520),
                        height = K.undef(options.height, 510),
                        dirName = K.undef(options.dirName, ''),
                        viewType = K.undef(options.viewType, 'VIEW').toUpperCase(), // "LIST" or "VIEW"
                        clickFn = options.clickFn;
                var html = [
                        '<div style="padding:10px 20px;">',
                        // header start
                        '<div class="ke-plugin-filemanager-header">',
                        // left start
                        '<div class="ke-left">',
                        '<img class="ke-inline-block" name="moveupImg" src="' + imgPath + 'go-up.gif" width="16" height="16" border="0" alt="" /> ',
                        '<a class="ke-inline-block" name="moveupLink" href="javascript:;">' + lang.moveup + '</a>',
                        '</div>',
                        // right start
                        '<div class="ke-right">',
                        lang.viewType + ' <select class="ke-inline-block" name="viewType">',
                        '<option value="VIEW">' + lang.viewImage + '</option>',
                        '<option value="LIST">' + lang.listImage + '</option>',
                        '</select> ',
                        lang.orderType + ' <select class="ke-inline-block" name="orderType">',
                        '<option value="NAME">' + lang.fileName + '</option>',
                        '<option value="SIZE">' + lang.fileSize + '</option>',
                        '<option value="TYPE">' + lang.fileType + '</option>',
                        '</select>',
                        '</div>',
                        '<div class="ke-clearfix"></div>',
                        '</div>',
                        // body start
                        '<div class="ke-plugin-filemanager-body"></div>',
                        '</div>'
                ].join('');
                var dialog = self.createDialog({
                        name : name,
                        width : width,
                        height : height,
                        title : self.lang(name),
                        body : html
                }),
                div = dialog.div,
                bodyDiv = K('.ke-plugin-filemanager-body', div),
                moveupImg = K('[name="moveupImg"]', div),
                moveupLink = K('[name="moveupLink"]', div),
                viewServerBtn = K('[name="viewServer"]', div),
                viewTypeBox = K('[name="viewType"]', div),
                orderTypeBox = K('[name="orderType"]', div);
                function reloadPage(path, order, func) {
                        var param = 'path=' + path + '&order=' + order + '&dir=' + dirName;
                        dialog.showLoading(self.lang('ajaxLoading'));
                        K.ajax(K.addParam(fileManagerJson, param + '&' + new Date().getTime()), function(data) {
                                dialog.hideLoading();
                                func(data);
                        });
                }
                var elList = [];
                function bindEvent(el, result, data, createFunc) {
                        var fileUrl = K.formatUrl(result.current_url + data.filename, 'absolute'),
                                dirPath = encodeURIComponent(result.current_dir_path + data.filename + '/');
                        if (data.is_dir) {
                                el.click(function(e) {
                                        reloadPage(dirPath, orderTypeBox.val(), createFunc);
                                });
                        } else if (data.is_photo) {
                                el.click(function(e) {
                                        clickFn.call(this, fileUrl, data.filename);
                                });
                        } else {
                                el.click(function(e) {
                                        clickFn.call(this, fileUrl, data.filename);
                                });
                        }
                        elList.push(el);
                }
                function createCommon(result, createFunc) {
                        // remove events
                        K.each(elList, function() {
                                this.unbind();
                        });
                        moveupLink.unbind();
                        viewTypeBox.unbind();
                        orderTypeBox.unbind();
                        // add events
                        if (result.current_dir_path) {
                                moveupLink.click(function(e) {
                                        reloadPage(result.moveup_dir_path, orderTypeBox.val(), createFunc);
                                });
                        }
                        function changeFunc() {
                                if (viewTypeBox.val() == 'VIEW') {
                                        reloadPage(result.current_dir_path, orderTypeBox.val(), createView);
                                } else {
                                        reloadPage(result.current_dir_path, orderTypeBox.val(), createList);
                                }
                        }
                        viewTypeBox.change(changeFunc);
                        orderTypeBox.change(changeFunc);
                        bodyDiv.html('');
                }
                function createList(result) {
                        createCommon(result, createList);
                        var table = document.createElement('table');
                        table.className = 'ke-table';
                        table.cellPadding = 0;
                        table.cellSpacing = 0;
                        table.border = 0;
                        bodyDiv.append(table);
                        var fileList = result.file_list;
                        for (var i = 0, len = fileList.length; i < len; i++) {
                                var data = fileList[i], row = K(table.insertRow(i));
                                row.mouseover(function(e) {
                                        K(this).addClass('ke-on');
                                })
                                .mouseout(function(e) {
                                        K(this).removeClass('ke-on');
                                });
                                var iconUrl = imgPath + (data.is_dir ? 'folder-16.gif' : 'file-16.gif'),
                                        img = K('<img src="' + iconUrl + '" width="16" height="16" alt="' + data.filename + '" align="absmiddle" />'),
                                        cell0 = K(row[0].insertCell(0)).addClass('ke-cell ke-name').append(img).append(document.createTextNode(' ' + data.filename));
                                if (!data.is_dir || data.has_file) {
                                        row.css('cursor', 'pointer');
                                        cell0.attr('title', data.filename);
                                        bindEvent(cell0, result, data, createList);
                                } else {
                                        cell0.attr('title', lang.emptyFolder);
                                }
                                K(row[0].insertCell(1)).addClass('ke-cell ke-size').html(data.is_dir ? '-' : Math.ceil(data.filesize / 1024) + 'KB');
                                K(row[0].insertCell(2)).addClass('ke-cell ke-datetime').html(data.datetime);
                        }
                }
                function createView(result) {
                        createCommon(result, createView);
                        var fileList = result.file_list;
                        for (var i = 0, len = fileList.length; i < len; i++) {
                                var data = fileList[i],
                                        div = K('<div class="ke-inline-block ke-item"></div>');
                                bodyDiv.append(div);
                                var photoDiv = K('<div class="ke-inline-block ke-photo"></div>')
                                        .mouseover(function(e) {
                                                K(this).addClass('ke-on');
                                        })
                                        .mouseout(function(e) {
                                                K(this).removeClass('ke-on');
                                        });
                                div.append(photoDiv);
                                var fileUrl = result.current_url + data.filename,
                                        iconUrl = data.is_dir ? imgPath + 'folder-64.gif' : (data.is_photo ? fileUrl : imgPath + 'file-64.gif');
                                var img = K('<img src="' + iconUrl + '" width="80" height="80" alt="' + data.filename + '" />');
                                if (!data.is_dir || data.has_file) {
                                        photoDiv.css('cursor', 'pointer');
                                        bindTitle(photoDiv, data);
                                        bindEvent(photoDiv, result, data, createView);
                                } else {
                                        photoDiv.attr('title', lang.emptyFolder);
                                }
                                photoDiv.append(img);
                                div.append('<div class="ke-name" title="' + data.displayfilename + '">' + data.displayfilename + '</div>');
                        }
                }
                viewTypeBox.val(viewType);
                reloadPage('', orderTypeBox.val(), viewType == 'VIEW' ? createView : createList);
                return dialog;
        }

});
[/cce]
[/cce_js]

 

其实只要把上面的代码替换本来的kindeditor就可以了.不过这样的话,在远程服务器跟路径显示上面,中文会被另一种代码格式替代,看起来像中文.这时,我们只需要把upload_json.php与file_manager_json.php中的转换函数urlencode()去除即可!本人测试代码通过!

喜欢我们的文章请您与朋友分享:

除非特殊注明,本文版权归原作者所有,欢迎转载!转载请注明版权以及本文地址,谢谢。
转载保留版权:泰山个人博客 >> KindEditor,修改图片,附件上传保存原有中文名
本文地址:http://www.tais3.com/2012/612.html + 复制链接

相关文章:

Comments

目前有 0 条精彩评论

  1. 还没有任何评论,你来说两句吧

Comments
发表评论

电子邮件地址不会被公开。 * 标记为必填选项

  • 正确格式为: http://www.tais3.com