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;