1.登陆官方网站下站如下软件包,并用MyEclipse建立web项目
http://www.fckeditor.net/
http://www.fckeditor.com
下载如下软件包并解压
FCKeditor_2.6.4.zip
fckeditor-java-2.4.1-bin.zip
fckeditor-java-2.4.1-src.zip
fckeditor-java-demo-2.4.1.war
2.在FCKeditor_2.6.4.zip压缩包中解庄出的fckeditor目录,复制到
项目中WebRoot目录下
3.js代码加入fckeditor
第一种方法
<script type="text/javascript" src="fckeditor/fckeditor.js"></script>
<form action="js.jsp" method="post">
标题:<input type="text" name="title"/><br>
<script type="text/javascript">
var oFCKeditor = new FCKeditor('FCKeditor1');
oFCKeditor.BasePath = "/fckeditor/";
oFCKeditor.Create();
</script>
</form>
第二种js方法
<script type="text/javascript" src="fckeditor/fckeditor.js"></script>
<form action="js.jsp" method="post">
标题:<input type="text" name="title"/><br>
内容:<textarea id="content" name="content"></textarea>
</form>
<script type="text/javascript">
window.onload = function(){
var f = new FCKeditor( 'content' ) ;
f.BasePath = "/fck/fckeditor/" ;
f.ReplaceTextarea() ;
}
</script>
4.文件上传设置
复制官方案例lib中的所有jar文件到本项目中的lib目录.
复制官方案例classes中的所有文件到本项目中的classes目录.
复制官方案例web.xml的部分代码到,本项目的web.xml
lib目录下的jar文件
commons-fileupload-1.2.1.jar
commons-io-1.3.2.jar
java-core-2.4.1.jar
slf4j-api-1.5.2.jar
slf4j-simple-1.5.2.jar
classes目录下的属性文件
fckeditor.properties
log4j.properties
WEB-INF目录下的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>
5.JSP 加入 FCKeditor
<%@ page language="java" pageEncoding="gbk"%>
<%@ taglib prefix="FCK" uri="http://java.fckeditor.net"%>
<FCK:editor instanceName="content" basePath="/fckeditor" value="" toolbarSet="MyStyle" height="300">
</FCK:editor>
6.安全设置
java-core-2.4.1.jar中找到
net.fckeditor.connector.ConnectorServlet.class并双击,然后点击Attach Source...按钮,关键源代码fckeditor-java-2.4.1-src.zip压缩包,就可以看到ConnectorServlet.java的官方源代码了.
建立源码包com,并建立MyConnector.java,把ConnectorServlet.java源码复制进来,进行修改
同时修改web.xml文件
<servlet>
<servlet-name>Connector</servlet-name>
<servlet-class>com.MyConnector</servlet-class>
<load-on-startup>1</load-on-startup>
</servlet>
找到
if (!RequestCycleHandler.isEnabledForFileUpload(request))
ur = new UploadResponse(UploadResponse.SC_SECURITY_ERROR, null,
null, Messages.NOT_AUTHORIZED_FOR_UPLOAD);
前边加入
if(request.getSession().getAttribute("user")==null)
ur = new UploadResponse(555);
else
代码,就安全了。
7.文件重新命名
解决中文问题
找到doPost方法加入
request.setCharacterEncoding("UTF-8");
还有有时候会设置Tomcat\conf\server.xml 加入 URIEncoding="UTF-8|GBK|GB2312"
找到String extension = FilenameUtils.getExtension(filename);
加入如下代码,可以使用全球唯一算法
filename = UUID.randomUUID().toString()+"."+extension;
8.文件大小设置
找到如下代码位置
if (!ExtensionsHandler.isAllowed(resourceType, extension))
ur = new UploadResponse(UploadResponse.SC_INVALID_EXTENSION);
else {
修改如下,可以限制上传文件大小为50KB
if (!ExtensionsHandler.isAllowed(resourceType, extension))
ur = new UploadResponse(UploadResponse.SC_INVALID_EXTENSION);
else if(uplFile.getSize()>(1024*50)){
ur = new UploadResponse(888);
}else{
9.文件格式限制,图标修改
在MyConnector.java文件中的extension变量,可以直接控制所有文件上传的类型,也可以在
fckconfig.js文件控制文件类型
FCKConfig.ImageBrowser = true ;
FCKConfig.ImageBrowserURL = FCKConfig.BasePath + 'filemanager/browser/default/browser.html?Type=Image&Connector=' + encodeURIComponent( FCKConfig.BasePath + 'filemanager/connectors/' + _FileBrowserLanguage + '/connector.' + _FileBrowserExtension ) ;
FCKConfig.ImageBrowserWindowWidth = FCKConfig.ScreenWidth * 0.7 ; // 70% ;
FCKConfig.ImageBrowserWindowHeight = FCKConfig.ScreenHeight * 0.7 ; // 70% ;
FCKConfig.FlashBrowser = true ;
FCKConfig.FlashBrowserURL = FCKConfig.BasePath + 'filemanager/browser/default/browser.html?Type=Flash&Connector=' + encodeURIComponent( FCKConfig.BasePath + 'filemanager/connectors/' + _FileBrowserLanguage + '/connector.' + _FileBrowserExtension ) ;
FCKConfig.FlashBrowserWindowWidth = FCKConfig.ScreenWidth * 0.7 ; //70% ;
FCKConfig.FlashBrowserWindowHeight = FCKConfig.ScreenHeight * 0.7 ; //70% ;
FCKConfig.LinkUpload = true ;
FCKConfig.LinkUploadURL = FCKConfig.BasePath + 'filemanager/connectors/' + _QuickUploadLanguage + '/upload.' + _QuickUploadExtension ;
FCKConfig.LinkUploadAllowedExtensions = ".(7z|aiff|asf|avi|bmp|csv|doc|fla|flv|gif|gz|gzip|jpeg|jpg|mid|mov|mp3|mp4|mpc|mpeg|mpg|ods|odt|pdf|png|ppt|pxd|qt|ram|rar|rm|rmi|rmvb|rtf|sdc|sitd|swf|sxc|sxw|tar|tgz|tif|tiff|txt|vsd|wav|wma|wmv|xls|xml|zip)$" ; // empty for all
FCKConfig.LinkUploadDeniedExtensions = "" ; // empty for no one
FCKConfig.ImageUpload = true ;
FCKConfig.ImageUploadURL = FCKConfig.BasePath + 'filemanager/connectors/' + _QuickUploadLanguage + '/upload.' + _QuickUploadExtension + '?Type=Image' ;
FCKConfig.ImageUploadAllowedExtensions = ".(jpg|gif|jpeg|png|bmp)$" ; // empty for all
FCKConfig.ImageUploadDeniedExtensions = "" ; // empty for no one
FCKConfig.FlashUpload = true ;
FCKConfig.FlashUploadURL = FCKConfig.BasePath + 'filemanager/connectors/' + _QuickUploadLanguage + '/upload.' + _QuickUploadExtension + '?Type=Flash' ;
FCKConfig.FlashUploadAllowedExtensions = ".(swf|flv)$" ; // empty for all
FCKConfig.FlashUploadDeniedExtensions = "" ; // empty for no one
10.修改图标,修改工具栏
在fckconfig.js的122号加入
FCKConfig.ToolbarSets["MyStyle"] = [
['Bold','Italic','-','Smiley','OrderedList','UnorderedList','-','Link','Unlink']
] ;
来定制工具栏
定制图像
在fckconfig.js的319行左右可以修改头像图标,还要把图标文件复制到
/fck/WebRoot/fckeditor/editor/images/smiley目录下
11.为FCKeditor瘦身
(1)删除fckeditor目录下所有"下滑线开的文件或文件夹"
(2)fckeditor目录下,除js和xml文件,其它的文件全部删除
(3)删除skins目录下的除default外的目录.
(4)lang目录下除en.js\zh-cn.js文件,其它文件的全部删除
(5)删除目录connectors
注意,其它WEB开发技术,不应该删除connectors目录,只有javaEE开发删除.