FCKeditor文件上传配置

FCKeditor编辑功能的使用

1 、下载并解压FCKeditor放于WebRoot目录下
2、在使用页面引入fckeditor目录下的fckeditor.js

 <script type="text/javascript" src="./fckeditor/fckeditor.js"></script>

使用如下代码调用显示

                        <script type="text/javascript">
                            window.onload = function() {
                                var onFCKeditor = new FCKeditor("content");     
                                //创建对象（参数为要替代的textarea标签的名字）
                                onFCKeditor.BasePath = '../../fckeditor/';      
                                //指定路径最后面，注：必须加'/'
                                onFCKeditor.Height = 200;                       
                                onFCKeditor.ToolbarSet = 'Basic';               
                                //基本功能用Basic；默认用Default
                                onFCKeditor.ReplaceTextarea();                  
                                //创建编辑器
                            }
                        </script>
                        <textarea rows="10" cols="80" name="content">${gb.content}</textarea>

3、指定自定义配置文件：
创建myconfig.js放于fckeditor目录下，修改该目录下的FCKConfig.CustomConfigurationsPath的配置（即：引入自定义配置文件）如下：

FCKConfig.CustomConfigurationsPath =FCKConfig.EditorPath+'myconfig.js';
//alert(FCKConfig.BasePath); 打印FCKConfig.BasePath的值(代表editor目录)

myconfig.js的内容如下（此处的配置会自动覆盖fckconfig.js中的默认配置）：

//设置自定义toolbar的功能（配置可以参考fckconfig.js的内容）
FCKConfig.ToolbarSets["HLTools"] = [
    ['Source','DocProps','-','Save','NewPage','Preview','-','Templates'],
    ['Bold','Italic','Underline','StrikeThrough'],
    ['OrderedList','UnorderedList','-','Outdent','Indent'],
    ['JustifyLeft','JustifyCenter','JustifyRight','JustifyFull'],
    ['Link','Unlink','Anchor'],
    ['Image','Flash','Table','Rule','Smiley','SpecialChar','PageBreak'],
    '/',
    ['Style','FontFormat','FontName','FontSize'],
    ['TextColor','BGColor'],
    ['FitWindow','-','About']
] ;


FCKConfig.ToolbarSets["Basic2"] = [
    ['Source'],
    ['Bold','Italic','Underline'],
    ['OrderedList','UnorderedList'],
    ['JustifyLeft','JustifyCenter','JustifyRight','JustifyFull'],
    ['Link','Unlink','Anchor'],
    ['Image','Flash','Table','Rule','Smiley','SpecialChar','PageBreak'],
    '/',
    ['FontName','FontSize'],
    ['TextColor','BGColor'],
    ['FitWindow']
] ;



//默认情况下enter键表示产生新的段落，shift+enter表示换行
//这里更换快捷方式enter表示换行,shift+enter表示新的段落
FCKConfig.EnterMode = 'br' ;            // p | div | br
FCKConfig.ShiftEnterMode = 'p' ;    // p | div | br

//设置自定义的字体类型
//FCKConfig.FontNames       = 'Arial;Comic Sans MS;Courier New;Tahoma;Times New Roman;Verdana' ;
FCKConfig.FontNames  = '宋体;楷体_GB2312;黑体;隶书;Times New Roman;Arial';

//配置自定义的表情文件库
FCKConfig.SmileyPath    = FCKConfig.BasePath + 'images/myimg/' ;
FCKConfig.SmileyImages  = ['0.gif','1.gif','2.gif','3.gif','4.gif','5.gif','6.gif','7.gif','8.gif','9.gif','10.gif','11.gif','12.gif','13.gif','14.gif','15.gif','16.gif','17.gif','18.gif','19.gif','20.gif'] ;
FCKConfig.SmileyColumns = 5 ;
FCKConfig.SmileyWindowWidth     = 700;
FCKConfig.SmileyWindowHeight    = 400 ;

4、用过js获取编辑器的内容

<script type="text/javascript" language="javascript">

    function a()

    {

            //得到控件的html

             var checkContent =FCKeditorAPI.GetInstance("FCKeditor1").GetXHTML();

            alert(checkContent);

            //得到html的长度

             var len = FCKeditorAPI.GetInstance("FCKeditor1").GetXHTML().length;

            alert(len);

            //得到fck控件

            var oEditor = FCKeditorAPI.GetInstance('FCKeditor1');

            //得到编辑器中的文字

            var text = oEditor.EditorDocument.body.innerText;

            alert(text);

            //让编辑器得到焦点

            oEditor.Focus();



    }

    </script>

文件上传功能的使用

1、在web.xml中配置上传文件所使用的类（）的servlet映射

    <!--FCKeditor上文功能配置 -->
    <servlet>
        <servlet-name>Connector</servlet-name>
        <servlet-class>net.fckeditor.connector.ConnectorServlet</servlet-class>
        <load-on-startup>1</load-on-startup>
    </servlet>
    <servlet-mapping>
        <servlet-name>Connector</servlet-name>
        <url-pattern>/fckeditor/editor/filemanager/connectors/*</url-pattern>
    </servlet-mapping>

2、创建配置文件fckeditor.properties放于ClassPath目录，即src文件夹下。
文件内容为：
connector.userActionImpl = net.fckeditor.requestcycle.impl.UserActionImpl

3、配置自定义文件上传路径，直接在fckeditor.properties文件中加入如下配置(下面为相对路径）：
connector.userFilesPath=/upload/fckFile
connector.userFilesAbsolutePath =/upload/fckFile

4、加载上传文件所需要的jar包，commons-fileupload-1.3.1.jar、commons-io-2.4.jar、imageinfo-1.9.jar、java-core-2.6.jar、slf4j-api-1.5.8.jar和slf4j-simple-1.5.8.jar

5、解决上传问价中文乱码问题：
将tomcat中server.xml测Connector配置中加入对对请求路径编码的配置 URIEncoding=”UTF-8”

    <Connector port="8089" protocol="HTTP/1.1" connectionTimeout="20000" redirectPort="8443" URIEncoding="UTF-8"/>

FCKeditor瘦身步骤

1、将FCKeditor目录下及子目录下所有以”_”下划线开头的文件夹删除

2.FCKeditor根目录下只保留fckconfig.js, fckeditor.js, fckstyles.xml, fcktemplates.xml其余全部删除

3.将editor/filemanager/upload目录下文件及文件夹清空.

4.还可以将editor/skins目录下的皮肤文件删除，只留下default一套皮肤（如果你不需要换皮肤的话）

5.还可以将editor/lang目录下文件删除，只保留en.js, fcklanguagemanager.js, zh-cn.js, zh.js文件

6.如果你是使用javascrīpt来调用加载FCKeditor，那就不需要在web.xml中配置fckeditor的tag文件。