最近一直在搞FCKeditor在線文本編輯器的裁剪和集成，總結(jié)了自己的一些
心得體會(huì)，跟大家分享一下自己的經(jīng)驗(yàn)！
1.jsp/java中引用FCKeditor步驟和具體做法，參見如下的鏈接：
a.jsp頁(yè)面集成調(diào)用說明； b.后臺(tái)瀏覽和上傳功能集成指南；
注意點(diǎn)：配置好jsp頁(yè)面集成FCKeditor的javascrīpt調(diào)用以后，頁(yè)面將會(huì)
顯示如下的樣子：
【文本編輯器樣式】
頁(yè)面上相應(yīng)的代碼如下：
| <scrīpt type="text/javascrīpt" src="FCKeditor/fckeditor.js"></scrīpt> |
<textarea name="content" cols="80" rows="4">
</textarea>
<scrīpt type="text/javascrīpt">
var ōFCKeditor = new FCKeditor('content') ;
oFCKeditor.BasePath = "FCKeditor/";
oFCKeditor.Height = 400;
oFCKeditor.ToolbarSet = "Default" ;
oFCKeditor.ReplaceTextarea();
</scrīpt> |
如果是要想從數(shù)據(jù)庫(kù)讀來的文本數(shù)據(jù)或者是后臺(tái)來自文件的txt/html
文本數(shù)據(jù)。只要在
<textarea name="content" cols="80" rows="4">
</textarea> |
中加入自己的顯示內(nèi)容的formbean對(duì)應(yīng)字段即可
|
<textarea name="content" cols="80" rows="4">
<c:out value="${ contentData}" />
</textarea>
|
這樣內(nèi)容就會(huì)被顯示在FCKeditor編輯框中了，點(diǎn)擊提交按鈕以后就可以
在后臺(tái)的相應(yīng)java action中得到content參數(shù)中的內(nèi)容就是頁(yè)面上
FCKeditor中的內(nèi)容數(shù)據(jù)了。可以在struts/jsf做使用的哦。
要提醒一點(diǎn)的是由于你給FCKeditor瘦身，所以常會(huì)報(bào)缺少對(duì)象支持
等錯(cuò)誤，只要在FCKeditor/editor/lang中加上相應(yīng)的js語(yǔ)言文件即可
如果加載頁(yè)面失敗（FCKeditor未定義）還有一個(gè)可能就是引用
FCKeditor/fckeditor.js文件路徑不對(duì)！關(guān)于FCKeditor瘦身可以
參考網(wǎng)上文章,我還是摘一些要點(diǎn)從網(wǎng)上：
|
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來調(diào)用加載FCKeditor，那么
就不需要在web.xml中配置fckeditor的tag文件。
7.還有一個(gè)問題剛開始使用FCKeditor的人常會(huì)遇到
就怎么控制它的toolbar的大小和元素排列，其實(shí)很簡(jiǎn)單。
在fckconfig.js中用使用這樣的標(biāo)簽[]來劃分每行的
元素的多少，這樣就可以控制toolbar的長(zhǎng)短和大小了，
具體示例參看：fckconfig.js中的toolbarset
["Default"]
|
2.下面再說說fckconfig.js中的一些選項(xiàng)來控制toolbarset中的控件
的功能，實(shí)現(xiàn)功能裁剪：
1):取消超鏈接中的瀏覽服務(wù)器和上傳功能，方法如下：
|
FCKConfig.LinkBrowser = true ;
FCKConfig.LinkUpload = true ;
改為
FCKConfig.LinkBrowser = false ;
FCKConfig.LinkUpload = false ;
|
2）：取消圖片鏈接中的瀏覽服務(wù)器和上傳功能，方法如下：
|
FCKConfig.ImageUpload = true ;
FCKConfig.ImageBrowser = true ;
改為
FCKConfig.ImageUpload = false ;
FCKConfig.ImageBrowser = false ;
|
3):Dlg Button中取消高級(jí)功能，方法如下：
|
FCKConfig.LinkDlgHideAdvanced = false ;
FCKConfig.ImageDlgHideAdvanced = false ;
改為
FCKConfig.ImageDlgHideAdvanced = true ;
FCKConfig.LinkDlgHideTarget = true ;
|
下一篇介紹FCKeditor的上傳和瀏覽服務(wù)器功能，以及如何在里面實(shí)現(xiàn)動(dòng)態(tài)
超連接，轉(zhuǎn)發(fā)到servlet經(jīng)過filter以后去調(diào)用服務(wù)器的action
如何實(shí)現(xiàn)對(duì)應(yīng)用戶瀏覽自己的圖片的列表實(shí)現(xiàn)！
FCKeditor集成java servlet可以實(shí)現(xiàn)文件的上傳和服務(wù)器端列表讀取功
能FCKeditor自己提供了兩個(gè)servlet來分別實(shí)現(xiàn)上傳文件功能，和讀取服
務(wù)器端文件列表功能，這兩個(gè)servlet分別為：
com.fredck.FCKeditor.connector.ConnectorServlet（讀取文件列
表）com.fredck.FCKeditor.uploader.SimpleUploaderServlet（實(shí)
現(xiàn)文件上傳）
1.瀏覽服務(wù)器端文件列表
web.xml文件中，比如ConnectorServlet中的配置選項(xiàng)：
<init-param>
<param-name>baseDir</param-name>
<param-value>/UserFiles/</param-value>
</init-param> |
意思在瀏覽服務(wù)器上的baseDir配置指定里面的所有文件極其目錄結(jié)構(gòu)列表
如果你的baseDir沒有配置，Connector將會(huì)自動(dòng)創(chuàng)建一個(gè)默認(rèn)的文件夾
userFiles，對(duì)應(yīng)的ConnectorServlet中init()方法中代碼如下：
baseDir=getInitParameter("baseDir");
if(baseDir==null)
baseDir="/UserFiles/"; |
還想說一下的是，F(xiàn)CKeditor的client調(diào)用server的servlet方法采用
的是Ajax思想來實(shí)現(xiàn)。當(dāng)你點(diǎn)擊瀏覽服務(wù)器(browser server)的時(shí)候
就會(huì)觸發(fā)一個(gè)異步的javascrīpt + xmlhttp的調(diào)用響應(yīng)，后臺(tái)的servlet
會(huì)去完成你要請(qǐng)求的事件，然后數(shù)據(jù)以xml方式返回給client來解析。
很明顯，你要實(shí)現(xiàn)去數(shù)據(jù)庫(kù)或者其他的文件系統(tǒng)請(qǐng)求列表，你只要修改
ConnectorServlet中兩個(gè)私有方法：getFolders 和 getFiles
讓它去你指定的地方得到文件列表即可，這樣你的文件可以放在任何你
指定目錄下。多說一句，很多人都想知道個(gè)人blog系統(tǒng)中怎么實(shí)現(xiàn)上傳
文件以后對(duì)應(yīng)用戶瀏覽自己的列表的，我的做法很簡(jiǎn)單，建立你用戶名
的文件夾，你上傳只能上傳到你的目錄夾，瀏覽可以通過程序指定瀏覽
對(duì)應(yīng)用戶下的文件夾即可，這個(gè)時(shí)候你要修改Connectorservlet中的
路徑即可！
2.超連接重定位問題
FCKeditor可以插入超連接，實(shí)現(xiàn)對(duì)文件的預(yù)覽功能，只要我們稍微改變
我們可以使FCKeditor編輯器支持對(duì)任意文件系統(tǒng)下的任意文件的客戶端
瀏覽和下載保存！FCKeditor本來提供的是相對(duì)URL超連接，只要我們修改
ConnectorServlet中傳遞給客戶端的地址的時(shí)候，把它改寫成絕對(duì)URL
然后再通過我們自己的filter的servlet實(shí)現(xiàn)重定向去一個(gè)下載/瀏覽
文件的struts的action方法就可以實(shí)現(xiàn)在客戶端對(duì)超連接文件的下載和
瀏覽！說一下具體做法吧：
1):修改ConnectorServlet傳遞給客戶端javascrīpt的路徑，代碼如下
|
String currentUrl= "http://" + request.getserver +request.getServerPort + request.getContextPath +resourcePath;
以上代碼請(qǐng)?jiān)贑onnectorServlet的doGet()里面拼裝！在
調(diào)用CreateCommonXml（）私有方法的時(shí)候參數(shù)傳入
myEl.setAttribute("path",currentPath);
myEl.setAttribute("url",currentUrl);
|
提醒一下resourcePath為在web.xml配置文件中ConnectorServlet中
的一個(gè)初始化參數(shù)配置，等一下利用filter實(shí)現(xiàn)對(duì)超連接的重定位就提取
URL中的這個(gè)配置參數(shù)來判斷，配置如下：
|
<init-param>
<param-name>resourcePath</param-name>
<param-value>/fileSystem/</param-value>
</init-param>
|
2）：建立你的filter servlet，實(shí)現(xiàn)對(duì)URL的截獲，對(duì)符合要求的
URL進(jìn)行重定位到你的對(duì)應(yīng)action中去即可
3）：實(shí)現(xiàn)你的對(duì)應(yīng)action來實(shí)現(xiàn)文件的上傳和下載功能即可！
4）：擴(kuò)展功能－實(shí)現(xiàn)對(duì)URL的加密，對(duì)連接的URL中加上一串字符，最后
幾位作為算法校驗(yàn)，對(duì)不符合要求的URL連接,filter將會(huì)拒絕重定位到
指定action。此外利用自己寫的擴(kuò)展類還可以實(shí)現(xiàn)對(duì)超連接的文件類型
進(jìn)行限制，比如你只能超連接JPG|GIF|DOC|TXT|HTML等幾種后綴名的
文件，對(duì)其他文件即使你指定超連接也讓你瀏覽和下載，這些都可以在
web.xml中通過修改對(duì)應(yīng)servlet的配置文件的初始化參數(shù)實(shí)現(xiàn)。
3.頁(yè)面javascrīpt修改
瀏覽服務(wù)器的功能對(duì)應(yīng)的html/javascrīpt相關(guān)的文件為：browser.html
和frmresourcelist.html對(duì)應(yīng)你想傳遞的信息你可以append在文件名的
字符串后面，在GetFileRowHtml（）的javascrīpt函數(shù)中實(shí)現(xiàn)對(duì)文件
名的截取，這樣client只會(huì)顯示文件名，而你可以得到文件的數(shù)據(jù)庫(kù)唯一
標(biāo)識(shí)，任何你想要的信息你都可以通過修改ConnectorServlet中的私有
方法getFiles()來實(shí)現(xiàn)，只要修改頁(yè)面frmresurcelist.html中的
GetFileRowHtml（）中傳入變量fileName即可。你還可以在點(diǎn)擊選中
文件的時(shí)候?qū)崿F(xiàn)一個(gè)你自己的Ajax調(diào)用，一切取決你的項(xiàng)目需要！
4.我不是一個(gè)javascrīpt高手，其實(shí)如果我對(duì)javascrīpt了解多一些
也許對(duì)客戶端的代碼修改以后做出更眩的功能。可以更好的完成對(duì)
FCKeditor裁剪。我還發(fā)現(xiàn)一個(gè)問題，就是FCKeditor2.3自己提供的
textarea控件一直不能獲得輸入焦點(diǎn)，接受文字輸入，如果有高手知道
怎么修改javascrīpt修復(fù)這個(gè)bug，請(qǐng)也回復(fù)我！
5.注意點(diǎn)
無論怎么修改別人的東西，請(qǐng)一定尊重開源精神！
很多人配置好了FCKeditor的上傳功能以后常會(huì)遇到xmlhttp request
404 error,后面是一串路徑，其實(shí)就是你的servlet-mapping中的路徑
不對(duì)，你只要把xmlhttp request errot 404 后面跟的路徑，copy到
你的web.xml中對(duì)應(yīng)紅色文字的位置，如下：
|
<servlet-mapping>
<servlet-name>Connector</servlet-name>
<url-pattern>
/FCKeditor/editor/filemanager/browser/default/connectors/jsp/connector
</url-pattern>
</servlet-mapping>
|
別忘了SimpleUploader的servlet－mapping也要做同樣的修改！
還有一個(gè)錯(cuò)誤就是http 500錯(cuò)誤，這個(gè)可能是你的URL請(qǐng)求不對(duì)，應(yīng)該和
FCKeditor沒關(guān)系的!