Fckeditor和JSP(Java)项目的整合实例

Fckeditor和JSP(Java)项目的整合实例
2007-6-6

使用工具:eclipse 3.2 + tomcat 5.5

1.http://www.fckeditor.net/download 上下载两个包
一个是FCKeditor的文件包,另外一个是针对Java项目的FCKeditor.Java包



2.在eclipse中建立一个web项目TestFCKEditor


3.解压缩Fckeditor. Java包,找到web.xml,打开web.xml,复制其中的如下部分到你的项目下的web.xml文件中

< servlet >  
< servlet-name > Connector </ servlet-name >  
< servlet-class > com.fredck.FCKeditor.connector.ConnectorServlet </ servlet-class >  
< init-param >  
< param-name > baseDir </ param-name >  
< param-value > /UserFiles/ </ param-value >  
</ init-param >  
< init-param >  
< param-name > debug </ param-name >  
< param-value > true </ param-value >  
</ init-param >  
< load-on-startup > 1 </ load-on-startup >  
</ servlet >  

< servlet >  
< servlet-name > SimpleUploader </ servlet-name >  
< servlet-class > com.fredck.FCKeditor.uploader.SimpleUploaderServlet </ servlet-class >  
< init-param >  
< param-name > baseDir </ param-name >  
< param-value > /UserFiles/ </ param-value >  
</ init-param >  
< init-param >  
< param-name > debug </ param-name >  
< param-value > true </ param-value >  
</ init-param >  
< init-param >  
< param-name > enabled </ param-name >  
< param-value > false </ param-value >  
</ init-param >  
< init-param >  
< param-name > AllowedExtensionsFile </ param-name >  
< param-value ></ param-value >  
</ init-param >  
< init-param >  
< param-name > DeniedExtensionsFile </ param-name >  
< param-value > php|php3|php5|phtml|asp|aspx|ascx|jsp|cfm|cfc|pl|bat|exe|dll|reg|cgi </ param-value >  
</ init-param >  
< init-param >  
< param-name > AllowedExtensionsImage </ param-name >  
< param-value > jpg|gif|jpeg|png|bmp </ param-value >  
</ init-param >  
< init-param >  
< param-name > DeniedExtensionsImage </ param-name >  
< param-value ></ param-value >  
</ init-param >  
< init-param >  
< param-name > AllowedExtensionsFlash </ param-name >  
< param-value > swf|fla </ param-value >  
</ init-param >  
< init-param >  
< param-name > DeniedExtensionsFlash </ param-name >  
< param-value ></ param-value >  
</ init-param >  
< load-on-startup > 1 </ load-on-startup >  
</ servlet >  

< servlet-mapping >  
< servlet-name > Connector </ servlet-name >  
< url-pattern > /editor/filemanager/browser/default/connectors/jsp/connector </ url-pattern >  
</ servlet-mapping >  

< servlet-mapping >  
< servlet-name > SimpleUploader </ servlet-name >  
< url-pattern > /editor/filemanager/upload/simpleuploader </ url-pattern >  
</ servlet-mapping >  

 

修改为如下所示

< servlet >  
< servlet-name > Connector </ servlet-name >  
< servlet-class > com.fredck.FCKeditor.connector.ConnectorServlet </ servlet-class >  
< init-param >  
< param-name > baseDir </ param-name >  
< param-value > /UserFiles/ </ param-value >  
</ init-param >  
< init-param >  
< param-name > debug </ param-name >  
< param-value > true </ param-value >  
</ init-param >  
< load-on-startup > 1 </ load-on-startup >  
</ servlet >  

< servlet >  
< servlet-name > SimpleUploader </ servlet-name >  
< servlet-class > com.fredck.FCKeditor.uploader.SimpleUploaderServlet </ servlet-class >  
< init-param >  
< param-name > baseDir </ param-name >  
< param-value > /UserFiles/ </ param-value >  
</ init-param >  
< init-param >  
< param-name > debug </ param-name >  
< param-value > false </ param-value >  
</ init-param >  
< init-param >  
< param-name > enabled </ param-name >  
< param-value > true </ param-value >  
</ init-param >  
< init-param >  
< param-name > AllowedExtensionsFile </ param-name >  
< param-value ></ param-value >  
</ init-param >  
< init-param >  
< param-name > DeniedExtensionsFile </ param-name >  
< param-value > php|php3|php5|phtml|asp|aspx|ascx|jsp|cfm|cfc|pl|bat|exe|dll|reg|cgi </ param-value >  
</ init-param >  
< init-param >  
< param-name > AllowedExtensionsImage </ param-name >  
< param-value > jpg|gif|jpeg|png|bmp </ param-value >  
</ init-param >  
< init-param >  
< param-name > DeniedExtensionsImage </ param-name >  
< param-value ></ param-value >  
</ init-param >  
< init-param >  
< param-name > AllowedExtensionsFlash </ param-name >  
< param-value > swf|fla </ param-value >  
</ init-param >  
< init-param >  
< param-name > DeniedExtensionsFlash </ param-name >  
< param-value ></ param-value >  
</ init-param >  
< load-on-startup > 1 </ load-on-startup >  
</ servlet >  

< servlet-mapping >  
< servlet-name > Connector </ servlet-name >  
< url-pattern > /FCKeditor/editor/filemanager/browser/default/connectors/jsp/connector </ url-pattern >  
</ servlet-mapping >  

< servlet-mapping >  
< servlet-name > SimpleUploader </ servlet-name >  
< url-pattern > /FCKeditor/editor/filemanager/upload/simpleuploader </ url-pattern >  
</ servlet-mapping >  

5.新建一个jsp文件,内容如下:

 

<! DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"  >  
<% ... @ taglib uri="http://fckeditor.net/tags-fckeditor" prefix="FCK"  %>  
< html >  
< head >  
< title > FCKeditor - Samples </ title >  
< meta  http-equiv ="Content-Type"  content ="text/html; charset=utf-8" >  
< meta  name ="robots"  content ="noindex, nofollow" >  
</ head >  
< body >  
< FCK:editor  id ="content"  basePath ="/TestFCKEditor/FCKeditor/"  
imageBrowserURL ="/TestFCKEditor/FCKeditor/editor/filemanager/browser/default/browser.html?Type=Image&Connector=connectors/jsp/connector"  
linkBrowserURL ="/TestFCKEditor/FCKeditor/editor/filemanager/browser/default/browser.html?Connector=connectors/jsp/connector"  
flashBrowserURL ="/TestFCKEditor/FCKeditor/editor/filemanager/browser/default/browser.html?Type=Flash&Connector=connectors/jsp/connector"  
imageUploadURL ="/TestFCKEditor/FCKeditor/editor/filemanager/upload/simpleuploader?Type=Image"  
linkUploadURL ="/TestFCKEditor/FCKeditor/editor/filemanager/upload/simpleuploader?Type=File"  
flashUploadURL ="/TestFCKEditor/FCKeditor/editor/filemanager/upload/simpleuploader?Type=Flash" >  
this is default content :) 
</ FCK:editor >  
</ body >  
</ html >  

6.复制例子程序中WEB-INF目录下lib下的两个jar包到项目的WEB-INF目录下的lib目录 

7.在项目TestFCKEditor目录下建立文件夹UserFiles/Image和UserFiles/Flash,这两个目录表示文件上传后的位置,如果文件夹不存在会出现security error

FCKeditor目录精简说明:
1. 根目录下的文件只留下fckconfig.js, fckeditor.js, fckstyles.xml, fcktemplates.xml四个文件
2. 删除所有的以_开头的文件和文件夹
3. 删除FCKeditor/editor/filemanager/upload目录下的所有文件
4. 删除FCKeditor/editor/filemanager/browser/default/connectors目录下的所有文件
5. 删除FCKeditor/editor/_source目录

成功后效果演示: