kindeditor支持视频flv, mp4格式视频上传播放

首先声明本人用的版本为4.1.12

1、mp4视频格式上传：

修改kindeditor-all.js  _mediaImg()方法

原代码

function _mediaImg(blankPath, attrs) {
   var width = attrs.width,
      height = attrs.height,
      type = attrs.type || _mediaType(attrs.src),
      srcTag = _mediaEmbed(attrs),
      style = '';
   if (/\D/.test(width)) {
      style += 'width:' + width + ';';
   } else if (width > 0) {
      style += 'width:' + width + 'px;';
   }
   if (/\D/.test(height)) {
      style += 'height:' + height + ';';
   } else if (height > 0) {
      style += 'height:' + height + 'px;';
   }
    
   var html = '<img class="' + _mediaClass(type) + '" src="' + blankPath + '" ';
   if (style !== '') {
       html += 'style="' + style + '" ';
   }
   html += 'data-ke-tag="' + escape(srcTag) + '" alt="" />';
    
   return html;
}

 

修改为，红色部分为增加的代码

function _mediaImg(blankPath, attrs) {
   var width = attrs.width,
      height = attrs.height,
      type = attrs.type || _mediaType(attrs.src),
      srcTag = _mediaEmbed(attrs),
      style = '';
   if (/\D/.test(width)) {
      style += 'width:' + width + ';';
   } else if (width > 0) {
      style += 'width:' + width + 'px;';
   }
   if (/\D/.test(height)) {
      style += 'height:' + height + ';';
   } else if (height > 0) {
      style += 'height:' + height + 'px;';
   }
    if (attrs.src.indexOf(".mp4")!=-1) {
        var html = '<video controls="" width="+width+" height="+height+" class="' + _mediaClass(type) + '" ';
        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="" />';
    }
    return html;
}

attrs.src.indexOf(".mp4")!=-1 如果是mp4格式视频，就将<embed/>标签替换成<video><video/>标签，这样才能播放

 

2、flv视频上传

kindeditor-all.js  文件大约 7820行代码修改为：

if(url.slice(-4).toUpperCase() == '.FLV'){
    var html = K.mediaImg(self.themesPath + 'common/blank.gif', {
        src: self.themesPath + 'common/Flvplayer.swf?'+'vcastr_file=' + url + '&autostart=' + (autostartBox[0].checked ? 'true' : 'false')+'',
        type: K.mediaType(url),
        //flashvars: 'vcastr_file=' + url + '&autostart=' + (autostartBox[0].checked ? 'true' : 'false')+'',
        width: width,
        height: height,
        quality: 'high',
        allowfullscreen: 'true',
        loop: 'true'
    })
}else{
    var html = K.mediaImg(self.themesPath + 'common/blank.gif', {
        src : url,
        type : K.mediaType(url),
        width : width,
        height : height,
        autostart : autostartBox[0].checked ? 'true' : 'false',
        loop : 'true'
    });
}

其中 src: self.themesPath + 'common/Flvplayer.swf?'+'vcastr_file=' + url + '&autostart=' + (autostartBox[0].checked ? 'true' : 'false')+'' 中的  Flvplayer.swf需要下载放入指定的文件夹，指定好正确的路径。