kindEditor支持mp4视频

参考资料：https://blog.csdn.net/wkj001/article/details/88742232

原文标题：kindeditor插入mp4视频不显示及不过滤video的方法

1.将video添加为不需要过滤过的标签

video : ['id', 'class', 'src', 'width', 'height', 'type', 'loop', 'autostart', 'quality', '.width', '.height', 'align', 'allowscriptaccess','controls'],

 

2.加上MP4视频类型

if (/\.(mp4)(\?|$)/i.test(src)) {
    return 'video/mp4';
}

3.根据视频类型判断

if(attrs.type=="video/mp4"){
    var html = '<video ';
    _each(attrs, function(key, val) {
        html += key + '="' + val + '" ';
    });
    html += 'controls="controls"/>';
}

4，修改原始拼接内容：

 //增加内容
        if (attrs.src.indexOf(".mp4") != -1) {
            var html = '<video controls="" class="' + _mediaClass(type) + '" ';
            if (style !== '') {
                html += 'style="' + style + '" ';
            }
            html += '><source src="' + attrs.src + '" data-ke-src="' + attrs.src + '" >'
            html += '</video>';
            return html;
        } else {
            var html = '<img class="' + _mediaClass(type) + '" src="' + blankPath + '" ';
            if (style !== '') {
                html += 'style="' + style + '" ';
            }
            html += 'data-ke-tag="' + escape(srcTag) + '" alt="" />';
        }

最终效果如图：

<video controls="" class="ke-media" style="width:550px;height:400px;"><source src="http://localhost:18026/Content/userupload/media/20200907/20200907142935_3141.mp4"></video>