html ckplayer.swf,让KindEditor支持MP4视频（使用ckplayer播放器）

KindEditor本身支持音视频文件的上传，但是对于这些文件的支持是依赖于浏览器控件的，兼容性很差，而且现在比较常见的视频文件MP4也不支持，因此本文提供了对KindEditor进行修改的办法，使其在添加视频后可直接使用CKplayer进行播放。

CKplayer下载地址：http://www.ckplayer.com/down/

我这里使用的是2018-12-20的X1版本

KindEditor我为了省事，我这里使用的是kindeditor.all.js直接进行修改，其他文件大同小异。

首先找到K.options，在embed数组中增加下面两项

'flashvars', 'allowfullscreen'

然后修改函数 function _mediaType(src)

// 把

if (/.(swf|flv)(\?|$)/i.test(src)) {

// 改成

if (/.(swf|flv|mp4)(\?|$)/i.test(src)) {

找到函数 function _mediaEmbed(attrs) 为html中的

allowscriptaccess="always" allowfullscreen="true"

找到 KindEditor.plugin(‘media’ 修改音视频插件生成HTML的方法

// 将原有的HTML生成代码进行修改

var html = K.mediaImg(self.themesPath + 'common/blank.gif', {

src : url,

type : K.mediaType('.swf'),

width : width,

height : height,

quality : 'high'

});

// 改为

var html = K.mediaImg(self.themesPath + 'common/blank.gif', {

src : '/resource/ckplayer/ckplayer.swf', // 这里替换成你的ckplayer.swf的实际位置

flashvars : 'video=' + url.replace(/^video=/, ''),

type : K.mediaType('.swf'),

width : width,

height : height,

quality : 'high'

});

还需要将media插件代码的后半段中对视频属性修改的部分进行处理

// 找到

urlBox.val(attrs.src);

// 替换为

urlBox.val(attrs.flashvars);

最后只要在创建KindEditor实例时在items中添加’media’就可以了。

Read: 629

Like this:

Like Loading...