FCKeditor

[align=left][/align]   今天对FCKeditor好好的研究了一下！之前没有用过，遇到了一定的麻烦，现在拿出来和大家分享，希望对你也会有所帮助! 

   FCKeditor是个国外的多语言编辑器，你可以对其配置文件进行简单修改使之支持目前常用Web开发语言的应用，下面我就讲讲FCKeditor2.6.6版本的具体配置过程，有不足和出错的地方，欢迎指正，具体的FCK还请到官网去下载，我也是下载过来的。 

1.把FCKeditor真个文件夹考入WebRoot下: 
打开fckconfig.js找到FCKConfig.AutoDetectLanguage = true ;此句作用为自动检测语言，默认为true，即表示编辑器会根据系统语言自动检测加载相应的语言，我们将其改为false，不让其检测，然后 将FCKConfig.DefaultLanguage = 'en';改为简体中文"zh-cn"。 

2.配置字体，因为此编辑器为外国人编写，所以默认不提供中文字体，我们为其加入，找到FCKConfig.FontNames（第142行）加入“宋体;楷体_GB2312;新宋体;黑体;隶书;幼圆;”其他字体可根据自己需要自行加入。 

3.当然我们也可以自行定义配置文件，就不需要大幅改动fckconfig.js,我们在 
在FCKeditor文件夹中建立myconfig.js文件，内容自定义： 

// 1. 自定义 ToolbarSet 
FCKConfig.ToolbarSets["simple"] = [ 
['Bold','Italic','Underline'], 
['Link','Unlink'], 
['Image','Smiley','SpecialChar'], 
['FontName'], 
['FontSize'], 
['TextColor','BGColor'], 
] ; 

FCKConfig.ToolbarSets["bbs"] = [ 
['NewPage','RemoveFormat'], 
['Bold','Italic','Underline'], 
['Subscript','Superscript'], 
['JustifyLeft','JustifyCenter','JustifyRight'], 
['Link','Unlink'], 
['Image','Smiley','SpecialChar'], 
['Table'], 
['OrderedList','UnorderedList','-','Outdent','Indent'], 
['FontName'], 
['FontSize'], 
['TextColor','BGColor'], 
['FitWindow'] 
] ; 

FCKConfig.ToolbarSets["admin"] = [ 
['Source','DocProps','-','Save','NewPage','Preview','-','Templates'], 
['Cut','Copy','Paste','PasteText','PasteWord','-','Print','SpellCheck'], 
['Undo','Redo','-','Find','Replace','-','SelectAll','RemoveFormat'], 
['Bold','Italic','Underline','StrikeThrough','-','Subscript','Superscript'], 
['OrderedList','UnorderedList','-','Outdent','Indent','Blockquote','CreateDiv'], 
['JustifyLeft','JustifyCenter','JustifyRight','JustifyFull'], 
['Form','Checkbox','Radio','TextField','Textarea','Select','Button','ImageButton','HiddenField'], 
['Link','Unlink','Anchor'], 
['Image','Flash','Table','Rule','Smiley','SpecialChar','PageBreak'], 
['Style','FontFormat','FontName','FontSize'], 
['TextColor','BGColor'], 
['FitWindow','ShowBlocks','-','About'] // No comma for the last row. 
] ; 

// 是否开启简单功能与高级功能显示 
if(typeof(FCKConfig.EnableAdvanceTable) == "undefined"){ // 在页面中调用fckeditor时指定的 EnableAdvanceTable 的值会先被调用。 
FCKConfig.EnableAdvanceTable = false; // 默认为true 
} 
FCKConfig.AdvanceTableNum = 0; 
FCKConfig.AdvanceTable = [1,3,7,8,9,12]; 

// 2. 添加中文字体 
FCKConfig.FontNames ='宋体;黑体;幼圆;楷体_GB2312;仿宋_GB2312;Arial;Times New Roman;Verdana'  ; 
FCKConfig.FontSizes     ='9/最小;12/较小;16/中等;20/较大;24/最大'; 

// 3. 修改 "回车" 和 "shift + 回车" 的样式 
FCKConfig.EnterMode = 'br' ; // p | div | br 
FCKConfig.ShiftEnterMode = 'p' ; // p | div | br 

// 4. 更换表情图片 
FCKConfig.SmileyPath = FCKConfig.BasePath + 'images/smiley/wangwang/' ; // 表情图片所在的文件夹 
// 列出表情图片的文件名 
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','21.gif','22.gif','23.gif','24.gif','25.gif','26.gif','27.gif','28.gif','29.gif','30.gif','31.gif','32.gif','33.gif','34.gif','35.gif','36.gif','37.gif','38.gif','39.gif','40.gif','41.gif','42.gif','43.gif','44.gif','45.gif','46.gif','47.gif','48.gif','49.gif','50.gif','51.gif','52.gif','53.gif','54.gif','55.gif'] ; 
FCKConfig.SmileyColumns = 8 ; 
FCKConfig.SmileyWindowWidth = 668 ; 
FCKConfig.SmileyWindowHeight = 480 ; 

// 5. 设置允许上传的图片类型的扩展名列表 
FCKConfig.ImageUploadAllowedExtensions = ".(jpg|gif|png|dmp)$" ; // empty for all 

// 其它需要修改的配置 ... 
FCKConfig.LinkDlgHideTarget = true; // false ; 
FCKConfig.LinkDlgHideAdvanced = true; // false ; 

FCKConfig.ImageDlgHideLink = true; // false ; 
FCKConfig.ImageDlgHideAdvanced = true; // false 
FCKConfig.AutoDetectPasteFromWord = false; 

FCKConfig.LinkUpload = false; 


4.将fckconfig.js中的改为FCKConfig.CustomConfigurationsPath = FCKConfig.EditorPath + "myconfig.js" ;这样就能引用我们自定义的配置文件了。 

5.新建一个fckeditor.properties在项目的classpath下，配置为： 
connector.userActionImpl=net.fckeditor.requestcycle.impl.UserActionImpl 

6.web.xml配置： 
<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>  

7.目前发现ie9下对fckeditor不兼容： 
原因, IE9 开始不支持 JS 的这个写法了 var $=document.getElementById; 
修改方法:见 fckeditor/editor/js/fckeditorcode_ie.js 的这个方法:FCKTools.RegisterDollarFunction 
修改为: 
FCKTools.RegisterDollarFunction=function(A){A.$=function(v){return A.document.getElementById(v);}}; 

8.jsp引用： 
<script type="text/javascript" src="/fckeditor/fckeditor.js"></script> 

<textarea id="_editor_textarea" style="width:90%;height:50px;" rows="3" cols="6" name="content"></textarea> 

<script type="text/javascript"> 
var oFCKeditor = new FCKeditor( 'content' ) ; 
oFCKeditor.BasePath = "/fckeditor/" ; 
oFCKeditor.Height = 400 ; 
oFCKeditor.Width = 810 ; 
oFCKeditor.ToolbarSet = "bbs"; 
oFCKeditor.ReplaceTextarea(); 
</script> 

9.上传文件路径问题： 
FCK默认文件上传路径为WebRoot下的userfiles文件夹下 
那么我们自行定义路径的改造如下： 
重写ConnectorServlet文件，我的重写如下： 
package com.lenovo.platform.util; 

import java.io.File; 
import java.io.IOException; 
import java.io.PrintWriter; 
import java.util.Date; 
import java.util.List; 
import java.util.UUID; 

import javax.servlet.ServletException; 
import javax.servlet.http.HttpServlet; 
import javax.servlet.http.HttpServletRequest; 
import javax.servlet.http.HttpServletResponse; 

import net.fckeditor.connector.Messages; 
import net.fckeditor.handlers.CommandHandler; 
import net.fckeditor.handlers.ConnectorHandler; 
import net.fckeditor.handlers.ExtensionsHandler; 
import net.fckeditor.handlers.RequestCycleHandler; 
import net.fckeditor.handlers.ResourceTypeHandler; 
import net.fckeditor.response.UploadResponse; 
import net.fckeditor.response.XmlResponse; 
import net.fckeditor.tool.Utils; 
import net.fckeditor.tool.UtilsFile; 

import org.apache.commons.fileupload.FileItem; 
import org.apache.commons.fileupload.FileItemFactory; 
import org.apache.commons.fileupload.disk.DiskFileItemFactory; 
import org.apache.commons.fileupload.servlet.ServletFileUpload; 
import org.apache.commons.io.FilenameUtils; 
import org.slf4j.Logger; 
import org.slf4j.LoggerFactory; 

import com.lenovo.platform.util.file.SystemConfigure; 
import com.lenovo.platform.util.utils.TimeUtil; 

public class ConnectorServlet extends HttpServlet { 

private static final long serialVersionUID = -5742008970929377161L; 
private static final Logger logger = LoggerFactory.getLogger(ConnectorServlet.class); 

/** 
* Initialize the servlet: <code>mkdir</code> <DefaultUserFilesPath> 
*/ 
public void init() throws ServletException, IllegalArgumentException { 
String realDefaultUserFilesPath= SystemConfigure.getValue("hb.FCKImagePath"); 

File defaultUserFilesDir = new File(realDefaultUserFilesPath); 
UtilsFile.checkDirAndCreate(defaultUserFilesDir); 

logger.info("ConnectorServlet successfully initialized!"); 
} 

/** 
* Manage the <code>GET</code> requests (<code>GetFolders</code>, 
* <code>GetFoldersAndFiles</code>, <code>CreateFolder</code>).<br/> 
* 
* The servlet accepts commands sent in the following format:<br/> 
* <code>connector?Command=<CommandName>&Type=<ResourceType>&CurrentFolder=<FolderPath></code> 
* 
* It executes the commands and then returns the result to the client in XML 
* format. 
* 

*/ 
public void doGet(HttpServletRequest request, HttpServletResponse response) 
        throws ServletException, IOException { 
logger.debug("Entering ConnectorServlet#doGet"); 

response.setCharacterEncoding("UTF-8"); 
response.setContentType("application/xml; charset=UTF-8"); 
response.setHeader("Cache-Control", "no-cache"); 
PrintWriter out = response.getWriter(); 

String commandStr = request.getParameter("Command"); 
String typeStr = request.getParameter("Type"); 
String currentFolderStr = request.getParameter("CurrentFolder"); 

logger.debug("Parameter Command: {}", commandStr); 
logger.debug("Parameter Type: {}", typeStr); 
logger.debug("Parameter CurrentFolder: {}", currentFolderStr); 

XmlResponse xr; 

if (!RequestCycleHandler.isEnabledForFileBrowsing(request)) 
xr = new XmlResponse(XmlResponse.EN_ERROR, Messages.NOT_AUTHORIZED_FOR_BROWSING); 
else if (!CommandHandler.isValidForGet(commandStr)) 
xr = new XmlResponse(XmlResponse.EN_ERROR, Messages.INVALID_COMMAND); 
else if (typeStr != null && !ResourceTypeHandler.isValid(typeStr)) 
xr = new XmlResponse(XmlResponse.EN_ERROR, Messages.INVALID_TYPE); 
else if (!UtilsFile.isValidPath(currentFolderStr)) 
xr = new XmlResponse(XmlResponse.EN_ERROR, Messages.INVALID_CURRENT_FOLDER); 
else { 
CommandHandler command = CommandHandler.getCommand(commandStr); 
ResourceTypeHandler resourceType = ResourceTypeHandler.getDefaultResourceType(typeStr); 

String typePath = UtilsFile.constructServerSidePath(request, resourceType); 
String typeDirPath = getServletContext().getRealPath(typePath); 

File typeDir = new File(typeDirPath); 
UtilsFile.checkDirAndCreate(typeDir); 

File currentDir = new File(typeDir, currentFolderStr); 

if (!currentDir.exists()) 
xr = new XmlResponse(XmlResponse.EN_INVALID_FOLDER_NAME); 
else { 

xr = new XmlResponse(command, resourceType, currentFolderStr, MyUtilsResponse 
        .constructResponseUrl(request, resourceType, currentFolderStr, true, 
                ConnectorHandler.isFullUrl())); 

if (command.equals(CommandHandler.GET_FOLDERS)) 
xr.setFolders(currentDir); 
else if (command.equals(CommandHandler.GET_FOLDERS_AND_FILES)) 
xr.setFoldersAndFiles(currentDir); 
else if (command.equals(CommandHandler.CREATE_FOLDER)) { 
String newFolderStr = UtilsFile.sanitizeFolderName(request 
        .getParameter("NewFolderName")); 
logger.debug("Parameter NewFolderName: {}", newFolderStr); 

File newFolder = new File(currentDir, newFolderStr); 
int errorNumber = XmlResponse.EN_UKNOWN; 

if (newFolder.exists()) 
errorNumber = XmlResponse.EN_ALREADY_EXISTS; 
else { 
try { 
errorNumber = (newFolder.mkdir()) ? XmlResponse.EN_OK 
        : XmlResponse.EN_INVALID_FOLDER_NAME; 
} catch (SecurityException e) { 
errorNumber = XmlResponse.EN_SECURITY_ERROR; 
} 
} 
xr.setError(errorNumber); 
} 
} 
} 

out.print(xr); 
out.flush(); 
out.close(); 
logger.debug("Exiting ConnectorServlet#doGet"); 
} 

/** 
* Manage the <code>POST</code> requests (<code>FileUpload</code>).

* 
* The servlet accepts commands sent in the following format:

* <code>connector?Command=<FileUpload>&Type=<ResourceType>&CurrentFolder=<FolderPath></code> 
* with the file in the <code>POST</code> body.

* <br> 
* It stores an uploaded file (renames a file if another exists with the 
* same name) and then returns the JavaScript callback. 
*/ 
@SuppressWarnings("unchecked") 
public void doPost(HttpServletRequest request, HttpServletResponse response) 
        throws ServletException, IOException { 
logger.debug("Entering Connector#doPost"); 

response.setCharacterEncoding("UTF-8"); 
response.setContentType("text/html; charset=UTF-8"); 
response.setHeader("Cache-Control", "no-cache"); 
PrintWriter out = response.getWriter(); 

String commandStr = request.getParameter("Command"); 
String typeStr = request.getParameter("Type"); 
String currentFolderStr = request.getParameter("CurrentFolder"); 
String time=""; 
logger.debug("Parameter Command: {}", commandStr); 
logger.debug("Parameter Type: {}", typeStr); 
logger.debug("Parameter CurrentFolder: {}", currentFolderStr); 

UploadResponse ur; 

// if this is a QuickUpload request, 'commandStr' and 'currentFolderStr' 
// are empty 
if (Utils.isEmpty(commandStr) && Utils.isEmpty(currentFolderStr)) { 
commandStr = "QuickUpload"; 
currentFolderStr = "/"; 
} 

if (!RequestCycleHandler.isEnabledForFileUpload(request)) 
ur = new UploadResponse(UploadResponse.SC_SECURITY_ERROR, null, null, 
        Messages.NOT_AUTHORIZED_FOR_UPLOAD); 
else if (!CommandHandler.isValidForPost(commandStr)) 
ur = new UploadResponse(UploadResponse.SC_ERROR, null, null, Messages.INVALID_COMMAND); 
else if (typeStr != null && !ResourceTypeHandler.isValid(typeStr)) 
ur = new UploadResponse(UploadResponse.SC_ERROR, null, null, Messages.INVALID_TYPE); 
else if (!UtilsFile.isValidPath(currentFolderStr)) 
ur = UploadResponse.UR_INVALID_CURRENT_FOLDER; 
else { 
ResourceTypeHandler resourceType = ResourceTypeHandler.getDefaultResourceType(typeStr); 
String typeDirPath = SystemConfigure.getValue("hb.FCKImagePath"); 
typeDirPath=typeDirPath.replace('\\','/'); 
try { 
time=TimeUtil.changeDate2StringYMD(new Date()); 
typeDirPath += "/" +time; 
} catch (Exception e1) { 
e1.printStackTrace(); 
} 
File typeDir = new File(typeDirPath); 
UtilsFile.checkDirAndCreate(typeDir); 

File currentDir = new File(typeDir, currentFolderStr); 

if (!currentDir.exists()) 
ur = UploadResponse.UR_INVALID_CURRENT_FOLDER; 
else { 

String newFilename = null; 
FileItemFactory factory = new DiskFileItemFactory(); 
ServletFileUpload upload = new ServletFileUpload(factory); 

upload.setHeaderEncoding("UTF-8"); 

try { 

List<FileItem> items = upload.parseRequest(request); 

// We upload only one file at the same time 
FileItem uplFile = items.get(0); 
String rawName = UtilsFile.sanitizeFileName(uplFile.getName()); 
String filename = FilenameUtils.getName(rawName); 
String baseName = FilenameUtils.removeExtension(filename); 
String extension = FilenameUtils.getExtension(filename); 

if (!ExtensionsHandler.isAllowed(resourceType, extension)) 
ur = new UploadResponse(UploadResponse.SC_INVALID_EXTENSION); 
else { 
// if(ifChinese(filename)){ 
filename = UUID.randomUUID().toString() +"."+ extension; 
// } 
// currentDir = TimeUtil.changeDate2StringYMD(new Date()); 
// construct an unique file name 
File pathToSave = new File(currentDir, filename); 
int counter = 1; 
while (pathToSave.exists()) { 
newFilename = baseName.concat("(").concat(String.valueOf(counter)) 
        .concat(")").concat(".").concat(extension); 
pathToSave = new File(currentDir, newFilename); 
counter++; 
} 

if (Utils.isEmpty(newFilename)) 
ur = new UploadResponse(UploadResponse.SC_OK, MyUtilsResponse 
        .constructResponseUrl(request, resourceType, currentFolderStr, 
                true, ConnectorHandler.isFullUrl()).concat(filename)); 
else 
ur = new UploadResponse(UploadResponse.SC_RENAMED, 
MyUtilsResponse.constructResponseUrl(request, resourceType, 
                currentFolderStr, true, ConnectorHandler.isFullUrl()) 
                .concat(newFilename), newFilename); 

// secure image check 
if (resourceType.equals(ResourceTypeHandler.IMAGE) 
        && ConnectorHandler.isSecureImageUploads()) { 
if (UtilsFile.isImage(uplFile.getInputStream())) 
uplFile.write(pathToSave); 
else { 
uplFile.delete(); 
ur = new UploadResponse(UploadResponse.SC_INVALID_EXTENSION); 
} 
} else 
uplFile.write(pathToSave); 
} 
//保存的目录到 
//SyncSaveServlet.saveFCK(filename,time); 
// FtpUtil.upload(typeDirPath, filename, GetProperties.getValue("ftp.file.fck")+time+"/"); 
} catch (Exception e) { 
ur = new UploadResponse(UploadResponse.SC_SECURITY_ERROR); 
} 
} 

} 
try { 
out.print(ur); 
} catch (Exception e) { 
e.printStackTrace(); 
} 
out.flush(); 
out.close(); 

logger.debug("Exiting Connector#doPost"); 
} 
private  boolean ifChinese(String fileName){ 
for(int i=0;i <fileName.length();i++)   
  {   if(fileName.substring(i,i+1).matches("[\\u4e00-\\u9fa5]+")){ 
  return true; 
  } 

  } 
return false; 
} 

} 



类中涉及到的一些文件： 

MyUtilsResponse 类 
package com.lenovo.platform.util; 

import java.util.Date; 

import javax.servlet.http.HttpServletRequest; 

import net.fckeditor.handlers.ResourceTypeHandler; 
import net.fckeditor.tool.UtilsResponse; 

import com.lenovo.platform.util.file.SystemConfigure; 
import com.lenovo.platform.util.utils.TimeUtil; 

public class MyUtilsResponse extends UtilsResponse { 

public static String constructResponseUrl(HttpServletRequest request, ResourceTypeHandler resourceType, String urlPath, 
boolean prependContextPath, boolean fullUrl) { 

StringBuffer sb = new StringBuffer(); 

try { 
sb.append(SystemConfigure.getValue("hb.FCK.info") + "/" + TimeUtil.changeDate2StringYMD(new Date()) + "/"); 
} catch (Exception e) { 
e.printStackTrace(); 
}  
return sb.toString(); 
} 
} 



SystemConfigure 类 
package com.lenovo.platform.util.file; 

import java.util.Locale; 
import java.util.ResourceBundle; 

/** 
* 
* 获取属性文件的属性值 
* 
* @author 
* 
*/ 
public class SystemConfigure { 

protected static Locale locale = Locale.getDefault(); 

protected static ResourceBundle rb = ResourceBundle.getBundle("systemConfigure" , locale); 

/** 
* 获取属性文件的键值 
*/ 
public static String getValue(String key) 
{ 
return rb.getString(key).trim(); 
} 
} 

systemConfigure配置文件： 
hb.FCKImagePath=E\:\\images\\fck\\ 
hb.FCK.info=/fck 

FCKImagePath为文件时间存储路径 
info为虚拟路径 

这还需要在tomcat下指定虚拟路径： 
<Context path="/fck" docBase="E:\images\fck" reloadable="false" debug="0" privileged="true"/> 

那么相应的web.xml也许做小许改动： 
<servlet>  
<servlet-name>Connector</servlet-name>  
<servlet-class>  
com.lenovo.platform.util.ConnectorServlet 
</servlet-class>  
<load-on-startup>10</load-on-startup>  
</servlet>  

<servlet-mapping>  
<servlet-name>Connector</servlet-name>  
<url-pattern>  
/fckeditor/editor/filemanager/connectors/*  
</url-pattern>  
</servlet-mapping> 


10.到此FCK所遇到的问题应该全部解决，剩下的就是自行应用了， 
附件中为FCK的源包和所需要的jar包