Configure and use the CKEditor legend in asp.net

Source: Internet
Author: User
Tags allkeys httpcontext

1. Download the latest CKEditor and CKFinder on the official website (http://cksource.com. Here is the version and example I uploaded.

2. There are a lot of things in the two folders, and the content is comprehensive, but we use not all things, so we select what we need to add to the project. This is the CKEditor and CKFinder files in the project.

3. Add code to the foreground

The code is as follows: Copy code


<Head runat = "server">
<Title> </title>
<Script src = "JS/ckedit/ckeditor. js" type = "text/javascript"> </script> <! -- Mandatory -->
<Style type = "text/css">
. Ckeditor
{}
</Style>
</Head>
<Body>
<Form id = "form1" runat = "server">
<Div>
<Asp: TextBox ID = "TextBox1" runat = "server" TextMode = "MultiLine"
CssClass = "ckeditor" Height = "207px" Width = "517px"> </asp: TextBox>
</Div>
<Asp: Button ID = "Button1" runat = "server" onclick = "button#click" Text = "show"/> <! -- Click the event generated in the background -->
</Form>
</Body>

4. CKEditor does not provide its own upload function. Therefore, you must use CKFinder to upload files.

(1) add reference CKFinder. dll to the project

(2) configure CKEditor's config. js (Directory:/CKEditor/config. js) and add it to the CKEDITOR. editorConfig function. Unwanted features can be removed.

The code is as follows:

The code is as follows: Copy code


/*
Copyright (c) 2003-2010, CKSource-Frederico Knabben. All rights reserved.
For licensing, see LICENSE.html or http://ckeditor.com/license
*/

CKEDITOR. editorConfig = function (config ){
// Define changes to default configuration here. For example:
// Config. language = 'Fr ';
// Config. uiColor = '# AADC6E ';

Var ckfinderPath = "/JS"; // pay attention to this issue. JS is a folder containing CKEditor and CKFinder.
Config. filebrowserBrowseUrl = ckfinderPath + '/ckfinder/ckfinder.html ';
Config. filebrowserImageBrowseUrl = ckfinderPath + '/ckfinder/ckfinder.html? Type = Images ';
Config. filebrowserFlashBrowseUrl = ckfinderPath + '/ckfinder/ckfinder.html? Type = Flash ';
Config. filebrowserUploadUrl = ckfinderPath + '/ckfinder/core/connector/aspx/connector. aspx? Command = QuickUpload & type = Files ';
Config. filebrowserImageUploadUrl = ckfinderPath + '/ckfinder/core/connector/aspx/connector. aspx? Command = QuickUpload & type = Images ';
Config. filebrowserFlashUploadUrl = ckfinderPath + '/ckfinder/core/connector/aspx/connector. aspx? Command = QuickUpload & type = Flash ';
};

After the configuration is complete, CKEditor provides the upload function. However, if you upload images, flash files, and other files with the original file name, duplicate names may occur,

So we need to change the file name to a random file name.

5. Modify the CKFinder source code. CKFinder comes with source code, directory:/CKFinde/_ source, open the project,

(1) open the/Settings/ConfigFile. cs file and modify the file. For details, see the special mark.

The code is as follows: Copy code

Using System;
Using System. Collections;
Using System. Collections. Generic;
Using System. Text;
Using System. Text. RegularExpressions;

Namespace CKFinder. Settings
{
Public class ConfigFile: System. Web. UI. UserControl
    {
Public string LicenseName;
Public string LicenseKey;
Public string BaseUrl;
Public string BaseDir;
Public bool RandomReName; // rename randomly
Public bool SecureImageUploads;
Public bool ForceSingleExtension;
Public bool CheckDoubleExtension;
Public bool CheckSizeAfterScaling;
Public bool DisallowUnsafeCharacters;
Public string [] HtmlExtensions;
Public string [] Plugins;
Public Hashtable PluginSettings;

Public string DefaultResourceTypes;

Private Thumbnails _ Thumbnails;
Private Images _ Images;
Private AccessControlManager _ AccessControl;
Private ResourceTypeManager _ ResourceType;

Private string [] _ HideFolders;
Private string [] _ HideFiles;

Internal Regex HideFoldersRegex;
Internal Regex HideFilesRegex;

Public string RoleSessionVar;

Private static ConfigFile _ Current;

Public ConfigFile ()
        {
_ Thumbnails = new Thumbnails ();
_ Images = new Images ();
_ AccessControl = new AccessControlManager ();
_ ResourceType = new ResourceTypeManager ();

This. HideFolders = new string [0];
This. HideFiles = new string [0];

LicenseName = "";
LicenseKey = "";
BaseUrl = "/ckfinder/userfiles /";
BaseDir = "";
RandomReName = true;
ForceSingleExtension = true;
CheckSizeAfterScaling = true;
DisallowUnsafeCharacters = true;
CheckDoubleExtension = true;
DefaultResourceTypes = "";
HtmlExtensions = new string [0];
Plugins = new string [0];
PluginSettings = new Hashtable ();
RoleSessionVar = "";
}/* ----- The following content has been omitted ------------*/
    }
}

(2) open the/Connector/Config. cs file,

Locate about 60 rows and add an attribute:

The code is as follows: Copy code

Public bool RandomReName

{

Get {return Settings. ConfigFile. Current. RandomReName ;}

}

(3) open the/Connector/CommandHandlers/FileUploadCommandHandler. cs file and add a judgment code. The following shows some code, which has been marked

The code is as follows: Copy code


Using System;
Using System. Web;
Using System. Text. RegularExpressions;

Namespace CKFinder. Connector. CommandHandlers
{
Public class FileUploadCommandHandler: CommandHandlerBase
    {
Public FileUploadCommandHandler ()
: Base ()
        {
        }
Public static string sFileName = null;
Public override void SendResponse (System. Web. HttpResponse response)
        {
Int iErrorNumber = 0;
// String sFileName = "";
String sFilePath = "";
String sUnsafeFileName = "";

Try
            {
This. CheckConnector ();
This. CheckRequest ();

If (! This. CurrentFolder. CheckAcl (AccessControlRules. FileUpload ))
                {
ConnectorException. Throw (Errors. Unauthorized );
                }

HttpPostedFile oFile = null;
If (HttpContext. Current. Request. Files ["upload"]! = Null)
                {
OFile = HttpContext. Current. Request. Files ["upload"];
                }
Else if (HttpContext. Current. Request. Files ["NewFile"]! = Null)
                {
OFile = HttpContext. Current. Request. Files ["NewFile"];
                }
Else if (HttpContext. Current. Request. Files. AllKeys. Length> 0)
                {
OFile = HttpContext. Current. Request. Files [HttpContext. Current. Request. Files. AllKeys [0];
                }

If (oFile! = Null)
                {
SFileName = oFile. FileName;

If (Config. Current. CheckDoubleExtension)
SFileName = this. CurrentFolder. ResourceTypeInfo. ReplaceInvalidDoubleExtensions (sFileName );

SUnsafeFileName = sFileName;
                   
If (Config. Current. DisallowUnsafeCharacters)
SFileName = sFileName. Replace (";","_");

// Replace dots in the name with underscores (only one dot can be there... security issue ).
If (Config. Current. ForceSingleExtension)
SFileName = Regex. Replace (sFileName ,@".(?! [^.] * $) "," _ ", RegexOptions. None );

If (sFileName! = SUnsafeFileName)
IErrorNumber = Errors. UploadedInvalidNameRenamed;

If (Connector. CheckFileName (sFileName )&&! Config. Current. CheckIsHiddenFile (sFileName ))
                    {
If (! Config. Current. CheckSizeAfterScaling & this. CurrentFolder. ResourceTypeInfo. MaxSize> 0 & oFile. ContentLength> this. CurrentFolder. ResourceTypeInfo. MaxSize)
ConnectorException. Throw (Errors. UploadedTooBig );

String sExtension = System. IO. Path. GetExtension (sFileName );
SExtension = sExtension. TrimStart ('.');
If (Config. Current. RandomReName) // use a random name
                        {
SFileName = DateTime. Now. ToString ("yyyyMMddHHmmssfff") + "." + sExtension;
}/* The remaining part of the code has been omitted. For details about the code, see my project code. The download address is */}}}
    }
}

4) regenerate the project. In the bin folder, locate CKFinder. dll and add a reference to CKFinder. dll for the first project. The last step is to open/ckfinder/config. ascx.

In SetConfig (), add a property: (in fact, this addition and not adding are acceptable, because the default value has been set before, but must be set to false when using the original name)

RandomReName = true; // use a random file name after uploading

Now, the configuration is successful.

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.