百度Web富文本编辑器ueditor在ASP.NET MVC3项目中的使用说明
Posted on 2015-09-05 17:13 SummerRain 阅读(532) 评论(0) 编辑 收藏 举报
======================================================================
【百度Web富文本编辑器ueditor在ASP.NET MVC3项目中的使用说明】
----by 夏春涛 2014-02-20
======================================================================
运行环境：
ueditor-v1.3.6-utf8-net，VS2010旗舰版+SP1，ASP.NET MVC3。
将下载后的ueditor压缩包的所有文件拷贝到/Content/ueditor目录中。
1.WEB视图页面中如下配置，运行时应能看到完整的富文本编辑器界面：
<!-- ******************************************************************** -->
<link rel="stylesheet" href="@Url.Content("~/Content/ueditor/themes/default/css/ueditor.min.css")" type="text/css" />
<script src="@Url.Content("~/Content/ueditor/ueditor.config.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Content/ueditor/ueditor.all.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Content/ueditor/lang/zh-cn/zh-cn.js")" type="text/javascript"></script>
<!-- ******************************************************************* -->
..
@Html.TextAreaFor(p => p.Content)
..
<script type="text/javascript">
UE.getEditor("Content");//初始化富文本编辑器
</script>
2.修改ueditor.config.js内容，在函数第一行增加ueditor目录路径配置，该路径是相对于网站根目录的,
如是http://www.xxx.com/Content/ueditor/ 则为 /Content/ueditor/。
配置好后插入图片等操作的对话框显示样式会变得正常。
window.UEDITOR_HOME_URL = "/Content/ueditor/";
3.根据需要修改ueditor.config.js内容，以下列举了一些常用项：
, initialFrameWidth: 760 //编辑器宽度
, initialFrameHeight: 400 //编辑器高度
, wordCount: false //编辑器下方显示控制：不让编辑器统计字数
, elementPathEnabled: false //编辑器下方显示控制：不显示元素路径
, autoHeightEnabled: false //不让编辑自动长高（这样，当内容较多时会出现上下滚动条，而不至于把网页撑大）
4.解决“检测到有潜在危险的 Request.Form 值”的问题。
错误提示：
从客户端(Content="<p><span style="colo...")中检测到有潜在危险的 Request.Form 值。
原因说明：
因为富文本编辑器产生的内容中会包含<>"等特殊字符，服务器默认进行内容安全检测并阻止代码运行。
解决办法：
为Action添加属性：[ValidateInput(false)]，示例：
[HttpPost]
[ValidateInput(false)] //不进行内容检测
public ActionResult NewsEdit(News newsModel)
{
//...
}
5.★解决文件不能上传的问题。
错误提示：
Url: http://localhost:11685/Content/ueditor/net/fileUp.ashx
Description: e:\我们的项目\BetterMIS\project\BetterMIS.WebViews\Content\ueditor\net\fileUp.ashx(34): error CS0433:
类型“Uploader”同时存在于“c:\Windows\Microsoft.NET\Framework\v4.0.30319\Temporary ASP.NET Files\root\98d019ee\65f02c2e\App_Web_uploader.cs.d026ad6.qqgskfar.dll”
和“c:\Windows\Microsoft.NET\Framework\v4.0.30319\Temporary ASP.NET Files\root\98d019ee\65f02c2e\assembly\dl3\a6a5387f\ee12af20_0d2ecf01\BetterMIS.WebViews.DLL”中。
解决办法：
ueditor的net文件夹下的Uploader.cs文件的生成操作属性默认是“编译”，只需要将这个文件的生成操作属性改为“内容”，
上传图片的功能就可以正常成功使用了！[源自：http://www.cnblogs.com/beyond1983/archive/2013/02/26/2933744.html]
原因剖析：
因为Ueditor的示例是针对Asp.net网站（不是MVC），不需要编译成DLL，直接把示例放到IIS下就可以使用啦。
6.★解决上传图片时总提示“选择保存目录：正在读取目录...”的问题。
问题现象补充：如果选择本地图片后，点击“开始上传”总是提示“请等待保存目录就绪”。
错误提示：
Url: http://localhost:11685/Content/ueditor/net/imageUp.ashx?fetch=1
Description: e:\我们的项目\BetterMIS\project\BetterMIS.WebViews\Content\ueditor\net\imageUp.ashx(18): error CS0433:
类型“Config”同时存在于“c:\Windows\Microsoft.NET\Framework\v4.0.30319\Temporary ASP.NET Files\root\98d019ee\65f02c2e\App_Web_config.cs.d026ad6.storkrj4.dll”
和“c:\Windows\Microsoft.NET\Framework\v4.0.30319\Temporary ASP.NET Files\root\98d019ee\65f02c2e\assembly\dl3\a6a5387f\02a91fba_162ecf01\BetterMIS.WebViews.DLL”中。
解决办法（原因同上）：
ueditor的net文件夹下的Config.cs文件的生成操作属性默认是“编译”，只需要将这个文件的生成操作属性改为“内容”。
7.★解决无法正常显示刚刚上传的图片的问题。
问题现象：
成功上传一张图片，插入到编辑器中，但是无法正确显示刚刚上传的图片。
原因剖析：
查看html源码可以发现图片路径中，upload1后面有2个/，手动删除一个后，返回查看，图片可以正常显示了。
解决办法1：
在imageUp.ashx文件中找到代码：
info = up.upFile(context, path + '/', filetype, size);
把把+'/'给删除掉，即：
info = up.upFile(context, path, filetype, size);
解决办法2：
在Uploader.cs文件中找到代码（在upFile函数中）：
pathbase = pathbase + "/";
修改为：
pathbase = pathbase.TrimEnd('/') + "/";
这样，可以彻底解决类似问题，因为ueditor的上传功能都是调用Uploader类实现的。
8.修改上传文件的路径：
（1）图片上传路径。修改Config.cs文件：
将
public static string[] ImageSavePath = new string[] { "upload1", "upload2", "upload3" };//即ueditor/net/upload1等目录
改为：
public static string[] ImageSavePath = new string[] { "upload/image" };//即图片上传到ueditor/net/upload/image目录中
另，对于【图片搜索】中的图片保存路径。修改getRemoteImage.ashx文件：
将
string savePath = "upload/";
改为：
string savePath = "upload/image/"; //即图片保存到ueditor/net/upload/image目录中
补充说明：对于【图片搜索】中的图片保存，系统会自动在savePath目录下再以日期为名创建文件夹来保存文件。
（2）附件（及视频文件）上传路径。修改fileUp.ashx文件：
将
String pathbase = "upload/";
改为：
String pathbase = "upload/file";//即附件上传到ueditor/net/upload/file目录中
（3）涂鸦上传路径。修改scrawUp.ashx文件：
一是将
string pathbase = "tmp/";
改为：
string pathbase = "upload/tmp/";
二是将
string pathbase = "upload/";
string tmpPath = "tmp/";
改为：
string pathbase = "upload/scraw/";
string tmpPath = "upload/tmp/";
补充说明：系统会自动在pathbase目录下再以日期为名创建文件夹来保存文件。
9.注意将upload目录的访问权限放开（右键文件夹->属性->安全->编辑，即可设置），允许everyone用户完全控制（当然安全一点应该只允许IIS_WPG账户完全控制即可）。
======================================================================
----by 夏春涛 20140220
======================================================================
