FCKeditor 2.2 + ASP.NET 2.0 实现攻略

一、前言

    最近一直在找asp.net2.0环境下的开源的htm文本编辑器，以扩充asp.net站点的文字录入能力，终于找到了一款网上大家都在讨论的FCKeditor。官方网站下载了一份后，用起来非常不方便，网上找了不少资料，费了很大劲才能用。特将经验总结一下，方便后来者！它支持多种语言，我这里只介绍asp.net2.0环境下的实现。

 二、准备工作

    FCKeditor包括了编辑器（FCKeditor的编辑器内核，一些支持文件js,xml等）和asp.net引用组件（一个dll）两部分。首先下载最新版的FCKeditor V2.3.2 编辑器，下载地址：http://sourceforge.net/project/showfiles.php?group_id=75348&package_id=75845；这个压缩包里并不包含ASP.NET要用到的DLL控件，所以还要下载另外一个压缩包，FCKeditor.net V2.2下载地址：http://sourceforge.net/project/showfiles.php?group_id=75348&package_id=137125 。把第一个文件解压到我们的asp.net2.0的web项目的根目录（也可以放在别处，今后设置同步即可），默认文件夹名为：FCKeditor；再把第二个包解压，里面包含了源代码，它是asp.net1.0的，需要用vs2005重新编译。（如果觉得其功能不够完善，也可以在此基础上二次开发哦）。生成的FredCK.FCKeditorV2.DLL供我们在我们的asp.net2.0的web项目引用。

 三、精简FCKeditorV2文件 （可以跳过）

    因为只用到ASP.NET，所以有必要精简一下文件。

　　进入FCKeditor文件夹，把所有“_”开头的文件和文件夹删掉，这些都是一些范例，只保留editor文件夹、fckconfig.js、fckeditor.js、fckstyles.xml、fcktemplates.xml就可以了；

　　进入editor文件夹，删掉“_source”文件夹，里面放的同样是源文件；

　　退回上一级目录进入filemanager文件夹，有browser和upload两个文件夹。进入browser/default/connectors，只保留aspx文件夹，其余的删掉；upload也一样，只保留aspx文件夹；

　　lang里面放的是语言包，如果只是用简体中文，那么只保留en.js（英文）、zh-cn.js两个文件就行了。

　　再退出lang文件夹，进入skins文件夹，可以将多余的皮肤主题删除，看你自己的喜好。

至此，文件精简完毕。

 四、修改FCKeditorV2配置

         打开位于根目录的fckconfig.js文件。几个主要设置如下，其他设置自己可以慢慢摸索

FCKConfig.DefaultLanguage = 'en' ;设置默认语言，把en改成zh-cn，即简体中文；

FCKConfig.SkinPath = FCKConfig.BasePath + 'skins/default/' ;这行是设置皮肤的，默认就不用管它了；

FCKConfig.TabSpaces = 0;如果在编辑过程中要用到TAB键，就把0改成1；

var _FileBrowserLanguage    = 'asp' ;      // asp | aspx | cfm | lasso | perl | php | py 默认编程语言，改为aspx

var _QuickUploadLanguage  = 'asp' ;      // asp | aspx | cfm | lasso | php 默认编程语言，改为aspx

 五、Asp.net 2.0配置
Web. Config文件，修改appSettings元素，配置如下：

<appSettings>
  <add key="FCKeditor:BasePath" value="~/FCKeditor/"/>
  <add key="FCKeditor:UserFilesPath" value="/MyWeb/Upload" />
</appSettings>

         解释：FCKeditor:BasePath是编辑器内核所在的默认目录，设置了FCKeditor:BasePath后就不用再每次使用FCKeditor实例时指定BasePath属性了。FCKeditor:UserFilesPath则是指定我们所有上传的文件的所在目录。你也许会问为什么要设置成/ MyWeb/Upload这样而不是~/Upload（注：MyWeb为我们的web项目的默认的名称，Upload为根目录下存放上传文件的文件夹），因为FCKeditor使用这个值来返回你上传后的文件的相对路径到客户端，~/Upload的形式是ASP.NET在服务可以编译解释的，但是在客户端的静态就不懂这是什么了。如果使用~/Upload后，那么所有上传文件的返回路径都是~/Upload形式的，你就会得到这样的链接http://~/Upload/Image/logo.gif这样的链接解果就是路径为找到。所以才要我们上述那样设置，这是在开发阶段，如果在工程完成后发布时请记住把/MyWeb/Upload改成/Upload，道理不说大家也明白，开发阶段VS2005在运行项目时的URL是http://localhost/项目名称/的形式，发布后在Server上建立站点，跟路径就是http://www.abc.com/的形式了，所以发布后一定要改过来。

         注：如果部署到某一网站的某一目录下，则要把该目录名写上，如部署到http://www.abc.com/web1/下，且上传文件夹定义为myUp1，则要写成value="/web1/ myUp1"。

 六、Asp.net 2.0使用

         为了方便RAD开发，我们把FCKeditor控件也添加到VS的工具箱（Toolbox）上来，展开工具箱的常用标签组（General），右键选择组件（Choose Items…），在对话框上直接找到浏览按钮，定位FredCK.FCKeditorV2.dll，然后确认就可以了。

         这样，工具栏就多了个FCKeditor控件了，直接托拽使用。

         另外，确保aspx中@ Page中的 “validateRequest”置为false，不然当你发表的文章中含有链接或是其他HTML语句时，.NET会警告你有安全隐患而出错。（“AutoEventWireup”使用默认值即可）

         aspx中，FCKeditorV2控件还可以定义其语言、路径等属性，如<FCKeditorV2:FCKeditor ID="FCKeditor1" runat="server"  AutoDetectLanguage="false" DefaultLanguage="zh-cn" BasePath ="~/FCKeditor/">  </FCKeditorV2:FCKeditor>。Cs文件中，取空间的Value属性，可以得到编辑器中的htm代码。

七、错误原因汇总

控件处显示：HTTP Error 404 - Not Found.
         这个错误一般是BasePath没有设置正确，请参照上文在web.config中或者在FCKeditorV2控件的属性中设置。

 错误提示框：XML request error: Forbidden(403)
    原因在于没有配置UserFiles路径，或者路径配置用问题。此路径是需要htm解析的，所以不支持asp.net“~”，切记！   

错误提示框：XML request error: Forbidden(500).
    因为ASP.NET2.0新增了Theme功能，所以如果在你的工程中你对Web.config使用到styleSheetTheme或theme的话那就要再多修改一下。还是到FCKeditor所在的目录，分别打/editor/filemanager/upload/aspx/upload.aspx和/editor/filemanager/browser/default/connectors/aspx/connector.aspx两个aspx文件，在page标签中添加Theme=""或StyleSheetTheme=""如果theme中用到了*.skin，就加上Theme=""，如果用到了*.css，就加上StyleSheetTheme=""：
<%@ Page language="c#" Inherits="FredCK.FCKeditorV2.Uploader" AutoEventWireup="false" Theme="" %>
或
<%@ Page language="c#" Inherits="FredCK.FCKeditorV2.Uploader" AutoEventWireup="false"  Theme=""  StylesheetTheme="" %>
这样就解决了500的内部错误。（说明：Theme=""或StyleSheetTheme=""，里面是空值，不是你的那个theme！！！！）