首页 > 技术文章 > CKEditor + CKFinder 实现编辑上传图片配置

liu201312 2016-08-04 11:40 原文

下载最新版 ckfinder 本人下载的php版本

https://cksource.com/ckfinder/download

下载最新版ckeditor
http://ckeditor.com/

把它们解压放到指定的目录
html 文件主页内容

需要修改的配置文件
修改ckeditor 的配置文件
Public\Ckeditor\ckeditor\config.js
/**

  • @license Copyright (c) 2003-2016, CKSource - Frederico Knabben. All rights reserved.
  • For licensing, see LICENSE.md or http://ckeditor.com/license
    */

CKEDITOR.editorConfig = function( config ) {
// Define changes to default configuration here. For example:
//设置为中文
config.language = 'zh-cn';
//背景颜色
config.uiColor = '#14B8C4';
// 设置宽高
config.height = 600;

//去掉图片预览英文
config.image_previewText = ' ';

config.filebrowserBrowseUrl = '/Public/Ckeditor/ckfinder/ckfinder.html?Type=Files';
config.filebrowserImageBrowseUrl = '/Public/Ckeditor/ckfinder/ckfinder.html?Type=Images';
config.filebrowserFlashBrowseUrl = '/Public/Ckeditor/ckfinder/ckfinder.html?Type=Flash';
config.filebrowserUploadUrl = '/Public/Ckeditor/ckfinder/core/connector/php/connector.php?command=QuickUpload&type=Files';
config.filebrowserImageUploadUrl = '/Public/Ckeditor/ckfinder/core/connector/php/connector.php?command=QuickUpload&type=Images';
config.filebrowserFlashUploadUrl = '/Public/Ckeditor/ckfinder/core/connector/php/connector.php?command=QuickUpload&type=Flash';

};
需要其他的自己定义

修改ckfinder 的配置文件
Public\Ckeditor\ckfinder\config.php

ini_set('display_errors', 0); 改为 ini_set('display_errors', 1); 有错误信息方便调试

$config['authentication'] = function () {

return false;

};
改为
session_start();

$config['authentication'] = function () {
if(isset($_SESSION['username'])){
return true;
}else{
return false;
}
};
允许上传 并增加安全验证 可以根据自己的需要修改

$config['backends'][] = array(
'name' => 'default',
'adapter' => 'local',
'baseUrl' => '/ckfinder/userfiles/',
// 'root' => '', // Can be used to explicitly set the CKFinder user files directory.
'chmodFiles' => 0777,
'chmodFolders' => 0755,
'filesystemEncoding' => 'UTF-8',
);
改为
$baseUrl 具体的自己定义
$baseDir
$config['backends'][] = array(
'name' => 'default',
'adapter' => 'local',
'baseUrl' => $baseUrl, //新的上传文件访问路径
'root' => $baseDir, // 新修改的文件上传根目录
'chmodFiles' => 0777,
'chmodFolders' => 0755,
'filesystemEncoding' => 'UTF-8',
);

$config['resourceTypes'][] = array(
'name' => 'Images',
'directory' => 'images',
'maxSize' => 0,
'allowedExtensions' => 'bmp,gif,jpeg,jpg,png',
'deniedExtensions' => '',
'backend' => 'default'
);
改为

$config['resourceTypes'][] = array(
'name' => 'Files', // Single quotes not allowed.
'directory' => 'img/ckeditor/files', //修改上传的具体路径
'maxSize' => 0,
'allowedExtensions' => '7z,aiff,asf,avi,bmp,csv,doc,docx,fla,flv,gif,gz,gzip,jpeg,jpg,mid,mov,mp3,mp4,mpc,mpeg,mpg,ods,odt,pdf,png,ppt,pptx,pxd,qt,ram,rar,rm,rmi,rmvb,rtf,sdc,sitd,swf,sxc,sxw,tar,tgz,tif,tiff,txt,vsd,wav,wma,wmv,xls,xlsx,zip',
'deniedExtensions' => '',
'backend' => 'default'
);
其他的像上传flash 都做同样的修改

最后修改上传文件名称,防止中文乱码

\Ckeditor\ckfinder\core\connector\php\vendor\cksource\ckfinder\src\CKSource\CKFinder\Utils.php

public static function replaceDisallowedExtensions($fileName, ResourceType $resourceType)
{
$pieces = explode('.', $fileName);

    $basename = array_shift($pieces);
    $lastExtension = array_pop($pieces);

    foreach ($pieces as $ext) {
        $basename .= $resourceType->isAllowedExtension($ext) ? '.' : '_';
        $basename .= $ext;
    }
    /**
     * 重新定义命名规则  自己定义
     */
    $sFileName=date('YmdHis').mt_rand(1000,9999);  
    // Add the last extension to the final name.
    return $sFileName . '.' . $lastExtension;
}

推荐阅读