讓KindEditor支持視頻、音頻播放!
1.修改支持MP4格式視頻
// if (/\.(swf|flv)(\?|$)/i.test(src)) { //源碼
if (/\.(swf|flv|mp4)(\?|$)/i.test(src)) { //需修改為
return 'application/x-shockwave-flash';
}
2.修改媒體流方法
function _mediaEmbed(attrs) {
// var html = '<embed ';// 源碼;
var html = '<embed id="player" name="player" allowscriptaccess="always" allowfullscreen="true" '; //需修改為;
二、Flash.js文件修改
1.修改設置
var html = K.mediaImg(self.themesPath + 'common/blank.gif', {
// src : url, // 源碼
flashvars : 'file=' + url, //需修改為
src : '/Uploads/media/player.swf',//需修改為
2.修改
var img = self.plugin.getSelectedFlash();
if (img) {
var attrs = K.mediaAttrs(img.attr('data-ke-tag'));
// urlBox.val(attrs.src);//源碼;
urlBox.val(attrs.flashvars);//需修改為 ;
如果是服務上傳腳本是php的話,修改upload_json.php文件:
'image' => array('gif', 'jpg', 'jpeg', 'png', 'bmp'),
'flash' => array('swf', 'flv'),
//'media' => array('swf', 'flv', 'mp3', 'wav', 'wma', 'wmv', 'mid', 'avi', 'mpg', 'asf', 'rm', 'rmvb'),//源碼;
'media' => array('swf', 'flv', 'mp3', 'wav', 'wma', 'wmv', 'mid', 'avi', 'mpg', 'asf', 'rm', 'rmvb','mp4'),//需修改為 ;
如果是服務上傳腳本是php的話,根據file_manager_json.php腳本設置的路徑新建相應文件夾,並確保該文件夾具備寫權限:
//根目錄路徑,可以指定絕對路徑,比如 /var/www/attached/
$root_path = $php_path . '../attached/';
//根目錄URL,可以指定絕對路徑,比如 http://www.yoursite.com/attached/
$root_url = $php_url . '../attached/';
即在kindeditor下新建一個attached文件夾。並設置該文件夾具備讀寫權限。
// if (/\.(swf|flv)(\?|$)/i.test(src)) { //源碼
if (/\.(swf|flv|mp4)(\?|$)/i.test(src)) { //需修改為
return 'application/x-shockwave-flash';
}
2.修改媒體流方法
function _mediaEmbed(attrs) {
// var html = '<embed ';// 源碼;
var html = '<embed id="player" name="player" allowscriptaccess="always" allowfullscreen="true" '; //需修改為;
二、Flash.js文件修改
1.修改設置
var html = K.mediaImg(self.themesPath + 'common/blank.gif', {
// src : url, // 源碼
flashvars : 'file=' + url, //需修改為
src : '/Uploads/media/player.swf',//需修改為
2.修改
var img = self.plugin.getSelectedFlash();
if (img) {
var attrs = K.mediaAttrs(img.attr('data-ke-tag'));
// urlBox.val(attrs.src);//源碼;
urlBox.val(attrs.flashvars);//需修改為 ;
如果是服務上傳腳本是php的話,修改upload_json.php文件:
'image' => array('gif', 'jpg', 'jpeg', 'png', 'bmp'),
'flash' => array('swf', 'flv'),
//'media' => array('swf', 'flv', 'mp3', 'wav', 'wma', 'wmv', 'mid', 'avi', 'mpg', 'asf', 'rm', 'rmvb'),//源碼;
'media' => array('swf', 'flv', 'mp3', 'wav', 'wma', 'wmv', 'mid', 'avi', 'mpg', 'asf', 'rm', 'rmvb','mp4'),//需修改為 ;
如果是服務上傳腳本是php的話,根據file_manager_json.php腳本設置的路徑新建相應文件夾,並確保該文件夾具備寫權限:
//根目錄路徑,可以指定絕對路徑,比如 /var/www/attached/
$root_path = $php_path . '../attached/';
//根目錄URL,可以指定絕對路徑,比如 http://www.yoursite.com/attached/
$root_url = $php_url . '../attached/';
即在kindeditor下新建一個attached文件夾。並設置該文件夾具備讀寫權限。
在需要播放的web視頻的頁面添加jwplayer插件的引入路徑及License
<script type="text/javascript" src="__PUBLIC__/jwplayer/jwplayer.js"></script>
$(document).ready(function(e) {
//非視頻,不加載播放器
if(document.getElementById('player') != null) {
jwplayer('player').onReady(function() {});
jwplayer('player').onPlay(function() {});
jwplayer("player").play();
}
var src = document.getElementById('player') != null? document.getElementById('player').getAttribute('src'):'';
//加載視頻。
jwplayer("player").setup({
file: src, //此處放視頻封面圖片地址
image: "http://yc.duoduo365.com.cn/Public/app/ty1.png",//此處放視頻封面圖片
// primary: "flash" //360極速模式不支持,會報錯!
});
<script type="text/javascript" src="__PUBLIC__/jwplayer/jwplayer.js"></script>
<script type="text/javascript">jwplayer.key="*********上jwplayer官網注冊下載時就會有key********";</script>
並在添加以下js代碼,即可確保chrome、360、firefox瀏覽器皆可兼容視屏播放:$(document).ready(function(e) {
//非視頻,不加載播放器
if(document.getElementById('player') != null) {
jwplayer('player').onReady(function() {});
jwplayer('player').onPlay(function() {});
jwplayer("player").play();
}
var src = document.getElementById('player') != null? document.getElementById('player').getAttribute('src'):'';
//加載視頻。
jwplayer("player").setup({
file: src, //此處放視頻封面圖片地址
image: "http://yc.duoduo365.com.cn/Public/app/ty1.png",//此處放視頻封面圖片
// primary: "flash" //360極速模式不支持,會報錯!
});
});
如果服務器上傳腳本是jsp頁面修改如下:
<script type='text/javascript'>
//非視頻,不加載播放器
if(document.getElementById('player')!=null)
{
jwplayer('player').onReady(function() {});
jwplayer('player').onPlay(function() {});
//jwplayer('player').play(); //自動播放?
}
</script>