FCKeditor是使用非常廣泛的HTML編輯器,本文從 ASP.NET 的使用場景對 FCKeditor 與 FCKeditor.NET 的配置、功能擴展(如自定義文件上傳子目錄、自定義文件名、上傳圖片的后期處理等)、以及安全性進行初步的闡述。
希望能幫助有同樣需求的同仁節省一點時間;也希望各位能指正其中的不足。謝謝。
一、自定義 FCKeditor 的 BasePath
BasePath 即FCKeditor在網站中的相對路徑,默認值是 /fckeditor/,最好在Web.config appSettings中對其進行配置:
<add key="FCKeditor:BasePath" value="/FCKeditor_2.6.3/"/>
這樣做有諸多優點:
開發環境與生產環境不同,開發環境一般是http://localhost/xxx.com/這種情況下FCKeditor就得放在一個虛擬目錄http://localhost/fckeditor/中,若涉及多個網站的開發,而各網站的FCKeditor有差別時,這樣顯然不是最優;
而且因為物理目錄結構與邏輯目錄結構不同,也會有發生錯誤的隱患;
而如果采用Web.config的配置,就可以在開發環境采用不同的配置,FCKeditor的物理路徑與生產環境保持一致;
當升級FCKeditor時,只需要將新版本的FCKeditor放在相應版本號的目錄里,修改一下配置即可。這樣可以解決因為靜態資源的客戶端緩存問題,不同用戶出現不同的錯誤的問題;
可以直觀地看到自己的FCKeditor的版本號。
二、配置文件上傳的目錄
FCKeditor的文件上傳(如圖片上傳)目錄可以通過Web.config appSettings進行配置,如:
<add key="FCKeditor:UserFilesPath" value="/UploadFile/FCKeditor/"/>
也可以在 /FCKeditorBasePath/editor/filemanager/connectors/aspx/config.ascx 中進行配置,但我建議 FCKeditor 目錄中的內容能不改就不改(fckconfig.js除外),這樣日后升級可以放心地替換即可。
三、自定義文件上傳的子目錄的格式
我們知道,一個文件夾下面不能存放過多的文件(據稱Windows下面的目錄下2000為閾值),否則對該目錄的訪問會嚴重影響I/O性能。而FCKeditor的文件存儲是在單一的一個目錄進行的。我對FCKeditor進行了擴展,可以在Web.config appSettings對存儲目錄的格式自定義,如:
<add key="FCKeditor:FolderPattern" value="%y/%m-%d/"/>
========================================
以今天的日期為例:這樣產生的文件上傳子目錄格式為:2008/10-21/。
年月日格式的目錄可以隨意組合,如:
<add key="FCKeditor:FolderPattern" value="%y/%m/%d/"/>
這樣產生的文件上傳子目錄變成了2008/10/21/
========================================
還可以針對不同登錄的用戶,采用不同的上傳子目錄
Web.config 修改上傳子目錄的配置,增加%u表示不同用戶使用基于其標識不同的上傳子目錄
<add key="FCKeditor:FolderPattern" value="%u/%y/%m/%d/"/>
FCKeditor_2.6.3/editor/filemanager/connectors/aspx/config.ascx 中增加獲取當前登錄用戶標識的邏輯
復制代碼代碼如下:
public override void SetConfig()
{
#region Bochuh's Modification
// Identifier for logined user
// Leave blank for default user upload folder
LoginedUserIdentifier = "44"; // 這里替換成獲取當前登錄用戶表示的代碼
#endregion
// ……此文件中原來的代碼
}
這樣可以對不同用戶,根據其登錄后的標識(一般是用戶ID),來使用不同的目錄進行存儲,如:7394/2008/10/21/(7394是當前登錄用戶的ID)
參考:
%u 代表 當前登錄用戶的標識
%y 代表 當前時間的年份
%m 代表 當前時間的月份
%d 代表 當前時間的日
四、自定義文件上傳的文件名格式
FCKeditor對文件名的處理規則是:如果當前目錄下沒有重名文件,則上傳后的文件名與用戶PC上的文件名一致;若存在n個重名文件,則加入用戶PC上的文件名是Example.xxx,上傳后的文件名變為:Example(n).xxx
我的項目里要求對用戶上傳的文件名變成Guid的格式,所以我對FCKeditor也做了擴展,在Web.config appSettings可以對上傳后文件的格式自定義,如:
<add key="FCKeditor:FilenamePattern" value="%guid.%extl"/>
這樣的文件名如:a299e63a-7d2d-493d-bbb9-99162ef5b6b8.gif
參考:
%guid 代表 一個新的guid字符串
%fnl 代表 源文件名的小寫
%fnu 代表 源文件名的大寫
%extl 代表 源文件擴展名的小寫
%extu 代表 源文件擴展名的大寫
五、對上傳圖片進行縮放處理
用到FCKeditor圖片上傳功能的場景中,很多是內容的發表。內容中往往不需要幾千像素大小的圖片,比如我的項目中,文章區域最寬也就560像素,所以我做了一個擴展,在Web.config appSettings中可以對圖片的最大寬度進行自定義:
<add key="FCKeditor:MaxWidthOfUploadedImg" value="560"/>
有了這段配置,上傳后的圖片的寬度都控制在了560像素及以內
六、自定義上傳后圖片URL中的域名
為了加快頁面的渲染,我們可以把圖片等靜態資源放在一個獨立的域名當中。但FCKeditor默認的圖片上傳后URL是相對路徑,如圖:
我增加了這個擴展,在Web.config appSettings可以配置上傳后圖片URL的域名,如:
<add key="FCKeditor:UploadedFilesDomain" value="http://a.cvimg.cn/"/>
如圖:
七、解決上傳文件名含有中文的文件時提示 "invalid file type" 的問題
這個問題只需要在Web.config中增加一段配置即可解決:
復制代碼代碼如下:
<location path="FCKeditor_2.6.3/editor/filemanager/connectors/aspx/upload.aspx">
<system.web>
<globalization requestEncoding="utf-8" responseEncoding="gb2312"/>
</system.web>
</location>
注意:
responseEncoding是網站的默認編碼
FCKeditor_2.6.3是FCKeditor的BasePath
八、FCKeditor的安全性
在FCKeditor的2.3.2版本里,曾有一個漏洞,可以通過 /editor/filemanager/browser/default/connectors/aspx/connector.aspx 往服務器上傳任意文件,我的網站就曾經中招。
2.6.3雖然暫未發現類似的問題,但一般情況下用不到的文件最好還是刪除比較好:
FCKeditor BasePath 根目錄中除了保留:
/editor
/fckconfig.js
/fckpackager.xml
/fckstyles.xml
/fcktemplates.xml
/license.txt
外,全部刪除
/editor/filemanager/中除了保留:
/connectors/aspx/config.ascx
/connectors/aspx/upload.aspx
外,全部刪除
刪除 /editor/_source/
/editor/filemanager/connectors/aspx/config.ascx 的 CheckAuthentication() 方法中,增加驗證用戶是否登錄的邏輯
注意:以上措施僅適用于ASP.NET的網站,其他語言版本的網站未考慮。
附:基于FCKeditor.Net_2.6.3修改后的源碼
SOURCE: http://xiazai.vevb.com/201108/yuanma/FCKeditor.Net_2.6.3_20090713.zip
BIN(.NET 2.0): http://xiazai.vevb.com/201108/yuanma/FredCK.FCKeditorV2_20090713.zip
對以下文件的指定行進行了修改,
/FileBrowser/Config.cs line 45, 116, 169
/FileBrowser/FileWorkerBase.cs line 68, 98, 110, 125, 278
所有修改的地方均包含在名為 "ZhuBo's Modification" 的代碼塊中,也可以通過搜索整個項目中的 "ZhuBo's Modification" 快速看到改動的地方,方便自己的擴展(比如可以設定圖片的最大高度)
更新 at 2008-11-11
新增可選的根據用戶標識讓不同用戶使用獨自的圖片上傳子目錄,參見上文中“三、自定義文件上傳的子目錄的格式”的更新部分。
新的源碼與dll文件也已更新。
更新 at 2009-07-06
感謝新手中的新手的發現,修正了以下Bug:未配置FCKeditor:FolderPattern,或者FCKeditor:FolderPattern為空時,上傳圖片成功后的路徑中多了一個"/"
更新 at 2009-07-13
圖片后綴名為.gif的不做壓縮處理,防止動畫效果丟失。