步步为营-91-富文本编辑器

需要的文件包已经上传到对应的百度网盘中了

1:富文本编辑器 需要注意的是:禁止对页面的安全监测主要是"<>"

a:配置webConfig文件

<system.web>
<httpRuntime requestValidationMode="2.0"/>

</system.web>

b:<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="CkEditDemo.aspx.cs" Inherits="BookShopManager.Web.Test.CkEditDemo" ValidateRequest="false"%>

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="CkEditDemo.aspx.cs" Inherits="BookShopManager.Web.Test.CkEditDemo" ValidateRequest="false"%>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title></title>
    <script src="../Ckeditor/ckeditor.js"></script>
</head>
<body>
    <form id="form1" name="form1" runat="server">
    <div>
    <textarea cols="100" id="editor1" name="editor1" rows="10"></textarea>

        <script type="text/javascript">
            //<![CDATA[
            // Replace the <textarea id="editor1"> with an CKEditor instance.
            var editor = CKEDITOR.replace(‘editor1‘);
            //]]>

        </script>
<input type="submit" name="name" value="提交" />
    </div>
    </form>
</body>
</html>

前台

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;

namespace BookShopManager.Web.Test
{
    public partial class CkEditDemo : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {
            if (IsPostBack)
            {
                Response.Write(Request.Form["editor1"]);
            }
        }
    }
}

后台

隐患:js脚本攻击

2:UBB编辑器

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="UBBDemo.aspx.cs" Inherits="BookShopManager.Web.Test.UBBDemo" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title></title>
    <script src="/js/jquery-1.7.1.js"></script>
    <script src="../Ckeditor/ckeditor.js"></script>
    <script type="text/javascript">
        $(function () {
            loadUBBCode();//加载UBB编辑器
        });
        //加载UBB编辑器
        function loadUBBCode() {
            CKEDITOR.replace(‘editor1‘,
    {
        extraPlugins: ‘bbcode‘,
        removePlugins: ‘bidi,button,dialogadvtab,div,filebrowser,flash,format,forms,horizontalrule,iframe,indent,justify,liststyle,pagebreak,showborders,stylescombo,table,tabletools,templates‘,
        toolbar:
        [
            [‘Source‘, ‘-‘, ‘Save‘, ‘NewPage‘, ‘-‘, ‘Undo‘, ‘Redo‘],
            [‘Find‘, ‘Replace‘, ‘-‘, ‘SelectAll‘, ‘RemoveFormat‘],
            [‘Link‘, ‘Unlink‘, ‘Image‘],
            ‘/‘,
            [‘FontSize‘, ‘Bold‘, ‘Italic‘, ‘Underline‘],
            [‘NumberedList‘, ‘BulletedList‘, ‘-‘, ‘Blockquote‘],
            [‘TextColor‘, ‘-‘, ‘Smiley‘, ‘SpecialChar‘, ‘-‘, ‘Maximize‘]
        ],
        smiley_images:
        [
            ‘regular_smile.gif‘, ‘sad_smile.gif‘, ‘wink_smile.gif‘, ‘teeth_smile.gif‘, ‘tounge_smile.gif‘,
            ‘embaressed_smile.gif‘, ‘omg_smile.gif‘, ‘whatchutalkingabout_smile.gif‘, ‘angel_smile.gif‘, ‘shades_smile.gif‘,
            ‘cry_smile.gif‘, ‘kiss.gif‘
        ],
        smiley_descriptions:
        [
            ‘smiley‘, ‘sad‘, ‘wink‘, ‘laugh‘, ‘cheeky‘, ‘blush‘, ‘surprise‘,
            ‘indecision‘, ‘angel‘, ‘cool‘, ‘crying‘, ‘kiss‘
        ]
    });
        }
    </script>

</head>
<body>
    <form id="form1" name="form1" runat="server">
        <div>
            <textarea cols="100" id="editor1" name="editor1" rows="10"></textarea>
            <input type="submit" name="name" value="提交" />
        </div>
    </form>
</body>
</html>

前台

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text.RegularExpressions;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;

namespace BookShopManager.Web.Test
{
    public partial class UBBDemo : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {
            if (IsPostBack)
            {
                Response.Write(UbbToHtml(Request.Form["editor1"]));
            }

        }
        private string UbbToHtml(string argString)
        {
            string tString = argString;
            if (tString != "")
            {
                Regex tRegex;
                bool tState = true;
                tString = tString.Replace("&", "&amp;");
                tString = tString.Replace(">", "&gt;");
                tString = tString.Replace("<", "&lt;");
                tString = tString.Replace("\"", "&quot;");
                tString = Regex.Replace(tString, @"\[br\]", "<br />", RegexOptions.IgnoreCase);
                string[,] tRegexAry = {
          {@"\[p\]([^\[]*?)\[\/p\]", "$1<br />"},
          {@"\[b\]([^\[]*?)\[\/b\]", "<b>$1</b>"},
          {@"\[i\]([^\[]*?)\[\/i\]", "<i>$1</i>"},
          {@"\[u\]([^\[]*?)\[\/u\]", "<u>$1</u>"},
          {@"\[ol\]([^\[]*?)\[\/ol\]", "<ol>$1</ol>"},
          {@"\[ul\]([^\[]*?)\[\/ul\]", "<ul>$1</ul>"},
          {@"\[li\]([^\[]*?)\[\/li\]", "<li>$1</li>"},
          {@"\[code\]([^\[]*?)\[\/code\]", "<div class=\"ubb_code\">$1</div>"},
          {@"\[quote\]([^\[]*?)\[\/quote\]", "<div class=\"ubb_quote\">$1</div>"},
          {@"\[color=([^\]]*)\]([^\[]*?)\[\/color\]", "<font style=\"color: $1\">$2</font>"},
          {@"\[hilitecolor=([^\]]*)\]([^\[]*?)\[\/hilitecolor\]", "<font style=\"background-color: $1\">$2</font>"},
          {@"\[align=([^\]]*)\]([^\[]*?)\[\/align\]", "<div style=\"text-align: $1\">$2</div>"},
          {@"\[url=([^\]]*)\]([^\[]*?)\[\/url\]", "<a href=\"$1\">$2</a>"},
          {@"\[img\]([^\[]*?)\[\/img\]", "<img src=\"$1\" />"}
        };
                while (tState)
                {
                    tState = false;
                    for (int ti = 0; ti < tRegexAry.GetLength(0); ti++)
                    {
                        tRegex = new Regex(tRegexAry[ti, 0], RegexOptions.IgnoreCase);
                        if (tRegex.Match(tString).Success)
                        {
                            tState = true;
                            tString = Regex.Replace(tString, tRegexAry[ti, 0], tRegexAry[ti, 1], RegexOptions.IgnoreCase);
                        }
                    }
                }
            }
            return tString;
        }
    }
}

后台

时间: 2024-10-12 14:55:31

步步为营-91-富文本编辑器的相关文章

商城项目整理(四)JDBC+富文本编辑器实现商品增加,样式设置,和修改

UEditor富文本编辑器:http://ueditor.baidu.com/website/ 相应页面展示: 商品添加: 商品修改: 前台商品展示: 商品表建表语句: 1 create table TEST.GOODS_TABLE 2 ( 3 gid NUMBER not null, 4 gname VARCHAR2(90), 5 gdetails CLOB, 6 gpicture VARCHAR2(100), 7 gprice NUMBER, 8 gleixing NUMBER, 9 gpi

kindEditor 富文本编辑器 使用介绍

第一版:存放位置:  ---->把该创建的文件包放到javaWeb 过程的 WEB_INF 下:如图所示. 第二步:< kindEditor 插件的引用> :JS引用 1 <script type="text/javascript" charset="utf-8" src="/js/kindeditor-4.1.10/kindeditor-all-min.js"></script> 2 <scrip

ASP.NET MVC + 百度富文本编辑器 + EasyUi + EntityFrameWork 制作一个添加新闻功能

本文将交大伙怎么集成ASP.NET MVC + 百度富文本编辑器 + EasyUi + EntityFrameWork来制作一个新闻系统 先上截图: 添加页面如下: 下面来看代码部分 列表页如下: 1 @{ 2 Layout = null; 3 } 4 5 <!DOCTYPE html> 6 7 <html> 8 <head> 9 <meta name="viewport" content="width=device-width&qu

wangEditor富文本编辑器

设置好了是这样的, 有一个ID问content的编辑框,方便获取,这里的富文本编辑器的版本是2.2 官方文档说3就不支持textarea了 导入一下css 记得css文件夹下应该又3个文件,虽然没有直接引用,但是我感觉应该都引用了,没有的话又报错!很皮 之后就是Jquery,和他给的一个js文件,还有加一段代码引用一下OK了 项目的源码https://files.cnblogs.com/files/wlphp/%E5%AF%8C%E6%96%87%E6%9C%AC%E7%BC%96%E8%BE%

富文本编辑器TinyMCE的使用(React Vue)

富文本编辑器TinyMCE的使用(React Vue) 一,需求与介绍 1.1,需求 编辑新闻等富有个性化的文本 1.2,介绍 TinyMCE是一款易用.且功能强大的所见即所得的富文本编辑器. TinyMCE的优势: 开源可商用,基于LGPL2.1 插件丰富,自带插件基本涵盖日常所需功能 接口丰富,可扩展性强,有能力可以无限拓展功能 界面好看,符合现代审美 提供经典.内联.沉浸无干扰三种模式 对标准支持优秀(自v5开始) 多语言支持,官网可下载几十种语言. 二,配置集成并组件化 2.1,通用配置

TinyMCE(富文本编辑器)

[转]TinyMCE(富文本编辑器)在Asp.Net中的使用方法 官网演示以及示例代码:https://www.tinymce.com/docs/demo/image-tools/ 转自:http://www.cnblogs.com/hahacjh/archive/2010/07/24/1784268.html TinyMCE 在Asp.Net中的使用方法其实挺简单的,从官方网站下载TinyMCE),然后将里面的jscripts目录拷到你的网站目录 假设你的aspx页面中某一个地方需要用到编辑器

Android富文本编辑器RichEditor的使用

以前有个项目做一个笔记本类似的东西,觉得写的不太好,最近重新写,就发现了这个富文本编辑器他的效果是这样的 感觉有点厉害啊 废话不多说开始撸码 1先添加依赖 dependencies { compile 'jp.wasabeef:richeditor-android:1.2.0' } 2写布局 <jp.wasabeef.richeditor.RichEditor android:id="@+id/editor" android:layout_width="match_pa

关于富文本编辑器UEditor

2017.1.18,星期三?     关于富文本编辑器:     富文本编辑器,Rich Text Editor, 简称 RTE, 是一种可内嵌于浏览器,所见即所得的文本编辑器. 富文本编辑器不同于文本编辑器,程序员可到网上下载免费的富文本编辑器内嵌于自己的网站或程序里(当然付费的功能会更强大些),方便用户编辑文章或信息.比较好的文本编辑器有kindeditor,fckeditor等. 关于UEditor:官网                           UEditor文档,我们的说明书

UEditor百度富文本编辑器--让编辑器自适应宽度的解决方案

UEditor百度富文本编辑器的initialFrameWidth属性,默认值是1000. 不能够自适应屏幕宽度.如图1: 刚开始的时候,我是直接设置initialFrameWidth=null的.效果如图2: 这样子UEditor百度富文本编辑器会在第一次加载的时候获取屏幕宽度,然后赋值给initialFrameWidth属性. 这样子确实是可以在第一次加载的时候适应屏幕宽度,但是却似乎宽度稍微过了一点点,超过上面的灰条了.而且这里还有一个问题: 当你改变浏览器大小时,会有个很严重的排版BUG

富文本编辑器UEditor的配置使用方法

将下载的富文本编辑器的文件解压后放到 webcontent 下 如果 文件中的jsp文件夹下的controller.java文件报错的话    就将jsp下的lib文件夹中的文件都复制到  web-inf 文件夹下的lib中,就可以解决报错的问题了 按理说 还需要修改config.js中的URL值  但是我没修改  运行也出来效果了 <%@ page language="java" contentType="text/html; charset=utf-8"