PHP ckeditor富文本编辑器结合ckfinder实现图片上传功能

一：前端页面代码

<script src="/www/res/ckeditor/ckeditor.js"></script>
<textarea id="articlecontent" ><?php echo $request[\'content\']; ?></textarea>
<script type="text/javascript">
    $(\'#articlecontent\').ckeditor({
       customConfig : \'config_user.js\'
    });
</script>

其中上面的config_user.js是用户自定义配置文件，内容如下：

CKEDITOR.editorConfig = function( config ) {
    // The toolbar groups arrangement, optimized for two toolbar rows.
    config.toolbarGroups = [
        { name: \'clipboard\',   groups: [ \'clipboard\', \'undo\' ] },
        { name: \'editing\',     groups: [ \'find\', \'selection\', \'spellchecker\' ] },
        { name: \'links\' },
        { name: \'insert\' },
        { name: \'forms\' },
        { name: \'tools\' },
        { name: \'document\',       groups: [ \'mode\', \'document\', \'doctools\' ] },
        { name: \'others\' },
        { name: \'basicstyles\', groups: [ \'basicstyles\', \'cleanup\' ] },
        { name: \'paragraph\',   groups: [ \'list\', \'indent\', \'blocks\', \'align\', \'bidi\' ] },
        { name: \'styles\' },
        { name: \'colors\' },
        { name: \'about\' }
    ];

    // Remove some buttons provided by the standard plugins, which are
    // not needed in the Standard(s) toolbar.
    config.removeButtons = \'Underline,Subscript,Superscript\';

    // Set the most common block elements.
    config.format_tags = \'p;h1;h2;h3;pre\';

    // Simplify the dialog windows.
    config.removeDialogTabs = \'image:advanced;link:advanced\';

    //自定义配置
    //config.配置项 = 值
    config.width = 800;
    config.height = 300;
    config.uiColor = "#aabbcc";

    //文件的上传管理：加载CKfinder  注意文件路径为网站根目录 使用时，注意ckfinder文件安装路径
    config.filebrowserBrowseUrl      = \'/www/res/ckfinder/ckfinder.html\';    
    config.filebrowserImageBrowseUrl = \'/www/res/ckfinder/ckfinder.html?Type=Images\';    
    config.filebrowserFlashBrowseUrl = \'/www/res/ckfinder/ckfinder.html?Type=Flash\';    
    config.filebrowserUploadUrl      = \'/www/res/ckfinder/core/connector/php/connector.php?command=QuickUpload&type=Files\';    
    config.filebrowserImageUploadUrl = \'/www/res/ckfinder/core/connector/php/connector.php?command=QuickUpload&type=Images\';    
    config.filebrowserFlashUploadUrl = \'/www/res/ckfinder/core/connector/php/connector.php?command=QuickUpload&type=Flash\';

};

二：ckeditor文件安装，

注意因为在ckeditor中已经自定义了配置文件，注意里面配置的与ckfinder文件的相对位置

三：ckfinder文件安装

需要配置上传文件的保存路径，在ckfinder文件夹下的config.php文件中修改

$baseUrl = \'http://www.example.com/www/articlesuploads/\';

设置文件的保存路径