Asp.net中FCKeditor2.6.3配置詳解

時間 2019-12-14

標籤 asp.net asp fckeditor2.6.3 fckeditor 配置詳解欄目 ASP 简体版

原文原文鏈接

恰好須要用到.net編輯器的時候，選擇了傳說中的FCKeditor好好的研究了一下！以前沒有用過，遇到了必定的麻煩，如今拿出來和你們分享，但願對你也會有所幫助!javascript

FCKeditor是個國外的多語言編輯器，你能夠對其配置文件進行簡單修改使之支持目前經常使用Web開發語言的應用，下面我就講講FCKeditor2.6.3版本在Asp.net中的具體配置過程，有不足和出錯的地方，歡迎指正。php

精簡：css

正由於這個編輯器是支持多語言的，因此首先咱們針對使用對其作相應的冗餘文件刪除。html

一、臨時文件及文件夾刪除：從根目錄下開始刪除一切以「_」開頭的文件及文件夾，由於他們爲臨時文件和文件夾。刪除這類臨時文件及文件夾以後，咱們還要刪除一些根目錄下的多餘文件，根目錄下咱們只保留fckconfig.js（配置文件）、fckeditor.js（js方式調用文件）、 fckeditor.asp、 fckstyles.xml（樣式）、fcktemplates.xml（模板）文件和editor文件夾。java

二、editor\lang目錄：存放的是多語言配置文件，由於咱們只可能用到en和zh-cn（簡體中文）因此，根據個人選擇，我刪掉其餘的語言配置文件。數組

三、editor\skins界面目錄：默認帶有三個界面（default：默認界面，加載速度相對較快；office2003：相對pp的界面，不過速度確實要慢些；silver：銀白色界面，加載速度也相對較快），能夠自行決定是否刪除其中一兩個。安全

四、editor\filemanager \connectors目錄：存放編輯器所支持的Web動態語言，咱們以 Asp.net爲例因此保留aspx目錄，test.html文件能夠幫助你查看某語言下的上傳設置等（具體上傳設置我將在後面的配置做較爲詳細講解），能夠自行決定是否刪除。服務器

到此精簡完成，你會發現整個編輯器確實「瘦身」很多，呵呵session

基本配置：編輯器

下面我開始對編輯器進行簡單配置（並不是每步都必須，可根據本身的須要參考修改）：

一、載入fckeditor的.net方法類庫FCKeditor.Net_2.6.3.zip

解壓FCKeditor.Net_2.6.3.zip，添加到項目中（載入後別忘了把工程名FredCK.FCKeditorV2.vs2005改成FredCK.FCKeditorV2），在主目錄的bin文件夾中添加改引用！

二、默認語言

打開fckconfig.js文件（注意此文件是utf-8 編碼哦），找到FCKConfig.AutoDetectLanguage = true ;（第56行）此句做用爲自動檢測語言，默認爲true，即表示編輯器會根據系統語言自動檢測加載相應的語言，咱們將其改成false，不讓其檢測，而後將FCKConfig.DefaultLanguage = 'en';（編輯器默認語言，第57行）改成簡體中文"zh-cn"。

三、字體列表

依然打開fckconfig.js，由於此編輯器爲外國人編寫，因此默認不提供中文字體，咱們爲其加入，找到FCKConfig.FontNames（第142行）加入「宋體;楷體_GB2312;新宋體;黑體;隸書;幼圓;」其餘字體可根據本身須要自行加入。

四、文件上傳

FCKeditor的文件管理程序在 editor/filemanager/文件夾下，分爲瀏覽（browser）和上傳（upload）兩種。「瀏覽」是指瀏覽服務器已存在文件並能夠選擇，也能夠上傳本地文件至服務器；上傳是指快速上傳，在窗口中點「上傳」選項，選擇本地文件後上傳就行，可是不能查看服務器上已有上傳文件，相對而言不太方便，只是操做更爲快捷。也就是說FCKeditor中有一個文件瀏覽，有兩個文件上傳，而這些設置是分散在多個文件中，配置相對複雜，下面我大體講一下：

在FCKeditor中共有兩個文件跟上傳功能有關，一個是js文件，一個是aspx文件，前者關閉後界面中不出現相關窗口或按鈕，後者關閉後相關功能不可用。

js文件便是指的fckconfig.js文件，在之前舊版本的fckconfig.js中首先你必需開啓以下幾項：

瀏覽上傳功能：

CODE:

FCKConfig.LinkBrowser = true ; //文件

FCKConfig.ImageBrowser = true ; //圖片

FCKConfig.FlashBrowser = true ; //Flash

快速上傳功能：

CODE:

FCKConfig.LinkUpload = true ; //同上

FCKConfig.ImageUpload = true ; //同上

FCKConfig.FlashUpload = true ; //同上

即把這幾項設爲true，而咱們今天使用的2.6.3的 fckconfig.js中默認已是開啓上傳開關顯示功能的，因此，若是你要將該編輯器做爲前臺使用（fckeditor上傳漏洞問題一直沒有獲得較好的改善），考慮到安全性你可能須要關閉文件上傳功能，那麼你只須要將這幾項設置爲false即可。

若是你要使用文件上傳功能，那麼咱們繼續配置：

依然在fckconfig.js文件中，fckeditor對語言默認支持的是php，找到如下兩句，進行相應修改：

CODE:

var _FileBrowserLanguage = 'php' ; // asp | aspx | cfm | lasso | perl | php | py

var _QuickUploadLanguage = 'php' ; // asp | aspx | cfm | lasso | php

咱們將其均改成'aspx':

CODE:

var _FileBrowserLanguage = 'aspx' ; // asp | aspx | cfm | lasso | perl | php | py

var _QuickUploadLanguage = 'aspx' ; // asp | aspx | cfm | lasso | php

*.AllowedExtensions：（其中*號代表：FCKConfig.LinkUpload、FCKConfig.ImageUpload 等）表示容許上傳的文件後綴名，爲空表示容許全部文件，你可根據本身須要設置上傳文件後綴名，必定程度增長安全性，設置的格式能夠參考它已有的後綴名設置。

*.DeniedExtensions：同上，表示禁止上傳的文件後綴名。

注：你設置了容許上傳的，固然禁止的也就沒必要要設置了，本人推薦設置容許的，畢竟禁止的後綴名列表不能羅列徹底，可能還有不少咱們未曾想到的後綴名。

對js文件的配置到此已經完成，下面咱們進行aspx文件在上傳方面的設置：

文件瀏覽上傳修改：

打開editor\filemanager\browser\default\connectors\aspx\config.ascx文件，找到：

private bool CheckAuthentication()
       {
              // WARNING : DO NOT simply return "true". By doing so, you are allowing
               // "anyone" to upload and list the files in your server. You must implement
                // some kind of session validation here. Even something very simple as...
                //
                //   return ( Session[ "IsAuthorized" ] != null && (bool)Session[ "IsAuthorized" ] == true );
                //
                // ... where Session[ "IsAuthorized" ] is set to "true" as soon as the
                // user logs in your system.

                return false;
        }

將return false改成return true，即容許上傳,最好在前面加上session判斷用戶登錄，以免全部人均可以上傳。

UserFilesPath= "/userfiles/" ;爲定義上傳目錄，可根據本身狀況進行修改，我將其改成upload目錄。

注：注意FCKeditor是不支持虛擬目錄的，你的全部路徑都是針對網站根目錄的絕對路徑。

到此上傳基本配置已經完成，整個編輯器最基本的配置也已經結束了，你能夠經過下列代碼對其進行調用測試了：

<%@ Page Language="C#" %>

<%@ Register Assembly="FredCK.FCKeditorV2" Namespace="FredCK.FCKeditorV2" TagPrefix="FCKeditorV2" %>

http://www.w3.org/1999/xhtml>

FCKeditor - Sample

趕忙測試一下吧，是否是很激動，終於能夠看到這個強大的編輯器了，呵呵。

咱們能夠爲上傳文件以時間+隨機數做爲其新名字，在 FredCK.FCKeditorV2類中的FileBrowser下的FileWorkerBase.cs文件中修改protected void FileUpload( string resourceType, string currentFolder, bool isQuickUpload )方法中的sFileName處便可，能夠本身寫方法命名，我就不在這裏獻醜了！

當完成以上設置後，fckeditor已經能知足咱們的平常使用須要，不過咱們卻又發現一個問題，那就是上傳後的文件咱們卻沒法刪除，這樣會使網站上的垃圾文件（主要是圖片）日益增多，那咱們是否可以經過對編輯器的修改能較爲方便的管理刪除無用上傳文件呢？咱們不難想到fckeditor的瀏覽文件功能，對該功能進行適當的擴展，對平常所上傳的文件進行管理就變得至關簡單易行了，那咱們趕忙動手吧：

增長該功能咱們修改的頁面爲：fckeditor\editor\filemanager\browser\default\frmresourceslist.html

第一步，在頁面的body區域增長以下代碼：

CODE:

說明：第一對的做用是當咱們把鼠標移動到所上傳的文件上時顯示其相關信息；標籤的做用是供咱們刪除上傳文件時作動做響應窗口的，便是將咱們的刪除動做在 iframe中運行，目的是實現僞無刷新刪除效果；最後一對的做用是顯示上傳文件及文件夾的列表

第二步，在文件的js代碼區中加入：

CODE:

// 顯示文件顯示層

function showDiv( fileUrl )

{

var name = fileUrl;

//獲取文件類型

var suffix = name.substring(name.lastIndexOf(".")+1);

var div= document.getElementById("showFile");

div.content = "";

div.style.position = "absolute";

div.content += "

if (suffix=='gif' || suffix=="jpg" || suffix=="jpeg" || suffix=="bmp" || suffix=="png")

{

div.content += "

}

else

{

div.content += "

< /tr>";

}

div.content += "

關閉

刪除 < /td>

該類型不能預覽

div.innerHTML = div.content;

div.style.display = "";

div.style.top = event.y+document.body.scrollTop+10;

div.style.left = event.x+document.body.scrollLeft+30;

}

// 隱藏文件顯示層

function hiddenDiv()

{

var div= document.getElementById("showFile");

div.style.display ="none";

}

// 在iframe中刪除文件

function delFile( fileUrl )

{

if(!confirm('你肯定刪除該文件？'))

return;

var url = '/fckeditor/del_file.aspx?filePath='+ fileUrl; //這裏請本身建一個del-file.aspx

window.open(url, "iframe_del");

Refresh();

}

///*}}}*/

第三步，修改本頁面原有js

修改：

CODE:

　　oListManager.Clear = function()

{

document.body.innerHTML = '' ;

}

爲：

CODE:

　　oListManager.Clear = function()

{

hiddenDiv();

document.getElementById("body_content").innerHTML = '' ; // body_content爲咱們在body區域增長的div標籤

}

找到：

CODE:

var sLink = '' ;

修改成：

CODE:

var sLink = '' ; // 便是文件信息顯示功能

修改：

CODE:

　　function Refresh()

{

LoadResources( oConnector.ResourceType, oConnector.CurrentFolder ) ;

}

爲：

CODE:

　　function Refresh()

{

hiddenDiv(); // 所做修改，爲了刷新列表時默認隱藏文件顯示層

LoadResources( oConnector.ResourceType, oConnector.CurrentFolder ) ;

}

修改函數：GetFoldersAndFilesCallBack，找到：

CODE:

document.body.innerHTML = oHtml.ToString() ;

修改成：

CODE:

document.getElementById("body_content").innerHTML = oHtml.ToString() ;

最後，增長一個文件刪除頁面del_file.aspx（該文件路徑和增長的js函數delFile(fileUrl)中的調用一致），做用爲刪除文件，給出成功與否的操做提示，參考代碼：

protected void Page_Load(object sender, EventArgs e)
    {
        if (Request.QueryString["filePath"] != null)
        {
            if (Request.QueryString["filePath"].Trim() != "")
            {
                //BLF.Clean(Server.MapPath(Request.QueryString["filePath"].Trim().ToString()));
            }
        }
    }

///

/// 刪除指定目錄以及該目錄下全部文件
///

        /// 欲刪除文件或者目錄的路徑
        public static void Clean(string dir)
        {

CleanFiles(dir);//第一次刪除文件

CleanFiles(dir);//第二次刪除目錄

}
        private static void CleanFiles(string dir)
        {
            if (!Directory.Exists(dir))
            {
                File.Delete(dir);
                return;
            }
            else
            {
                string[] dirs = Directory.GetDirectories(dir);
                string[] files = Directory.GetFiles(dir);

                if (0 != dirs.Length)
                {
                    foreach (string subDir in dirs)
                    {
                        if (null == Directory.GetFiles(subDir))
                        {
                            Directory.Delete(subDir);
                            return;
                        }
                        else CleanFiles(subDir);
                    }
                }
                if (0 != files.Length)
                {
                    foreach (string file in files)
                    {
                        File.Delete(file);
                    }
                }
                else Directory.Delete(dir);
            }
        }

使用方法,一句話.Directory.Delete( path, true)

以上有人可能認爲很煩,沒有意義,沒必要用遞歸呢.幾句代碼就能夠了.
但我想說,使用遞歸的好處就是,能夠,在裏面作判斷,好比你只想刪除其中的部分條件文件,你能夠這樣改一下..好比你只想刪除名字等到.aaa.txt的.徹底能夠,

foreach ( string subDir in dirs )
                {
                   if ( null == Directory.GetFiles( subDir )   && subDir == "aaa.txt")
                    {
                         Directory.Delete( subDir );
                         return;
                    }
                    else CleanFiles ( subDir );
               }

固然我只是弄個簡單例子,但但願有用.呵.

能夠在fckconfig.js中找到FCKConfig.ToolbarSets["Default"]設置編輯器的工具欄，能夠自行定義，刪減

至此，我對於fckeditor的修改基本完成，固然這些修改只是對fckeditor修改使用的拋磚引玉，給你們一個參考，但願對初學者有所幫助。後面對編輯器的修改過程比較匆忙，並未修改一步完成一步文檔書寫，因此，不免有所出錯，望見諒，若是你有什麼問題和錯誤發現歡迎聯繫我互相討論，共同進步，呵呵。

By chenjun @ 2008-11-13

Email: chenjun@jingzhengli.cn

另附：

配置文件（fckconfig.js）中主要配置項目以下，根據本身看狀況配置：

CODE:

FCKConfig.CustomConfigurationsPath = '' ; // 自定義配置文件路徑和名稱

FCKConfig.EditorAreaCSS = FCKConfig.BasePath + 'css/fck_editorarea.css'; // 編輯區的樣式表文件

FCKConfig.BaseHref = ''; // 相對連接的基地址

FCKConfig.Debug = true/false; // 是否開啓調試功能，當調用FCKDebug.Output()時，會在調試窗中輸出內容

FCKConfig.SkinPath = FCKConfig.BasePath + 'skins/default/'; // 設置皮膚

FCKConfig.AutoDetectLanguage = true/false ; // 是否自動檢測語言

FCKConfig.DefaultLanguage = 'zh-cn' ; // 設置默認語言

FCKConfig.ContentLangDirection = 'ltr/rtr'; // 默認文字方向，ltr左，rtr右

FCKConfig.FillEmptyBlocks = true/false ; // 使用這個功能，能夠將空的塊級元素用空格來替代

FCKConfig.FormatSource = true/false; // 切換到代碼視圖時，是否自動格式化代碼

FCKConfig.FormatOutput = true/false; // 當輸出內容時是否自動格式化代碼

FCKConfig.FormatIndentator = ""; // 當在「源碼格式」下縮進代碼使用的字符

FCKConfig.GeckoUseSPAN = true/false; // 是否容許SPAN標記代替B，I，U標記

FCKConfig.StartupFocus = true/false; // 開啓時是否FOCUS到編輯器

FCKConfig.ForcePasteAsPlainText = true/false;// 強制粘貼爲純文本

FCKConfig.ForceSimpleAmpersand = true/false; // 是否不把&符號轉換爲XML實體

FCKConfig.TabSpaces = 0/1; // TAB是否有效

FCKConfig.TabSpaces = 4; // TAB鍵產生的空格字符數

FCKConfig.ShowBorders = true/false; // 是否合併邊框

FCKConfig.ToolbarStartExpanded = true/false; // 頁面載入時，工具欄是否展開，點「展開工具欄」時纔出現

FCKConfig.ToolBarCanCollapse = true/false; // 是否容許展開摺疊工具欄

FCKConfig.ToolbarSets = object ; // 編輯器的工具欄，能夠自行定義，刪減，可參考已存在工具欄

FCKConfig.EnterMode = 'p'; // 編輯器中直接回車，在代碼中生成，可選爲p | div | br

FCKConfig.ShiftEnterMode = 'br'; // 編輯器中Shift+回車，在代碼中生成，可選爲p | div | br

FCKConfig.ContextMenu = 字符串數組; // 右鍵菜單的內容

FCKConfig.FontColors = ""; // 文字顏色列表

FCKConfig.FontNames = ""; // 字體列表

FCKConfig.FontSizes = ""; // 字號列表

FCKConfig.FontFormats = ""; // 文字格式列表

FCKConfig.StylesXmlPath = ""; // CSS樣式列表的XML文件的位置

FCKConfig.TemplatesXmlPath = ""; // 模版的XML文件位置

FCKConfig.SpellChecker = "ieSpell/Spellerpages"; // 拼寫檢查器

FCKConfig.IeSpellDownloadUrl = ""; // 下載拼寫檢查器的網址

FCKConfig.SmileyPath = FCKConfig.BasePath + 'images/smiley/msn/'; // 表情文件存放路徑

FCKConfig.SmileyImages = ''; // 表情文件名稱列表，具體參考默認設置

FCKConfig.SmileyColumns = 8; // 表情窗口顯示錶情列數

FCKConfig.SmileyWindowWidth = 320; // 表情窗口顯示寬度，此窗口會由於表情文件的改變而做調整

FCKConfig.SmileyWindowHeight = 240; // 表情窗口顯示高度，此窗口會由於表情文件的改變而做調整

FCKConfig.FullPage = true/false; // 是否容許編輯整個HTML文件，仍是僅容許編輯BODY間的內容

引用自:http://www.jingzhengli.cn/Blog/cj/819.html#
www.voswin.com

--------------------------
新聞：傳IBM收購Sun盡職調查程序未完談判仍在繼續
導航：博客園首頁知識庫新聞招聘社區小組博問網摘找找看

相關標籤/搜索

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。