当前位置: 主页 > 日志 > WEB UI >

用什么样的Web编辑器,eWebEditor,kindeditor还是FCKEditor?

// by redice 2009.11.5
// http://www.redicecn.cn

   我接触的第一个Web编辑器是eWebEditor。它是国产的,在IE7及以下的版本中效果是非常不错的,但它不兼容IE8及火狐,而且使用不当就会留下上传漏洞的隐患。这样的编辑器,还是不要用了(很想支持国产,但是...)

   放弃eWebEditor后,我选择了kindeditor。它是老外开发的,能兼容目前所有版本的浏览器,纯静态(文件上传需要自
己实现,小问题)。但是它不支持Word表格的复制(就是不能直接从Word上复制表格到编辑器中),而且会经常出现图文丢失的现象,郁闷,我还是不用了(老外的东西也不一定好,...)

   前段时间接触了FCKEditor,发现这个编辑器相当不错,查了一下,网上大家对它的评价超高(貌似淘宝也是用的这个编
辑器)。它也是老外开发的,能兼容目前所有版本的浏览器,对Word的支持非常好,复制表格没有一点变形。到目前为
止,我已经在两个项目中使用了这个编辑器,一个是基于PHP的订餐系统,另外一个是基于ASP的公司网站,FCKEditor对PHP,ASP以及ASP.NET的支持都很好,使用起来非常方便。


   编辑器的安全问题一直是一个令很多人头痛的问题,这主要在于文件上传上。各种编辑器默认情况下都没有对文件上传
进行身份认证(它也不可能实现一个通用的身份认证),开发者必须根据自己系统的情况加入适当的身份认证代码。另外
编辑器允许的文件上传类型也需要进行严格的限制,例如eWebEditor允许在后台修改上传文件类型,这样一旦歹徒获取后
台密码,即可轻易上传任意格式的文件。低版本的FCKEditor(好像是2.1以下的版本)默认情况下允许上传任意格式的文件。


   总结一下FCKEditor的使用(以2.6.5版为例):
   

(1)精简,"言多必失",文件多了也是一种隐患。FCKEditor支持多种服务器脚本语言,实际使用的时候我们根本用不了那么多文件,我们要根据自己的需要对其进行精简。  
  对于ASP系统来说:
  
  FCKEditor根目录,仅保留“fckeditor.asp,fckconfig.js,fckeditor.js,fckpackager.xml,fckstyles.xml,
fcktemplates.xml”这些文件以及editor目录。删除示例目录“_samples”。
  “fckeditoreditorfilemanagerconnectors”目录下面仅保留“asp”目录,删除其它目录和文件。

  对于PHP系统来说:
  
  FCKEditor根目录,仅保留“fckeditor.php,fckeditor_php4.php,fckeditor_php5.php,fckconfig.js,fckeditor.js,
fckpackager.xml,fckstyles.xml,fcktemplates.xml”这些文件以及editor目录。删除示例目录“_samples”。“fckeditoreditorfilemanagerconnectors”目录下面仅保留“php”目录,删除其它目录和文件。

(2)修改文件上传采用的脚本程序(语言)。

    默认的FCKEditor文件上传程序为asp,如果是用在asp系统中,那就不用再修改了。

    如果是用在PHP系统中的话,需要做如下修改,打开fckconfig.js    
    找到:
    var _FileBrowserLanguage = asp
    var _QuickUploadLanguage = asp    
    改成:
    var _FileBrowserLanguage = php
    var _QuickUploadLanguage = php

(3)开启文件上传,修改文件上传目录。

   对于ASP系统来说:
   打开fckeditoreditorfilemanagerconnectorsaspconfig.asp
   启用文件上传:

   找到:
   ConfigIsEnabled = false

   改成:
   ConfigIsEnabled = true

   设置上传存放目录:

   找到:
   ConfigUserFilesPath = "/admin/uppic/"
   改成:
   ConfigUserFilesPath = "自定义的路径"

   对于PHP系统来说:
   打开fckeditor/editor/filemanager/browser/default/connectors/php/config.php
   启用文件上传:

   找到:
   $Config[Enabled] = false

   改成:
   $Config[Enabled] = true

   设置上传存放目录:

   找到:
   $Config[UserFilesPath] = /userfiles/
   改成:
   $Config[UserFilesPath] = 自定义的路径

(4)修改上传文件命名方式。
    
   FCKEditor上传文件,文件名采用原文件名,如果想采用自定义的文件命名方式(比如,随即名称),可以修改如下地
方:
   
   对于ASP系统来说:
   打开fckeditorsampleediteditorfilemanagerconnectorsaspcommands.asp
   
   找到:
   sFileName = SanitizeFileName( sFileName )
   
   将该句改为自定义的文件命名格式,例如:

   dim RndStr
   Randomize
   RndStr = Cstr(Fix(9000*rnd()+1000)) 产生一个随机数
   sFileName =year(date)&month(Date)&day(Date)&hour(time)&minute(time)&second(time)&RndStr &"." & 
sExtension

   对于PHP系统来说:
   打开fckeditoreditoreditorfilemanagerconnectorsphpcommands.php

   找到:
   $sOriginalFileName = $sFileName ;
   
   在该句前面加入:

   // 初始化种子 
   $sstr =split(" ",microtime(),5); 
   $seed =$sstr[0]*10000;   
   // 使用种子初始化随机数发生器 
   srand($seed);   
   // 生成指定范围内的随机数 
   $random =rand(1000,10000);
   // 合成随即的文件名
   $sFileName = date("YmdHis", time()).$random.".".$sExtension;
 

(5)FCKEditor在程序中引用方式。
   
    对于ASP系统来说:
    需要包含下面的头文件
   <!--#include file="fckeditor/fckeditor.asp"-->
    在编辑器所在的位置添加如下代码:
        <%
        Dim oFCKeditor
        Set oFCKeditor = New FCKeditor
        oFCKeditor.BasePath = "/fckeditor/" 这个路径必须是相对于站点根目录的路径,设置错误编辑器
将无法显示
        
        oFCKeditor.ToolbarSet="Default"
        oFCKeditor.Width = "98%"
        oFCKeditor.Height= "500px"
        
        oFCKeditor.Value = "" 设置默认值
        oFCKeditor.Create "shangpin_description" 编辑器的id,相当于input标签的name属性值,这里是
shangpin_description
        %>

   对于PHP来说:
   在编辑器所在的位置添加如下代码:
        <?php 
        include("fckeditor/fckeditor.php"); // 头文件
        $oFCKeditor = new FCKeditor("shangpin_description") ; // 编辑器的id,相当于input标签的
name属性值,这里是shangpin_description
        $oFCKeditor->BasePath="/fckeditor/ " ; //设置FCKeditor路径 
        
        $oFCKeditor->ToolbarSet ="Default";
        $oFCKeditor->Width="98%";
        $oFCKeditor->Height="500px";
        
        $oFCKeditor->Value=""; // 设置默认值 
        $oFCKeditor->Create(); 
        ?>

(6)获取FCKEditor中的数据。

对于服务器端脚本程序来说,将“编辑器的id”当做input标签的name属性值来获取即可,例如:

在ASP中request("shangpin_description"),在PHP中$_REQUEST["shangpin_description"]

JS中用FCKeditorAPI.GetInstance(shangpin_description).GetXHTML(true)得到shangpin_description对应的值


附下载:

精简过的FCKEditor_2.6.5_ASP (身份认证在fckeditoreditorfilemanagerconnectorsaspupload.asp文件中,酌情修改...) 

FCKEditor_2.6.5_ASP
   
精简过的FCKEditor_2.6.5_PHP (身份认证在fckeditoreditorfilemanagerconnectorsphpupload.php文件中,酌情修改...)

FCKEditor_2.6.5_PHP

最后给自己做个广告:
大秦数据,http://www.91data.com ,专业的网站开发团队,超低的价格,超高的质量! “美观,易用,安全”是我们的开发标准!
联系方式: QQ:181697466 (注明:网站开发)


[日志信息]

该日志于 2009-11-05 15:17 由 redice 发表在 redice's Blog ,你除了可以发表评论外,还可以转载 “用什么样的Web编辑器,eWebEditor,kindeditor还是FCKEditor?” 日志到你的网站或博客,但是请保留源地址及作者信息,谢谢!!    (尊重他人劳动,你我共同努力)
   
验证(必填):   点击我更换验证码

redice's Blog  is powered by DedeCms |  Theme by Monkeii.Lee |  网站地图 |  本服务器由西安鲲之鹏网络信息技术有限公司友情提供

返回顶部