CKEditor5--食用方式

我想我当初一定是脑子抽了才会选择CKEditor5的 , 再简洁好看的UI , 也不值得我踩的这些坑.

前方高能预警
CKEditor5的官方文档并没有给出较全的文档,并且谷歌百度资料较少,多是英文,要想自定义或是修改什么东西比较困难,不推荐用.

食用方式:
html:
<textarea name="content" id="editor"></textarea>

js:

//加载文件,记得自定义路径哦
<script src="__PUBLIC__/Vendor/ckeditor5/ckeditor.js"></script>
<script src="__PUBLIC__/Vendor/ckfinder/ckfinder.js"></script>
<script src="__PUBLIC__/Vendor/ckeditor5/zh-cn.js"></script>
<script>
    $(function () {
        ClassicEditor
            .create( document.querySelector( '#editor' ) ,{
                language: 'zh-cn', //设置中文
                ckfinder: {  //上传文件
                    uploadUrl: '/Public/Vendor/ckfinder/core/connector/php/connector.php?command=QuickUpload&type=Files&responseType=json',
                }
            })
    .catch( error => {
            console.error( error );
    } )
    })
</script>

到这一步ueditor的界面应该已经唤起成功,但是看代码会发现,上传文件需要用ckfinder,并且还需要在config.php中进行各种配置

我解决的方法是:

error_reporting(E_ALL & ~E_DEPRECATED & ~E_STRICT);
ini_set('display_errors', 0);
session_start();  //添加这一行代码

//将authentication更改为以下代码
$config['authentication'] = function () {
    if (!$_SESSION['user']) {
        return 0;
    }

    return 1;
};

上传文件夹的更改:

$config['backends'][] = array(
    'name'         => 'default',
    'adapter'      => 'local',
    'baseUrl'      => '/Uploads/',  //这里更改
//  'root'         => '', // Can be used to explicitly set the CKFinder user files directory.
    'chmodFiles'   => 0777,
    'chmodFolders' => 0755,
    'filesystemEncoding' => 'UTF-8',
);

上传文件重命名:
\ckfinder\core\connector\php\vendor\cksource\ckfinder\src\CKSource\CKFinder\Command\FileUpload.php
在这个文件中找到$fileName = $uploadedFile->getFilename(); 这就是拿到文件原命名的代码了,找到这行代码,我们就可以按自己的规则给他命名了.

        $fileName = $uploadedFile->getFilename();

        //文件重命名
        $ext = substr(strrchr($fileName, '.'), 1);
        $fileName = $_SESSION['user']['uid'].'_'.time().'.'.$ext;

CKEditor5--食用方式

推荐阅读更多精彩内容