FCKeditor使用方法技术详解

1、概述

FCKeditor是目前最优秀的可见即可得网页编辑器之一，它采用JavaScript编写。具备功能强大、配置容易、跨浏览器、支持多种编程语言、开源等特点。它非常流行，互联网上很容易找到相关技术文档，国内许多WEB项目和大型网站均采用了FCKeditor（如百度，阿里巴巴）。本文将通过与PHP相结合，从基本安装到高级的配置循序渐进介绍给广大PHPer。

FCKeditor官方网站：http://www.fckeditor.net/

FCKeditor Wiki：http://wiki.fckeditor.net/

2、下载FCKeditor

登录FCKeditor官方站（http://www.fckeditor.net），点击网站右上角“Download”链接。

笔者编写本文时，FCKeditor当前最新的稳定版本是2.6.6，因此我们下载此版本的zip压缩格式文档。

FCKeditor 2.6.6版下载地址：

http://nchc.dl.sourceforge.net/project/fckeditor/FCKeditor/2.6.6/FCKeditor_2.6.6.zip

3、安装FCKeditor

解压“FCKeditor_2.6.6.zip”文档到您的网站目录下，我们先假定您存放FCKeditor和调用脚本存于同一个目录下。fckeditor目录包含FCKeditor2.4.3程序文件。check.php用于处理表单数据。add_article.php和add_article_js.html分别是PHP调用FCKeditor和JavaScript调用FCKeditor实例脚本文件。

3.1、用PHP调用FCKeditor

调用FCKeditor必须先载入FCKeditor类文件。具体代码如下。

<?php include("fckeditor/fckeditor_php5.php") ; // 用于载入FCKeditor类文件
  $oFCKeditor = new FCKeditor('content') ;  // 创建FCKeditor实例
?>

接下来，我们需要创建FCKeditor实例、指定FCKeditor存放路径和创建（显示）编辑器等。具体代码如下所示（代码一般放在表单内）。

<?php

$oFCKeditor = new FCKeditor('content') ; // 创建FCKeditor实例

$oFCKeditor->BasePath = './fckeditor/'; // 设置FCKeditor目录地址

$FCKeditor->Width='100%'; //设置显示宽度

$FCKeditor->Height='300px'; //设置显示高度的高度

$oFCKeditor->Create() ; // 创建编辑器

接下来以我的一个php例子来显示文本编辑器的调用.在表单中将<textarea name="content" id="" cols="30" rows="5"></textarea> 这段代码替换为

<?php include("fckeditor/fckeditor_php5.php") ; // 用于载入FCKeditor类文件
        $oFCKeditor = new FCKeditor('content') ;  // 创建FCKeditor实例
        $oFCKeditor->BasePath = 'fckeditor/';        // 设置FCKeditor目录地址为当前目录下的fckeditor目录
        $oFCKeditor->Width='95%';                //设置显示宽度
        $oFCKeditor->Height='400px';               //设置显示高度的高度
        $oFCKeditor->Value=$row['content'];
        $oFCKeditor->Create() ;                    // 创建编辑器      
?>

截图显示为如下：

说明：一个FCKeditor编辑器实例和普通的表单控件一样，也具有name属性和value属性，上例中编辑器的name属性为content，是通过new FCKeditor('content')设置的，value属性值为$row['content'],是通过$oFCKeditor->Value属性来设置的。

因此，要获取该编辑器里面的内容，可以用$content = $_POST["content"]来获取，要在该编辑器中显示内容，可以通过$oFCKeditor->Value=$row['content']来实现。

4、配置上传文件浏览功能

4.1、配置上传浏览功能

FCKeditor编辑器内置了文件管理功能，使得用户能够上传图像或文件，他的文件管理程序放在“editor/filemanager/”目录下，FCKeditor提供文件浏览和文件快速上传功能。

要使您的FCKeditor能够使用上传功能，您必须进行以下配制。

注意：FCKeditor2.6.6 不支持虚拟目录，您的路径设置都是针对网站根目录的绝对路径而言的。这点对于发布到远程网站目录的开发者极为不便，后面我们会对此进行讨论。

一、打开fckeditoreditorfilemanagerconnectorsphpconfig.php，找到代码$Config['Enabled']，将值设置为true。

$Config['Enabled'] = true;  //将false改为true，表示允许上传

二、接下来几行，设置$Config['UserFilesPath']，设置上传路径。

$Config['UserFilesPath'] = 'upfiles/';  //定义上传目录

三、打开fckeditorfckconfig.js文件，找到代码_FileBrowserLanguage ，将值设置为php。接下来一行，把 _QuickUploadLanguage 值也设置为php。

var  _FileBrowserLanguage  =  'php';
var  _QuickUploadLanguage =  'php';

至此，Apache服务器已经能正常上传文件。

4.2、上传文件自动生成随机文件名（配置对上传文件进行重命名）

如果要上传的文件名中存在中文字符，则会出现乱码问题，导致引用文件的URL不对，解决这个问题的办法是将所有上传的文件名重命名。下面介绍实现方法

打开fckeditoreditorfilemanagerconnectorsphpIo.php，这个文件里有一个函数名叫

function SanitizeFileName( $sNewFileName ),这个函数原来的功能是清理掉文件名的非法字符，以阻止一些可能发生的问题。将函数代码修改为：

function SanitizeFileName( $sNewFileName )
{
    $arr = explode('.',$sNewFileName);
    $ext = array_pop($arr);         //第一个数组元素保存了. 前的文件名
    $filename = date('Ymd_His_').rand(1000,9999).'.'.$ext;
    return $filename ;
}

SanitizeFileName 函数的功能是将上传文件的文件名重命名，新的文件名按照日期时间随机数的格式命名，即可防止修改后的文件重名，又可以防止新的文件名中出现中文字符。

4.3 、关于上传文件浏览安全性问题

为了解决FCKeditor不支持虚拟目录问题，和FCKeditor文件上传的安全性考良。我们有必要在这里单论对此进行讨论。

     打开fckeditoreditorfilemanageruploadphpconfig.php，找到$Config['UserFilesPath']代码，在此行代码之前定义变量$root_path = $_SERVER['PHP_SELF'];

     重新设置$Config['UserFilesPath']变量的值，示例如下。

$Config['UserFilesPath'] = $root_path . '您想上传的目录名/' ;

     打开fckeditoreditorfilemanagerrowserdefaultconnectorsphpconfig.php，找到代码$Config['UserFilesPath'],在此行代码之前定义变量$root_path = $_SERVER['PHP_SELF'];

     重新设置$Config['UserFilesPath']变量的值，示例如下。

$Config['UserFilesPath'] = $root_path . '您想浏览的目录名/'

     至此，您的FCKeditor已解决不支持虚拟目录问题。接下来，我们介绍一种技巧配置只允许管理员才可以使用FCKeditor上传问题。

     解决方法其实很简单，假如网站采用$_SESSION['admin_id']验证管理员的登录id，您只需将相关的脚本文件引入即可。然后使用下面的代码配置文件上传浏览开关。

$Config['Enabled'] = isset($_SESSION['admin_id']);

这样，当用户未登陆的时，isset函数将返回false;