ueditor百度富文本编辑器使用解决方案

写网站的时候都是用asp.net2.0写的

但是看了百度的富文本编辑器使用说明都是。net framework 4.0 版本的

百度了半天看的各种的解决方案

我把最新版本的百度富文本编辑器下载下来改了.sln 文件信息可以用vs2008打开当然会报一些错误。。类名不存在等等

百度了半天还是没解决问题后来放弃了。（最终还是用了百度的）

于是就找了kindeditor但是觉得他长得有点丑。。还是放弃了

又接着百度ueditor配置方法看到了一篇博文

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

百度编辑器 ueditor1.1.8.1 For Asp.net 配置上传功能详解

让我恍然大悟因为开始的解决方案是如何让最新版本的在.net framework2.0上部署为什么不换个思路低版本的在。net framework上部署呢

好了不说感悟了大致过程和上面博主写的差不错我说一下配置过程中的细节

1.当然是下载文件了

2 新建ueditor文件夹将下载的文件粘贴进来如图所示目录结构 ueditor百度富文本编辑器使用解决方案

3.接下来修改dialogs/image/image.html

url:'../../server/upload/net/up.ashx', // 上传处理页面的url地址

4在server/upload/net/下新建up.ashx一般处理程序用来处理上传过来的图片

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 编辑器.ueditor.server.upload.net
{
    /// <summary>
    /// $codebehindclassname$ 的摘要说明
    /// </summary>
    [WebService(Namespace = "http://tempuri.org/")]
    [WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
    public class up : IHttpHandler
    {

        public void ProcessRequest(HttpContext context)
        {
            context.Response.ContentType = "text/plain";
            //context.Response.Write("Hello World");
            string uploadPath = "UserFiles/UEditorUploads";   //保存路径
            string fileType = ".jpg,.jpeg,.gif,.png,.bmp";   //文件允许格式
            int fileSize = 2048;    //文件大小限制，单位KB
            string state = "";
            string sFileName = "";
            string retPath = "";
            HttpPostedFile oFile = context.Request.Files[0];
            string pictitle = context.Request.Form["pictitle"];  //获得图片描述
            string fileExtension = System.IO.Path.GetExtension(oFile.FileName).ToLower();
            if (fileType.ToLower().IndexOf(fileExtension) > -1 && IsAllowedExtension(oFile))//检测是否为允许的上传文件类型
            {
                if (fileSize * 1024 >= oFile.ContentLength)
                {
                    try
                    {
                        string DirectoryPath;
                        // 取消下面注释按文件夹归档储存
                        //DirectoryPath = uploadPath + DateTime.Now.ToString("yyyy-MM");
                        DirectoryPath = uploadPath;
                        sFileName = DateTime.Now.ToString("yyyyMMddHHmmssffff");  //文件名称
                        //生成随机数，避免时间完全相同上传
                        Random rnd = new Random();
                        int numSJ = rnd.Next(1000, 9999);
                        sFileName = sFileName + Convert.ToString(numSJ);
                        string FullPath = "~/" + DirectoryPath + "/" + sFileName + fileExtension;//最终文件路径
                        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("上传文件失败。" + ex.Message);
                        //MessageBox.ShowAndRedirect(this, "上传文件失败。" + ex.Message, "upload.aspx");
                        state = "上传文件失败," + ex.Message;
                    }
                }
                else
                {
                    state = "上传文件大小超过限制";
                }
            }
            else
            {
                state = "上传文件扩展名是不允许的扩展名";
            }
            //返回上传信息
            context.Response.Write("{'url':'" + retPath + "','title':'" + pictitle + "','state':'" + state + "'}");
        }
        public bool IsReusable
        {
            get
            {
                return false;
            }
        }
        /// <summary>
        /// C#检测真实文件类型函数
        /// </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" };
            //纯图片
            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 修改ueditor/editor_config.js

(function () {
    //这里你可以配置成ueditor目录在您网站中与根目录之间的相对路径或者绝对路径（指以http开头的绝对路径）
    //window.UEDITOR_HOME_URL可以在外部配置，这里就不用配置了
    //场景：如果你有多个页面使用同一目录下的editor,因为路径不同，所以在使用editor的页面上配置这个路径写在这个js外边
    //var URL = window.UEDITOR_HOME_URL || '../';
    var tmp = window.location.pathname,
    //   URL= tmp.substr(0,tmp.lastIndexOf("\/")+1).replace("_examples/","");//这里你可以配置成ueditor目录在您网站的相对路径或者绝对路径（指以http开头的绝对路径）
     URL = "ueditor" //该值与第二步新建的文件夹同名
    UEDITOR_CONFIG = {
    imagePath:"UserFiles/UEditorUploads/", //图片文件夹所在的路径，用于显示时修正后台返回的图片url！具体图片保存路径需要在后台设置。！important
        compressSide:0, //等比压缩的基准，确定maxImageSideLength参数的参照对象。0为按照最长边，1为按照宽度，2为按照高度
        maxImageSideLength:900, //上传图片最大允许的边长，超过会自动等比缩放,不缩放就设置一个比较大的值
        relativePath:true,      //是否开启相对路径。开启状态下所有本地图片的路径都将以相对路径形式进行保存.强烈建议开启！

        catcherUrl:"getImage.php",             //处理远程图片抓取的程序地址
        UEDITOR_HOME_URL:URL, //为editor添加一个全局路径

6 test.aspx 测试文件

ValidateRequest="false"必须有这段代码因为asp.net界面提交信息时是不允许输入html javascript代码为了防止脚本注入攻击

<%@ Page Language="C#"  ValidateRequest="false"  AutoEventWireup="true" CodeBehind="test.aspx.cs" Inherits="编辑器.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">

<head id="Head1" runat="server">

<title>Ueditor测试</title>
	<meta  http-equiv="X-UA-Compatible" content="IE=5"/>
        <!-- 功能：解决兼容性视图问题-->
<script src="ueditor/editor_config.js" type="text/javascript"></script>

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

<link href="ueditor/themes/default/ueditor.css" rel="stylesheet" type="text/css"/>

</head>

<body>

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

<div id="editorValuedata" runat="server"  style="display:none;"><font color="gray">文明上网，从你我做起</font></div>

<div name="editorValue" runat="server" id="editorValue"></div>

<asp:Button ID="btnSubmit" runat="server" Text="点击我一下告诉你提交的内容" 

onclick="btnSubmit_Click"/>

</form>


<script type="text/javascript">

    var editor = new baidu.editor.ui.Editor({//实例化编辑器

        UEDITOR_HOME_URL: 'ueditor/',

        iframeCssUrl: 'ueditor/themes/default/iframe.css'

    });

    editor.render('editorValue'); //将编译器渲染到容器

    editor.setContent(document.getElementById('editorValuedata').innerHTML); //设置初始值，你可以将初始值放到<div id="editorValuedata" style="display:none"></div>内

  //  document.getElementById('editorValuedata').innerHTML = "";

</script>

</body>
</html>

test.aspx后台代码如何获取前台的值

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 编辑器
{
    public partial class test : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {
            if (!IsPostBack)
            {

            }
        }

        ///<summary>
        /// 获取提交的内容
        ///</summary>
        ///<param name="sender"></param>
        ///<param name="e"></param>
        protected void btnSubmit_Click(object sender, EventArgs e)
        {
            string str = this.editorValue.InnerHtml;
            //测试获取编辑文本的值
            string str1 = Request.Params["editorValue"].ToString();
            ClientScript.RegisterClientScriptBlock(this.GetType(), "s", "alert('" + str1 + "')", true);
            this.editorValuedata.InnerHtml = str1;
        }
    }
}

OK了

秒客网

ueditor百度富文本编辑器使用解决方案

百度编辑器 ueditor1.1.8.1 For Asp.net 配置上传功能详解

相关文章

ueditor百度富文本编辑器使用解决方案

百度编辑器 ueditor1.1.8.1 For Asp.net 配置 上传功能详解

相关文章

百度编辑器 ueditor1.1.8.1 For Asp.net 配置上传功能详解