FCKeditor.NET的配置、擴充與安全性經驗交流

前言

FCKeditor是使用非常廣泛的HTML編輯器，本文從 ASP.NET 的使用情境對 FCKeditor 與 FCKeditor.NET 的配置、功能擴充（如自訂檔案上傳子目錄、自訂檔案名稱、上傳圖片的後期處理等）、以及安全性進行初步的闡述。

希望能協助有同樣需求的同仁節省一點時間；也希望各位能指正其中的不足。謝謝。

 

一、自訂 FCKeditor 的 BasePath

BasePath 即FCKeditor在網站中的相對路徑，預設值是 /fckeditor/，最好在Web.config appSettings中對其進行配置：

<add key="FCKeditor:BasePath" value="/FCKeditor_2.6.3/"/>

這樣做有諸多優點：

1. 開發環境與生產環境不同，開發環境一般是http://localhost/xxx.com/這種情況下FCKeditor就得放在一個虛擬目錄http://localhost/fckeditor/中，若涉及多個網站的開發，而各網站的FCKeditor有差別時，這樣顯然不是最優；
   而且因為物理目錄結構與邏輯目錄結構不同，也會有發生錯誤的隱患；
   而如果採用Web.config的配置，就可以在開發環境採用不同的配置，FCKeditor的實體路徑與生產環境保持一致；
2. 當升級FCKeditor時，只需要將新版本的FCKeditor放在相應版本號碼的目錄裡，修改一下配置即可。這樣可以解決因為靜態資源的用戶端緩衝問題，不同使用者出現不同的錯誤的問題；
3. 可以直觀地看到自己的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>

注意：

1. responseEncoding是網站的預設編碼
2. FCKeditor_2.6.3是FCKeditor的BasePath

八、FCKeditor的安全性

在FCKeditor的2.3.2版本裡，曾有一個漏洞，可以通過 /editor/filemanager/browser/default/connectors/aspx/connector.aspx 往伺服器上傳任意檔案，我的網站就曾經中招。

2.6.3雖然暫未發現類似的問題，但一般情況下用不到的檔案最好還是刪除比較好：

1. FCKeditor BasePath 根目錄中除了保留：
   1. /editor
   2. /fckconfig.js
   3. /fckpackager.xml
   4. /fckstyles.xml
   5. /fcktemplates.xml
   6. /license.txt

   外，全部刪除

2. /editor/filemanager/中除了保留：
   1. /connectors/aspx/config.ascx
   2. /connectors/aspx/upload.aspx

   外，全部刪除

3. 刪除 /editor/_source/
4. /editor/filemanager/connectors/aspx/config.ascx 的 CheckAuthentication() 方法中，增加驗證使用者是否登入的邏輯

注意：以上措施僅適用於ASP.NET的網站，其他語言版本的網站未考慮。

附：基於FCKeditor.Net_2.6.3修改後的源碼

SOURCE: http://files.cnblogs.com/zhubo/FCKeditor.Net_2.6.3_20090713.zip
BIN(.NET 2.0): http://files.cnblogs.com/zhubo/FredCK.FCKeditorV2_20090713.zip

1. 對以下檔案的指定行進行了修改，
   /FileBrowser/Config.cs  line 45, 116, 169
   /FileBrowser/FileWorkerBase.cs  line 68, 98, 110, 125, 278
2. 所有修改的地方均包含在名為 "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的不做壓縮處理，防止動畫效果丟失。

更新 at 2011-08-23

看到不少朋友在配置時出問題，特將 FCKeditor 2.6.6 和 FCKeditor.net 2.6.3整合到了一個Demo項目裡，可以直接下載該Demo，在VS裡開啟，找到 FCKEditorDemo 項目中的Default.aspx，右鍵View in browser即可預覽，其配置供大家參考
FCKEditorDemo.zip