TinyMCE不能插入媒体播放器的解决方案
- 时间：2015年04月02日 15:28:11 来源：魔法猪系统重装大师官网 人气：4273
在使用TinyMCE插入媒体代码时，会把原始的HTML替换为img标签，并且把原始数据转换为json格式的数据，例如：
原始HTML片段：
TinyMCE格式化后的HTML片段：
到官网以及stackoverflow查了半天，类似问题的解决方案貌似是配置TinyMCE的valid_elements属性，但我试过都不管用。
最终的解决办法是采取了一种曲线救国的方式，大致思路如下：
采用HtmlAgilityPack来解析获取到的编辑器内容。
提取其中匹配的视频元素
替换该元素，使用格式化后标准的HTML媒体元素，例如
关键点：
1，XPATH表达式 //img[@class="mceItemMedia mceItemFlash"]
2，json字符串到.net对象的转换，不想单独定义，试了下json to dynamic类型，竟然是ok的，看来json.Net这个类库很强大。
贴上转换部分的代码，在有多个匹配元素的情况下，采用遍历HtmlAgilityPack.HtmlNode的方式一直没成功，不知道是我没用对，还是HtmlAgilityPack的问题，最终是采用了字符串替换的方式。
private string HandleMediaContent(string content)
{
var reStr = string.Empty;
reStr = content;
string template = "";
HtmlAgilityPack.HtmlDocument doc = new HtmlAgilityPack.HtmlDocument();
doc.LoadHtml(content);
var vNodes = doc.DocumentNode.SelectNodes("//img[@class=\"mceItemMedia mceItemFlash\"]");
if (vNodes == null)
return content;
for (var i=0;i
//var parent = vNodes[i].ParentNode;
var attr = vNodes[i].Attributes.FirstOrDefault(t => t.Name == "data-mce-json");
var width = vNodes[i].Attributes.FirstOrDefault(t => t.Name == "width");
var height = vNodes[i].Attributes.FirstOrDefault(t => t.Name == "height");
var obj = Newtonsoft.Json.JsonConvert.DeserializeObject
var newNodeDocument = new HtmlAgilityPack.HtmlDocument();
newNodeDocument.LoadHtml(string.Format(template,width.Value,height.Value,obj.@params.src,obj.@params.src));
//parent.InsertBefore(newNodeDocument.DocumentNode, vNodes[i]);
//parent.RemoveChild(vNodes[i]);
reStr = reStr.Replace(vNodes[i].OuterHtml, newNodeDocument.DocumentNode.OuterHtml);
}
//return doc.DocumentNode.OuterHtml;
return reStr;
}
