ASP.NET环境下集成CKEditor与CKEditor实现文件上传

浏览数：31 / 时间：2015年06月09日

1、从http://ckeditor.com网站上下载ckeditor_aspnet_3.6.4与ckfinder_aspnet_2.4;

2、解压下载的文件ckeditor_aspnet_3.6.4.zip，得到

解压下载的文件ckfinder_aspnet_2.4.zip，得到

3、将ckeditor_aspnet_3.6.4\_Samples\bin文件夹下的CKEditor.NET.dll和CKEditor.NET.pdb，以及ckfinder_aspnet_2.4\ckfinder\bin\Debug文件夹下的CKFinder.dll和CKFinder.pdb文件复制到项目bin文件夹中；

4、将CKEditor和CKFinder文件夹复制到项目中

5、修改项目配置文件web.config和Ckeditor\config.js、Ckfinder\config.ascx；

（1）web.config文件中在<system.web></system.web>之间加入：

<pages>

<controls>

<add tagPrefix="CKEditor" assembly="CKEditor.NET" namespace="CKEditor.NET"/>

</controls>

</pages>

（2）Ckeditor\config.js集成指定上传文件浏览服务、上传图片、上传FLASH等调用的CKFinder地址，修改如下：

CKEDITOR.editorConfig = function( config )

{

// Define changes to default configuration here. For example:

// config.language = ‘fr‘;

// config.uiColor = ‘#AADC6E‘;

config.language = ‘zh-cn‘;

config.filebrowserBrowseUrl = ‘/ckfinder/ckfinder.html‘; //上传文件时浏览服务文件夹

config.filebrowserImageBrowseUrl = ‘/ckfinder/ckfinder.html?Type=Images‘; //上传图片时浏览服务文件夹

config.filebrowserFlashBrowseUrl = ‘/ckfinder/ckfinder.html?Type=Flash‘; //上传Flash时浏览服务文件夹

config.filebrowserUploadUrl = ‘/ckfinder/core/connector/aspx/connector.aspx?command=QuickUpload&type=Files‘; //上传文件按钮(标签)

config.filebrowserImageUploadUrl = ‘/ckfinder/core/connector/aspx/connector.aspx?command=QuickUpload&type=Images‘; //上传图片按钮(标签)

config.filebrowserFlashUploadUrl = ‘/ckfinder/core/connector/aspx/connector.aspx?command=QuickUpload&type=Flash‘; //上传Flash按钮(标签)

};

（3）Ckfinder\config.ascx指定上传文件时是否需要授权，默认返回false，修改为true。（注意：在正式项目中不可直接返回true，而要验证用户登录成功后才可返回！）

public override 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 on your system.

return true ;

}

6、在项目中新建一个editor.aspx，源码如下：

<body>

<form id="form1" runat="server">

<div>

<CKEditor:CKEditorControl ID="CKEditor1" runat="server" Height="200" BasePath="~/ckeditor">

<p>This is some <strong>sample text</strong>. You are using <a href="http://ckeditor.com/">CKEditor</a>.</p>

</CKEditor:CKEditorControl>

</div>

<asp:Button ID="Button1" runat="server" onclick="Button1_Click" Text="Button" />

<br />

<asp:Literal ID="Literal1" runat="server"></asp:Literal>

</form>

</body>

在editor.aspx.cs文件中输入：

protected void Button1_Click(object sender, EventArgs e)

{

Literal1.Text = CKEditor1.Text;

}

7、修改CKFinder使其动态命名上传的文件，重新生成CKFinder.dll文件

修改CKFinder的源码。CKFinder自带有源码，目录：/CKFinde/_source
在VS里新建一个现在的项目指向CKFinde/_source/CKFinder.Net.sln
(1) 打开/Settings/ConfigFile.cs文件
定位27行，添加一个属性：public bool RandomReName; //随机重命名
定位63行，给刚才的属性赋值：RandomReName = true; //默认值为true
保存关闭文件
(2) 打开/Connector/Config.cs文件
定位61行，添加一个属性：
        public bool RandomReName
        {
            get { return Settings.ConfigFile.Current.RandomReName; }
        }
保存关闭文件
(3) 打开/Connector/CommandHandlers/FileUploadCommandHandler.cs文件
定位84行，添加一句判断代码：
                        if ( Config.Current.RandomReName) //使用随机名
                            sFileName = DateTime.Now.ToString("yyyyMMddHHmmssfff") + "." + sExtension;