CKEditor 4 與 CKFinder 3 整合配置全攻略（PHP 版）

富文本編輯器與文件管理器無縫集成

本文詳細記錄 CKEditor 4 與 CKFinder 3 在 PHP 環境下的安裝、配置、權限控制、上傳路徑動態切換、中文文件名重命名等完整流程。

1. CKEditor 基礎配置

// config.js
config.language = 'zh-cn';
config.skin = 'moono-lisa';
config.uiColor = '#F7F7F7';
config.toolbar = 'Full';
// 或自定義工具欄
config.toolbar_Full = [
    { name: 'basicstyles', items: ['Bold','Italic','Underline'] },
    { name: 'paragraph', items: ['NumberedList','BulletedList'] },
    { name: 'insert', items: ['Image','Table','HorizontalRule'] },
    '/',
    { name: 'styles', items: ['Format','Font','FontSize'] },
    { name: 'colors', items: ['TextColor','BGColor'] }
];

2. PHP 端實例化編輯器

require_once ROOT_PATH . 'ckeditor/ckeditor.php';
$CKEditor = new CKEditor();
$CKEditor->returnOutput = true;
$CKEditor->basePath = '/ckeditor/';
$contentArea = $CKEditor->editor('content', $rs['contents']);
echo $contentArea;

3. CKFinder 核心配置 (config.php)

認證控制

session_start();
function CheckAuthentication() {
    return isset($_SESSION['UseEditor']) && $_SESSION['UseEditor'] === true;
}

動態上傳目錄

if (isset($_SESSION['UseEditor'])) {
    switch ($_SESSION['UseEditor']) {
        case 'Addr1': $baseUrl = '/addr1/uploadfile/'; break;
        case 'Addr2': $baseUrl = '/addr2/upfiles/'; break;
        default: $baseUrl = '/upfiles/';
    }
} else {
    $baseUrl = '/upfiles/';
}

4. 解決中文文件名亂碼

修改 core/connector/php/php5/CommandHandler/FileUpload.php：

$sUnsafeFileName = CKFinder_Connector_Utils_FileSystem::convertToFilesystemEncoding(
    CKFinder_Connector_Utils_Misc::mbBasename($uploadedFile['name'])
);
// 新增：按時間戳重命名
$sExtension = CKFinder_Connector_Utils_FileSystem::getExtension($sUnsafeFileName);
$sUnsafeFileName = date('YmdHis') . '.' . $sExtension;

5. 綁定 CKFinder 到 CKEditor

require_once ROOT_PATH . 'ckeditor/ckeditor.php';
require_once ROOT_PATH . 'ckfinder/ckfinder.php';

$CKEditor = new CKEditor();
$CKEditor->basePath = '/ckeditor/';
CKFinder::SetupCKEditor($CKEditor, '/ckfinder/');  // 相對站點根目錄

echo $CKEditor->editor('content', $rs['contents']);

安全加固清單

1. 嚴格認證：CheckAuthentication 必須驗證用戶身份與權限，不可直接 return true。
2. 文件類型白名單：配置 $config['AllowedExtensions'] 限制上傳後綴。
3. 目錄權限：上傳目錄設置 755，禁止腳本執行（Nginx/Apache 配置 php_flag engine off）。
4. 文件名安全：強制重命名，避免覆蓋與路徑遍歷攻擊。
5. HTTPS 強制：生產環境全站 HTTPS，防止上傳數據劫持。

整合後可實現圖片上傳、文件管理、圖片瀏覽器一站式體驗，適合 CMS、後台管理系統等場景。