CKFinder(php版)的使用,以及与现有的CKEditor的集成

    技术2022-05-20  40

    第一部分:先决条件

    1,首先确认,已安装了apache和php,并整合了apache和php和tomcat。

    2,在apache中创建虚拟目录

    如在apache配置文件httpd.conf中加上一个虚拟目录

     

    ############################

    #为文件资源存放 虚拟目录

    Alias /assets "e:/assets"

    <Directory "e:/assets">

        Options Indexes FollowSymLinks MultiViews IncludesNoExec

        AddOutputFilter Includes html

        AllowOverride None

        order allow,deny

        Allow from all

    </Directory>

    3,确认已经集成了CKEditor到项目中了。

     

     

    第二部分:搭建单独的CKFinder(php版)

    1,在官网上下载php版的CKFinder,将ckfinder文件夹拷贝到任何apache可以访问到的虚拟目录对应的硬盘路径,是其包含的php文件可以被访问到。

    2,创建一个资源文件夹用以存放我们上传的资源。(确保此文件夹是可写的,此例我们是e:/assets文件件,其虚拟路径是/assets)

    3,编辑ckfinder下的config.php配置文件

    首先找到

    function CheckAuthentication()

    { return true; //此处改为true,这是一个权限验证的函数

     

    然后编辑baseUrl,这是ckfinder掌管的资源的url地址,看下面的例子

    $baseUrl = 'http://example.com/ckfinder/files/'; //绝对URL $baseUrl = '/userfiles/'; //相对URL 本例,我们配置成绝对URL ‘ http://localhost/assets/’

     

     

    最后编辑baseDir,这是文件实际存放在硬盘上的地址。

    $baseDir = 'e:/assets/'; 最后说一下baseUrl和baseDir我建议分别写成绝对URL和绝对路径。 baseUrl会在查看图片时使用到,它必须对应是服务器对外公布的一个虚拟目录,因为只有向web公布了的才是URL(资源访问路径),才可以通过浏览器访问到。 baseDir也要和这个URL地址保持一致。 通过http://localhost/assets/ckfinder/_samples/php/standalone.php 可以来检查ckfinder是否发布成功 本例因为解压得到的ckfinder文件在assets内所以访问路径是这个。 第三部分:整合CKFinder和CKEditor(以js的形式) 拷贝ckfinder下的ckfinder.js到项目并引入到页面。 页面写入以下js代码替换原来的CKEditor生成代码 $(window).load( function(){ var editor = CKEDITOR.replace( 'editor' ); //editor就是要替换的元素 CKFinder.setupCKEditor( editor, 'http://localhost/assets/ckfinder/');  //'http://localhost/assets/ckfinder/'就是解压到assets虚拟目录下的ckfinder文件的URL } );

     

     

    注:如果.setupCKEditor的第一个参数为null则默认,将集成页面上的所有CKEditor

     

    现在你可以试试原来的CKEditor有什么变化了。

     


    最新回复(0)