deargem / asp.net学习 / FCKeditor 2.6.3在线编辑器 - leoguan的日...

分享

   

FCKeditor 2.6.3在线编辑器 - leoguan的日志 - 网易博客

2009-07-20  deargem

FCKeditor 2.6.3在线编辑器 2009-06-23 13:22

字号:    
之前用的在线编辑器是DotNetTextBox ,并且曾一度觉得它异常强大,如可以给上传的图片加文字水印或者图片水印,但后来发现其上传的图片不容易管理,都挤在一个文件夹里面(免费版,付费版好像可以分文件夹上传保存图片),并且段首空格总不是所见即所得,我编辑时空了两个字符的位置,到了前台页面的时候只有一个字符,所以今天我再找了一款.Net的在线编辑器,技术群的黄昏推荐了FCKeditor,百度了一下,评价还不错,而且开源,于是到其官网下载了最新的版本FCKeditor_2.6.3。这里需要注意一下,单下载FCKeditor_2.6.3.zip并不能应用.Net环境,还需要下载另外一个文件FCKeditor.Net_2.6.3.zip。官网下载地址:

   下面讲讲FCKeditor.Net编辑器在.net环境的配置方法。

   第一步:解压缩FCKeditor_2.6.3.zip文件,并将解压缩得到的fckeditor文件夹复制到你想使用这个编辑器的网站的根目录下面。

   第二步:把下载的FCKeditor.Net.zip随便解压缩到你硬盘的一个空目录,里面是FCKeditor.Net的源代码,可以对它进行再度开发,我这里讲直接应用,我们要使用到是其目录下的\bin\Debug目录中的FredCK.FCKeditorV2.dll文件。在你的网站里面把这个FredCK.FCKeditorV2.dll添加到bin目录下。

   第三步:进入FCKeditor文件夹,编辑 fckconfig.js 文件,如下:

 

1、指定编辑器应用的编程环境,修改
var _FileBrowserLanguage = 'asp' ; // asp | aspx | cfm | lasso | perl | php | py
var _QuickUploadLanguage = 'asp' ; // asp | aspx | cfm | lasso | php
改为
var _FileBrowserLanguage = 'aspx' ; // asp | aspx | cfm | lasso | perl | php | py
var _QuickUploadLanguage = 'aspx' ; // asp | aspx | cfm | lasso | php


2、配置语言包。有英文、繁体中文等,这里我们使用简体中文。
修改
FCKConfig.DefaultLanguage = 'en' ;

FCKConfig.DefaultLanguage = 'zh-cn' ;


3、配置皮肤。有default、office2003、silver风格等,这里我们可以使用默认。
FCKConfig.SkinPath = FCKConfig.BasePath + 'skins/default/' ;
4、在编辑器域内可以使用Tab键。(1为是,0为否)
FCKConfig.TabSpaces = 0 ; 改为FCKConfig.TabSpaces = 1 ;


5、加上几种我们常用的字体的方法,例如:
修改
FCKConfig.FontNames = 'Arial;Comic Sans MS;Courier New;Tahoma;Times New Roman;Verdana' ;

FCKConfig.FontNames = '宋体;黑体;隶书;楷体_GB2312;Arial;Comic Sans MS;Courier New;Tahoma;Times New Roman;Verdana'


6、编辑器域内默认的显示字体为12px,想要修改可以通过修改样式表来达到要求,打开/editor/css/fck_editorarea.css,修改font-size属性即可。如font-size: 14px;


7、关于安全性。
如果你的编辑器用在网站前台的话,那就不得不考虑安全了,在前台千万不要使用Default的toolbar,要么自定义一下功能,要么就用系统已经定义好的Basic,也就是基本的toolbar,
修改
FCKConfig.ToolbarSets["Basic"] = [
    ['Bold','Italic','-','OrderedList','UnorderedList','-','Link','Unlink','-','About']

FCKConfig.ToolbarSets["Basic"] = [
['Bold','Italic','-','OrderedList','UnorderedList','-','Unlink','-','Style','FontSize','TextColor','BGColor','-','Smiley','SpecialChar','Replace','Preview']
] ;
   第四步:在Web.Config文件里面添加,如下所示

1、配置WebConfig,在<appSettings>节点添加,如下所示:
如果你用的是默认的上传功能,则
    <add key="FCKeditor:BasePath" value="~/fckeditor/"/>
    <add key="FCKeditor:UserFilesPath" value="/网站名称/UploadFiles/"/>
第五步:在页面里应用FCKeditor编辑器

<%@ Page Language="C#" AutoEventWireup="true"   CodeFile="Default.aspx.cs" Inherits="_Default" validateRequest="false" %>

<%@ Register Assembly="FredCK.FCKeditorV2" Namespace="FredCK.FCKeditorV2" TagPrefix="FCKeditorV2" %>
// 这里要主要两个参数
// 默认为<%@ Page Language="C#" AutoEventWireup="true"   CodeFile="Default.aspx.cs" Inherits="_Default" %>
// 我们要添加一个参数 validateRequest=false,否则提交带html代码的内容会报错
// 从客户端(...)中检测到有潜在危险的 Request.Form 值。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "">

<html xmlns="" >
<head runat="server">
    <title>无标题页</title>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <FCKeditorV2:FCKeditor ID="FCKeditor1" runat="server">
        </FCKeditorV2:FCKeditor>
        &nbsp;</div>
    </form>
</body>
</html>
如何获取其内容呢?读取FCKeditor1控件的Value属性值即可。

到这里基本OK了,但是我发现在使用图片上传功能的时候,会弹出一个阻止框,显示"this connector is disabled Please check the"editor/filemanager/connectors/aspx/config.aspx",解决这个错误的方法是打开editor/filemanager/connectors/aspx/config.ascx修改CheckAuthentication()方法,返回true

C# code

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;
}

    本站是提供个人知识管理的网络存储空间,所有内容均由用户发布,不代表本站观点。请注意甄别内容中的联系方式、诱导购买等信息,谨防诈骗。如发现有害或侵权内容,请点击一键举报。

    0条评论

    发表

    请遵守用户 评论公约

    类似文章 更多