FCK在MVC跟ASP.NET中的配置和使用

FCK在MVC和ASP.NET中的配置和使用

一：FCK配置
1. 下载
FCKeditor_2.6.3.zip（核心文件）
FCKeditor.Net_2.6.3.zip（。Net Control）
（下载地址：FCKeditor 的压缩包
http://nchc.dl.sourceforge.net/sourceforge/fckeditor/FCKeditor_2.4.3.zip
FCKeditor 的.net 2.0核心库
http://nchc.dl.sourceforge.net/sourceforge/fckeditor/FCKeditor.Net_2.2.zip）

（或者直接到我的资源http://download.csdn.net/source/1859109中去下载，里面有使用的例子，结合下面内容一看就会）
2. 部署到.NET网站中
FCKeditor_2.6.3.zip解压后将fck根目录改名为fckeditor，放到网站根目录下。
网站根目录下创建一个文件夹uploadfiles，用于存放上传的文件
在网站中引用FCKeditor.Net_2.6.3.zip中的“FredCK.FCKeditorV2.dll”

（注意：在IIS6.0下，上传图片的时候，会出现JS没有权限的错误，解决方法是，更改FredCK.FCKeditorV2.dll的源码，找到 FileBrowser/FileWorkerBase.cs 文件
代码 124 行

Response.Write( @"(function(){var d=document.domain;while (true){try{var A=window.top.opener.document.domain;break;}catch(e) {};d=d.replace(/.*?(?:/.|$)/,'');if (d.length==0) break;try{document.domain=d;}catch (e){break;}}})();" );

把 try 中的 document.domain=d; 删除即可.

然后重新生成 FredCK.FCKeditorV2.dll即可）

3. 简化fck配置
删除所有以_开始的文件和文件夹，在filemanager中的connector中除aspx以外的文件夹

4. 修改fck的语言
fckeditor中的fckconfig.js
61～63行
FCKConfig.AutoDetectLanguage = false ;
FCKConfig.DefaultLanguage = 'zh-cn' ;
FCKConfig.ContentLangDirection = 'ltr' ;

6. 上传权限设置
fckeditor2.6.3默认已经在fckconfig.js中允许被授权的连接上传和浏览文件了，但是默认情况下有将所有的连接都设为了未授权状态。修改方法为修改editor/filemanager/connector/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 true;
}
找到CheckAuthentication方法，默认情况返回false，这里要改为true。也可以根据登录情况来选择权限检测的返回值。

至此，上传设置已经完成！

下面讲一下上传设置的优化（初学者可以不用理会）：

1. fckeditor的上传有两种方式：quick方式和非quick方式。
非quick方式是通过单击“浏览服务器”，在“浏览服务器”窗口中上传。这种上传根据上传文件的类型，自动上传到相应的目录，例如图片自动上传到uploadfiles/image下（uploadfiles为用户自己指定）；
quick方式则通过在“上传”选项卡中上传。这种上传直接将文件上传到上传根目录uploadfiles。（uploadfiles为用户自己指定）。
但是个人认为quick上传不好的地方在于所有上传的文件不分类型都放在根目录，很凌乱。所以考虑将这两种上传方式都按照类型存放到相应的文件夹中。

修改方法：

方法1：修改filemanager/connectors/aspx/config.ascx

TypeConfig["File"].AllowedExtensions = new string[] { "7z", "aiff", "asf", "avi", "bmp", "csv", "doc", "fla", "flv", "gif", "gz", "gzip", "jpeg", "jpg", "mid", "mov", "mp3", "mp4", "mpc", "mpeg", "mpg", "ods", "odt", "pdf", "png", "ppt", "pxd", "qt", "ram", "rar", "rm", "rmi", "rmvb", "rtf", "sdc", "sitd", "swf", "sxc", "sxw", "tar", "tgz", "tif", "tiff", "txt", "vsd", "wav", "wma", "wmv", "xls", "xml", "zip" };
TypeConfig["File"].DeniedExtensions = new string[] { };
TypeConfig["File"].FilesPath = "%UserFilesPath%file/";
TypeConfig["File"].FilesAbsolutePath = (UserFilesAbsolutePath == "" ? "" : "%UserFilesAbsolutePath%file/");
TypeConfig["File"].QuickUploadPath = "%UserFilesPath%file/";
TypeConfig["File"].QuickUploadAbsolutePath = (UserFilesAbsolutePath == "" ? "" : "%UserFilesAbsolutePath%");
将TypeConfig["File"].QuickUploadPath 的值改为与 TypeConfig["File"].FilesPath相同 = "%UserFilesPath%file/";

方法2：修改FCKeditor.Net_2.6.3源代码（较麻烦）

（1）. 将FCKeditor.Net_2.6.3.zip解压缩，打开解压后的工程，修改FileBrowser/FileWorkerBase.cs

protected string ServerMapFolder( string resourceType, string folderPath, bool isQuickUpload )
{
TypeConfig typeConfig = this.Config.TypeConfig[ resourceType ];

// Get the resource type directory.
/*-----------修改前-------------------*/
//string sResourceTypePath = isQuickUpload ? typeConfig.GetQuickUploadDirectory() : typeConfig.GetFilesDirectory();
/*------------------------------------*/
/*-----------修改后-------------------*/
string sResourceTypePath = typeConfig.GetFilesDirectory();
/*------------------------------------*/

// Ensure that the directory exists.
Util.CreateDirectory( sResourceTypePath );

// Return the resource type directory combined with the required path.
return System.IO.Path.Combine( sResourceTypePath, folderPath.TrimStart( '/' ) );
}
如上面代码，无论isQuickUpload为true或false，都按照非Quick上传方式，取得上传路径（即typeConfig.GetFilesDirectory()）。
(2). 修改fckconfig.js

FCKConfig.LinkBrowser = true ;
FCKConfig.LinkBrowserURL = FCKConfig.BasePath + 'filemanager/browser/default/browser.html?Connector=' + encodeURIComponent( FCKConfig.BasePath + 'filemanager/connectors/' + _FileBrowserLanguage + '/connector.' + _FileBrowserExtension ) ;
FCKConfig.LinkBrowserWindowWidth = FCKConfig.ScreenWidth * 0.7 ; // 70%
FCKConfig.LinkBrowserWindowHeight = FCKConfig.ScreenHeight * 0.7 ; // 70%

FCKConfig.ImageBrowser = true ;
FCKConfig.ImageBrowserURL = FCKConfig.BasePath + 'filemanager/browser/default/browser.html?Image&Connector=' + encodeURIComponent( FCKConfig.BasePath + 'filemanager/connectors/' + _FileBrowserLanguage + '/connector.' + _FileBrowserExtension ) ;
FCKConfig.ImageBrowserWindowWidth = FCKConfig.ScreenWidth * 0.7 ; // 70% ;
FCKConfig.ImageBrowserWindowHeight = FCKConfig.ScreenHeight * 0.7 ; // 70% ;

FCKConfig.FlashBrowser = true ;
FCKConfig.FlashBrowserURL = FCKConfig.BasePath + 'filemanager/browser/default/browser.html?Type=Flash&Connector=' + encodeURIComponent( FCKConfig.BasePath + 'filemanager/connectors/' + _FileBrowserLanguage + '/connector.' + _FileBrowserExtension ) ;
FCKConfig.FlashBrowserWindowWidth = FCKConfig.ScreenWidth * 0.7 ; //70% ;
FCKConfig.FlashBrowserWindowHeight = FCKConfig.ScreenHeight * 0.7 ; //70% ;

FCKConfig.LinkUpload = true ;
FCKConfig.LinkUploadURL = FCKConfig.BasePath + 'filemanager/connectors/' + _QuickUploadLanguage + '/upload.' + _QuickUploadExtension + '?Type=File';
//FCKConfig.LinkUploadAllowedExtensions = "" ; // empty for all
FCKConfig.LinkUploadAllowedExtensions = ".(7z|aiff|asf|avi|bmp|csv|doc|fla|flv|gif|gz|gzip|jpeg|jpg|mid|mov|mp3|mp4|mpc|mpeg|mpg|ods|odt|pdf|png|ppt|pxd|qt|ram|rar|rm|rmi|rmvb|rtf|sdc|sitd|swf|sxc|sxw|tar|tgz|tif|tiff|txt|vsd|wav|wma|wmv|xls|xml|zip)$" ; // empty for all
FCKConfig.LinkUploadDeniedExtensions = "" ; // empty for no one

FCKConfig.ImageUpload = true ;
FCKConfig.ImageUploadURL = FCKConfig.BasePath + 'filemanager/connectors/' + _QuickUploadLanguage + '/upload.' + _QuickUploadExtension + '?Type=Image' ;
FCKConfig.ImageUploadAllowedExtensions = ".(jpg|gif|jpeg|png|bmp)$" ; // empty for all
FCKConfig.ImageUploadDeniedExtensions = "" ; // empty for no one

FCKConfig.FlashUpload = true ;
FCKConfig.FlashUploadURL = FCKConfig.BasePath + 'filemanager/connectors/' + _QuickUploadLanguage + '/upload.' + _QuickUploadExtension + '?Type=Flash' ;
FCKConfig.FlashUploadAllowedExtensions = ".(swf|flv)$" ; // empty for all
FCKConfig.FlashUploadDeniedExtensions = "" ; // empty for no one

可以看到包括两部分设置：浏览（LinkBrowser、ImageBrowser和FlashBrowser）和上传（LinkUpload、ImageUpload和FlashUpload）。主要是做了如下修改
Code
/*-------修改前------------*/
FCKConfig.LinkUploadURL = FCKConfig.BasePath + 'filemanager/connectors/' + _QuickUploadLanguage + '/upload.' + _QuickUploadExtension ;
/*-------修改后-----------*/
FCKConfig.LinkUploadURL = FCKConfig.BasePath + 'filemanager/connectors/' + _QuickUploadLanguage + '/upload.' + _QuickUploadExtension + '?Type=File';

在最后加上了Type=File,这样通过添加链接上传的文件就上传到了file目录下。
也可以对FCKConfig.LinkBrowserURL进行修改加上Type=File，这样在点击添加链接里的“浏览服务器”时就只能浏览File目录下的文件和文件夹。可以看到Image和Flash默认时都只能浏览Image和Flash目录，如果去掉Type=Image和Type=Flash就可以浏览上传根目录下的所有目录了。

至此，上传设置就基本完成了。当然还可以对上传做进一步的设置，例如：随机生成文件名;上传目录以year/month/;上传图片加水印等会在以后来贴出来。

以上是配置下面是使用
http://zsl79812sun.blog.163.com/blog/static/1234112752009631103449853/

二：FCK的使用
大家找到之前弄好的2个文件
FCKEditor：操作境的相程式案
FCKEditor.NET：ASP.NET需要的dll，有了才能在.NET境中用

步一：上dll
1:把FredCK.FCKeditorV2.dll放到bin目录下
2：点击VS左上角的视图（V），在点工具箱
3：在工具箱中找到常规（一般在最后一个）
4：在常规中点右键，在弹出的选项框中选择 “选择项（I)”
5: 耐心等待....直到弹出“选择工具箱项”
6: 在“选择工具箱项”中找到“.NET Framework组建”
7：点击浏览，选择刚才的bin目录，找到FredCK.FCKeditorV2.dll，选中，并选择打开，然后点确定
8：後就多出一目了第一次使用：
拖拉控制到面中，切到原始中
您在上方自您加入以下的程式

1 <%@ Register Assembly="FredCK.FCKeditorV2" Namespace="FredCK.FCKeditorV2" TagPrefix="FCKeditorV2" %>
view plain | print | copy to clipboard | ?

<%@ Register Assembly="FredCK.FCKeditorV2" Namespace="FredCK.FCKeditorV2" TagPrefix="FCKeditorV2" %>
且加入以下的FCKeditor控制
1 <FCKeditorV2:FCKeditor ID="FCKeditor1" runat="server">
2 </FCKeditorV2:FCKeditor>
view plain | print | copy to clipboard | ?

<FCKeditorV2:FCKeditor ID="FCKeditor1" runat="server"> </FCKeditorV2:FCKeditor>
此如果去行，就出以下的
1 HTTP 404 - Not Found
view plain | print | copy to clipboard | ?

HTTP 404 - Not Found
是由於程式不知道要到哪找相的工具案
定工具案目(BasePath="~/FCKeditor/")

1 <FCKeditorV2:FCKeditor ID="FCKeditor1" runat="server" BasePath="~/FCKeditor/">
2 </FCKeditorV2:FCKeditor>
view plain | print | copy to clipboard | ?

<FCKeditorV2:FCKeditor ID="FCKeditor1" runat="server" BasePath="~/FCKeditor/"></FCKeditorV2:FCKeditor>
此再一次，就出感的面啦

定片上的功能
不再仔的是用一下，片上的功能法使用

是因FCKeditor不知道把案上到哪去存放，所以要把定加在Web.config中
首先在您的Web案中增加一目存放使用者上的料，假是【UserFiles】
修改Web.config增加定，把原本的<appSettings/>改

1 <appSettings>
2 <add key="FCKeditor:UserFilesPath" value="/tt/UserFiles/"/>
3 
4 </appSettings>
view plain | print | copy to clipboard | ?

<appSettings> <add key="FCKeditor:UserFilesPath" value="/tt/UserFiles/"/> </appSettings>
除此之外，由於FCKEditor是asp使用，所以需要在定改使用aspx
定改aspx：
在的FCKeditor目中找到一案【fckconfig.js】
搜字串asp，可以找到以下定

1 var _FileBrowserLanguage = 'asp' ;
2 var _QuickUploadLanguage = 'asp' ;
view plain | print | copy to clipboard | ?

var _FileBrowserLanguage = 'asp' ;var _QuickUploadLanguage = 'asp' ;
改

1 var _FileBrowserLanguage = 'aspx' ;
2 var _QuickUploadLanguage = 'aspx' ;
view plain | print | copy to clipboard | ?

var _FileBrowserLanguage = 'aspx' ;var _QuickUploadLanguage = 'aspx' ;

部分小喵曾多方，站台使用File的方式法出，不如果是使用http透IIS的方式建立站台就正常。
程式上的使用：

我先一下如何用FCKeditor，先再面上安排一FCKeditor2Div且予id，指定runat="server"，且安排一按，希望按下按後，排的果面呈在div1，而原始示在div2中

1 <div>
2 <FCKeditorV2:FCKeditor ID="FCKeditor1" runat="server" BasePath="~/FCKeditor/">
3 </FCKeditorV2:FCKeditor>
4 </div>
5 <asp:Button ID="Button1" runat="server" Text="Button" />
6 <br />
7 示果:
8 <div id="div1" runat="server" style="border-right: black thin solid; border-top: black thin solid; border-left: black thin solid; border-bottom: black thin solid;">Div1</div>
9 <hr />
10 原始:
11 <div id="div2" runat="server" style="border-right: black thin solid; border-top: black thin solid; border-left: black thin solid; border-bottom: black thin solid;">Div1</div>
view plain | print | copy to clipboard | ?

<div> <FCKeditorV2:FCKeditor ID="FCKeditor1" runat="server" BasePath="~/FCKeditor/"> </FCKeditorV2:FCKeditor> </div> <asp:Button ID="Button1" runat="server" Text="Button" /> <br /> 示果: <div id="div1" runat="server" style="border-right: black thin solid; border-top: black thin solid; border-left: black thin solid; border-bottom: black thin solid;">Div1</div> <hr /> 原始: <div id="div2" runat="server" style="border-right: black thin solid; border-top: black thin solid; border-left: black thin solid; border-bottom: black thin solid;">Div1</div>
接著安排一下程式控制如下

1 Protected Sub Button1_Click(ByVal sender As Object, ByVal e As System.EventArgs) Handles Button1.Click
2 Me.div1.InnerHtml = Me.FCKeditor1.Value
3 Me.div2.InnerText = Me.FCKeditor1.Value
4 End Sub
view plain | print | copy to clipboard | ?

Protected Sub Button1_Click(ByVal sender As Object, ByVal e As System.EventArgs) Handles Button1.Click Me.div1.InnerHtml = Me.FCKeditor1.Value Me.div2.InnerText = Me.FCKeditor1.Value End Sub
接著行看看，在器中便入些字，改一下字的大小、式接著按下按
此又有出了

1 具有在危 Request.Form 的值已用端 (FCKeditor1="<strong><em><font st...") 到。
view plain | print | copy to clipboard | ?

具有在危 Request.Form 的值已用端 (FCKeditor1="<strong><em><font st...") 到。
是因事上送出的候，所送出的容是HTML的法，而ASP.NET了安全起不允html的法，所以候，要再修改西，把的aspx最上方加上以下的性定
validateRequest="false"
再重新整理一次果，就可以看到效果
所以使用上，要存入料只要把Me.FCKeditor1.Value的容存入料就可以了，要料中取回，也可以使用Me.FCKeditor1.Value = Dr.Item("FieldsName")就可以了，真是方便啊!!
安全上的注意事：

FCKeditor然定上的，不程式撰上真的很方便使用，不要特注意一些事情，由於使用html的法的Request安全定打，因此有可以您的站，被殖入<iframe>的攻，所以建承接Me.FCKeditor1.value後，最好先理一下是否有<iframe>的料，如果有，最好替掉、或者出警告使用者不允填入<iframe>

备注：

在ASP.net中获取值的方法为： Server.HtmlDecode(Request.Form["FCKeditor1"])

在MVC中则稍微麻烦一点点：

另外下面介绍一些附加功能，装了FCK以后，你会发现使用的字体不够多，那么怎么设置呢？请看下面；

打开 fckconfig.js 文件
找到第154行(应该是),会发现:
FCKConfig.FontNames = 'Arial;Comic Sans MS;Courier New;Tahoma;Times New Roman;Verdana' ;
将其修改为:
FCKConfig.FontNames = '宋体;黑体;幼圆;楷体_GB2312;仿宋_GB2312;Arial;Comic Sans MS;Courier New;Tahoma;Times New Roman;Verdana' ;

当当这样还是不行，虽然发现编辑器的字体选项多了已添加的中文字体，但应用到文本上却发现没有任何作用！
接着下一步：)

打开editor/css/fck_editorarea.css 文件

将:
font-family: Arial, Verdana, sans-serif;
修改为：
font-family: 宋体, 黑体, 幼圆, 楷体, 仿宋, Arial, Verdana, sans-serif;

FCK在MVC跟ASP.NET中的配置和使用

热点推荐