FCKEditor实现在线编辑器

 

fckconfig.js为fckeditor的主配置文件

FCKConfig.CustomConfigurationsPath = FCKConfig.EditorPath+'myconfig.js' ;   //指定用户自定义配置的配置文件myconfig.js，注意：通常将此文件放在fckeditor/editor/路径下

FCKConfig.ToolbarSets["工具栏自定义模式的名称"]=[　　　　　　　　　//配置工具栏中需要用到的工具列表，默认的只有Default和Basic两种样式，用户可以根据需要来增减所需工具
    ['Form','Checkbox','Radio','TextField','Textarea','Select','Button','ImageButton','HiddenField'],
    '/',
    ['Bold','Italic','Underline','StrikeThrough','-','Subscript','Superscript'],
    '/',
    ['Style','FontFormat','FontName','FontSize'],
    ['TextColor','BGColor'],
    ['FitWindow','ShowBlocks','-','About']        // No comma for the last row.
] ;

FCKConfig.FontNames='宋体;黑体;幼圆;楷体_GB2312;仿宋_GB2312;Arial;Comic Sans MS;Courier New;Tahoma;Times New Roman' ;　　//指定编辑器的字体

FCKConfig.EnterMode = 'p' ;            // p | div | br     //修改敲enter和shift+enter时的输入模式
FCKConfig.ShiftEnterMode = 'br' ;

FCKConfig.EditorAreaCSS = FCKConfig.BasePath + 'css/fck_editorarea.css' ;  　　//指定编辑区的样式文件

/**************************表情文件设置begin******************************/

FCKConfig.SmileyPath    = FCKConfig.BasePath + 'images/smiley/msn/' ;   //表情源文件（图片）路径设置
FCKConfig.SmileyImages    = 　　　　　　　['regular_smile.gif','sad_smile.gif','wink_smile.gif','teeth_smile.gif','confused_smile.gif','tounge_smile.gif','embaressed_smile.gif','omg_smile.gif','whatchutalkingabout_smile.gif','angry_smile.gif','angel_smile.gif','shades_smile.gif','devil_smile.gif','cry_smile.gif','lightbulb.gif','thumbs_down.gif','thumbs_up.gif','heart.gif','broken_heart.gif','kiss.gif','envelope.gif'] ;　　　　　　　　　　　　　　//表情图片文件名
FCKConfig.SmileyColumns = 8 ;
FCKConfig.SmileyWindowWidth        = 320 ;
FCKConfig.SmileyWindowHeight    = 210 ;

/**************************表情文件设置end******************************/

 上传中文文件名乱码的问题解决

需要修改源码，把转换器ConnectorServlet.java的代码拷贝出来设置一下编码方式为utf-8，在web.xml中把转换器配置成自己修改后的ConnectorServlet文件即可

创建中文的文件夹名乱码的问题解决

同样需要修改源码ConnectorServlet.java的doGet方法，在获取文件夹名的那一步，对文件夹名重新编码，代码示例如下
String tempStr=request.getParameter("NewFolderName");

tempStr=new String(tempStr.getBytes("iso8859-1"),"UTF-8")   //对于get方式从网页传输的中文数据都需要这样的处理来转换成中文解决乱码问题

String newFolder=UtilsFile.sanitizeFolderName(tempStr)

上传中文名图片不能正常显示的解决方法

方法一：

修改tomcat服务器config目录下server.xml中的如下代码（添加：URIEncoding="UTF-8"）

注意：不推荐使用，因为get方式传递参数默认用iso8859-1来解析，服务器配置修改之后就用utf-8来解析了，这样可能会对引起乱码问题。例如：此时如果创建中文文件夹的话就会引起再一次的乱码

 方法二：

在保存图片之前修改图片名，避免出现中文图片名的情况。例如：

 通过UUID来给图片重命名

或者：（用当前时间来命名）

　　　String nameWithoutExt = getNameWithoutExtension(fileName);
        String ext = getExtension(fileName);
        Date dt = new Date(System.currentTimeMillis());
        SimpleDateFormat fmt = new SimpleDateFormat("yyyyMMddHHmmssSSS");
        fileName = fmt.format(dt) + "." + ext;

 配置允许上传的图片类型

第一步（修改客户端）
在fckconfig.js中修改
FCKConfig.CustomConfigurationsPath = FCKConfig.EditorPath+'myconfig.js' ;

在myconfig.js中添加
FCKConfig.ImageUploadAllowedExtensions    = ".(jpg|gif|jpeg|png|bmp|自定义允许的文件扩展名)$" ;      

 第二部（修改服务端）
新建 fckeditor.properties (同样的配置覆盖default.properties中的)

添加

connector.userActionImpl=net.fckeditor.requestcycle.impl.UserActionImpl
connector.resourceType.image.extensions.allowed=jpg|gif|jpeg|png|bmp|自定义允许的文件扩展名

 修改源码限制上传文件的大小
例如：限制大小小于10k

服务器端修改ConnectorServlet.java

客户端修改

editor\dialog\fck_image\fck_image.js 添加阴影部分的内容

 

switch ( errorNumber )
    {
        case 0 :    // No errors
            alert( 'Your file has been successfully uploaded' ) ;
            break ;
        case 1 :    // Custom error
            alert( customMsg ) ;
            return ;
        case 101 :    // Custom warning
            alert( customMsg ) ;
            break ;
        case 201 :
            alert( 'A file with the same name is already available. The uploaded file has been renamed to "' + fileName + '"' ) ;
            break ;
        case 202 :
            alert( 'Invalid file type' ) ;
            return ;
        case 203 :
            alert( "Security error. You probably don't have enough permissions to upload. Please check your server." ) ;
            return ;
        case 500 :
            alert( 'The connector is disabled' ) ;
            break ;
　　　　 case 204: 
　　　　　　　alert( '文件大小超过限制' ) ;
　　　　　　　break ;
        default :
            alert( 'Error on file upload. Error number: ' + errorNumber ) ;
            return ;
    }

 

去掉上传文件对话框中“浏览服务器”的按钮
找出此按钮所在的文件，注释掉