【总结 CKEditor 和 CKFinder 的配置和使用】

CKEditor的配置和使用

一、        介绍 

CKEditor,原名FCKEditor,是一款优秀的专门使用在网页上属于开放源代码的所见即所得文字编辑器。 它志于轻量化,不需要太复杂的安装步骤即可使用。 它可和PHP、JavaScript、ASP、ASP.NET、ColdFusion、Java、以及ABAP等不同的编程语言相结合。“FCKeditor”名称中的“FCK” 是这个编辑器的作者的名字Frederico Caldeira Knabben的缩写。

以上是来自百度百科的介绍。

 

二、        CKEditor的配置 

先从整体上看一下,这是应用CKEditor最简单的一个项目。

 

我们要做的第一步就是把ckeditor下的这9个文件引入到项目中。

 

第二步在测试页面Default.aspx中添加对ckeditor的引用。

<script src="js/ckeditor/ckeditor.js" type="text/javascript"></script>

在页面中添加一个TextBox,设置 CssClass=”ckeditor”.

添加完ckeditor.js的引用之后,测试页面Default.aspx还不可以运行。

我的IDE是Visual Studio 2010,为了站点的安全性,Framework会自阻止一些HTM代码的上传,所以须先禁用对HTML代码的验证。

真对VS2010,可采用如下的方法:

  • 在Default.aspx页面的第一行添加  ValidateRequest="false"

    <%@ Page Language="C#" AutoEventWireup="true" ValidateRequest="false"  %>

  •  在Web.config文件中 <system.web> 标签内添加如下语句

    <httpRuntime requestValidationMode="2.0" />

 

到目前为止,我们的Default.aspx文件可以正常运行了。

但是,还有一个问题,在ckeditor 无法上传文件,接下来,我们就需要添加另外一个助手——CKEditor的文件管理器插件 CKFinder,可以上传文件。

 

三、        CKFinder的配置 

 

就像第二步一样,给项目添加上图所示的文件,同时还需要引入CKFinder.dll 动态链接库文件,添加之后别忘记重新生成解决方案哦!

此时,图片上传功能就会增加一个上传按钮

 

如果选择一幅图片,点击上传按钮,系统会提示错误。如下所示。

 

我们需进行如下配置,打开config.ascx 文件,我们会清晰的看到作者FCK清晰的注释,

 

因为安全原因,需要用授权用户才能进行文件上传。

这里我们用登陆页面简单的演示一下。

在 Login.aspx 文件中模拟登陆。

 

 

在config.ascx文件中进行判断。

 

如此这般,CKEditor 和 CKFinder 的所有工作都配置完成了。

原文地址:https://www.cnblogs.com/fanyong/p/2029845.html