Ueditor Baidu Rich Text Editor Solution

ASP. net2.0 is used for website writing.

However, I have read all the instructions for using Baidu's rich text editor. . NET Framework 4.0

Various solutions Baidu has watched for a long time

I downloaded the latest version of Baidu Rich Text Editor and changed the. sln file information. If you can use vs2008 to open it, some errors will be reported .. The class name does not exist.

Baidu had not solved the problem for a long time and then gave up. (Baidu was used eventually)

So I found kindeditor, but I thought he was a little ugly .. Give up

Then I saw a blog post on Baidu ueditor's configuration method.

Http://blog.sina.com.cn/s/blog_55b0c6470100y8kp.html

Baidu editor ueditor1.1.8.1 for Asp.net

I suddenly realized that the starting solution was how to deploy the latest version on. NET framework2.0. Why not change the idea of using a lower version. . NET Framework.

Okay, I don't know what the general process is. It's not that bad. I'll talk about the details in the configuration process.

1. Of course, the file is downloaded.

2. Create a ueditor folder and paste the downloaded file into the directory structure.

3. Modify dialogs/image/image.html

URL: '../Server/upload/NET/up. ashx', // URL of the upload processing page

4. Create up. ashx under server/upload/NET/to process uploaded images.

Up. ashx

 

Using system; using system. collections; using system. data; using system. web; using system. web. services; using system. web. services. protocols; using system. io; namespace editor .ueditor.server.upload.net {// <summary> // $ codebehindclassname $ abstract description /// </Summary> [WebService (namespace = "http://tempuri.org/")] [webservicebinding (conformsto = wsiprofiles. basicprofile1_1)] public class up: ihttphandler {publi C void processrequest (httpcontext context) {context. response. contenttype = "text/plain"; // context. response. write ("Hello World"); string uploadpath = "userfiles/ueditoruploads"; // save path string filetype = ".jpg, .htm, .gif, .png, .bmp"; // the file format can be int filesize = 2048; // file size limit, in KB string state = ""; string sfilename = ""; string retpath = ""; httppostedfile ofile = context. request. files [0]; string PICT Itle = context. request. form ["pictitle"]; // obtain the image description string fileextension = system. io. path. getextension (ofile. filename ). tolower (); If (filetype. tolower (). indexof (fileextension)>-1 & isallowedextension (ofile) // checks whether the file type is allowed. {If (filesize * 1024> = ofile. contentlength) {try {string directorypath; // cancel the following annotation by folder archive storage // directorypath = uploadpath + datetime. now. tostring ("yyyy-mm"); directorypath = Uploadpath; sfilename = datetime. now. tostring ("yyyymmddhhmmssffff"); // file name // generate a random number to avoid uploading random RND = new random (); int numsj = RND. next (1000,999 9); sfilename = sfilename + convert. tostring (numsj); string fullpath = "~ /"+ Directorypath +"/"+ sfilename + fileextension; // final file path if (! Directory. exists (context. server. mappath ("~ /"+ Directorypath) directory. createdirectory (context. server. mappath ("~ /"+ Directorypath); ofile. saveas (context. server. mappath (fullpath); // response. write ("parent. reloadimg ('"+ Page. resolveurl (fullpath) + "');" + "location. href = 'upload. aspx? Url = "+ Page. resolveurl (fullpath) + "';"); // string retpath = "/" + directorypath + "/" + sfilename + fileextension; retpath = sfilename + fileextension; state = "success";} catch (exception ex) {// response. write ("failed to upload the file. "+ Ex. Message); // MessageBox. showandredirect (this," failed to upload the file. "+ Ex. message, "upload. aspx "); State =" failed to upload the file, "+ ex. message ;}} else {state = "the size of the uploaded file has exceeded the limit" ;}} else {state = "the file extension is not allowed ";} // return the upload information context. response. write ("{'url': '" + retpath + "', 'title': '" + pictitle + "', 'state ': '"+ state +"'} ");} public bool isreusable {get {return false ;}} /// <summary> /// C # function for detecting real file types /// </Summary> /// <Param name = "hifile"> </param> // /<returns> </returns> private bool isallowedextension (httppostedfile hifile) {bool ret = false; system. io. stream FS = hifile. inputstream; system. io. binaryreader r = new system. io. binaryreader (FS); string fileclass = ""; byte buffer; try {buffer = R. readbyte (); fileclass = buffer. tostring (); buffer = R. readbyte (); fileclass + = buffer. tostring () ;}catch {return false ;}// R. close (); // FS. close (); // string [] filetype = {"255216", "7173", "6677", "13780", "8297", "5549", "870 ", "87111", "8075"}; // pure image string [] filetype = {"7173", // GIF "255216", // jpg "13780 ", // PNG "6677" // BMP}; For (INT I = 0; I <filetype. length; I ++) {If (fileclass = filetype [I]) {ret = true; break ;}} return ret ;}}}

5. Modify ueditor/editor_config.js

(Function () {// You can configure the relative or absolute path between the ueditor directory and the root directory on your website (the absolute path starting with HTTP) // window. ueditor_home_url can be configured externally, so you do not need to configure it here // scenario: If you have multiple pages using the editor in the same directory, because the paths are different, therefore, configure this path on the page where the editor is used and write it outside the Js. // var url = Window. ueditor_home_url | '.. /'; var TMP = Window. location. pathname, // URL = TMP. substr (0, TMP. lastindexof ("\/") + 1 ). replace ("_ examples/", ""); // You can configure the relative or absolute path of the ueditor directory on your website (the absolute path starting with HTTP) url = "ueditor" // This Value: ueditor_config = {ImagePath: "userfiles/ueditoruploads/", // path of the image folder, which is used to modify the image URL returned by the background when the folder is displayed! The image storage path must be set in the background .! Important compressside: 0, // benchmark for proportional compression, determine the reference object of the maximagesidelength parameter. 0 is the longest side, 1 is the width, 2 is the maximum allowed side length of the uploaded image according to the height of maximagesidelength: 900, // if it exceeds the maximum side length, it will automatically scale proportionally, set a relatively large value of relativepath: true without scaling, // whether to enable the relative path. The path of all local images in the Enabled state will be saved as a relative path. We strongly recommend that you enable this function! Catcherurl: "getimage. php", // ueditor_home_url: URL, // Add a global path for the editor

6 test. aspx Test File

Validaterequest = "false" must have this code, because when submitting information on the Asp.net interface, HTML JavaScript code cannot be entered. To prevent script injection attacks

<% @ Page Language = "C #" validaterequest = "false" autoeventwireup = "true" codebehind = "test. aspx. cs" inherits = "editor. Test" %> <! Doctype HTML public "-// W3C // dtd xhtml 1.0 transitional // en" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <HTML xmlns = "http://www.w3.org/1999/xhtml"> 
Test. aspx background code how to obtain foreground values
Using system; using system. collections; using system. configuration; using system. data; using system. web; using system. web. security; using system. web. ui; using system. web. UI. htmlcontrols; using system. web. UI. webcontrols; using system. web. UI. webcontrols. webparts; namespace editor {public partial class test: system. web. UI. page {protected void page_load (Object sender, eventargs e) {If (! Ispostback) {}}/// <summary> /// obtain the submitted content /// </Summary> /// <Param name = "sender"> </param> // /<Param name = "E"> </param> protected void btnsubmit_click (Object sender, eventargs e) {string STR = This. editorvalue. innerhtml; // test to obtain the value of the edited text string str1 = request. params ["editorvalue"]. tostring (); clientscript. registerclientscriptblock (this. getType (), "S", "alert ('" + str1 + "')", true); this. editorvaluedata. innerhtml = str1 ;}}}
OK
 
 
 
 
 
 
Ueditor Baidu Rich Text Editor Solution