当前位置: 代码迷 >> Web前端 >> FCKeditor 2.6下传视频
  详细解决方案

FCKeditor 2.6下传视频

热度:145   发布时间:2012-10-07 17:28:51.0
FCKeditor 2.6上传视频

这里有两种方式,一是自己修改,二是使用插件

1.自己修改
      FCKeditor 是现在用的最多的可视编辑器,乐乎也是使用了该编辑器,应大家的要求,添加了插入视频和音频的功能,因为2.6版的修改可能和其他版本不一样,所以我把修改的地方列举出来,格式我是看到网上有位同志的格式很好,照抄的,内容已经修改

修改前注意备份文件,以免造成不必要的麻烦。

一、分别打开:editor/js/fckeditorcode_ie.js和/editor/js/fckeditorcode_gecko.js


找到程序代码


以下是代码片段:
Js代码
||/\.swf($|#|\?)/i.test(A.src)   
||/\.swf($|#|\?)/i.test(A.src)  


这段代码的主要用来判断后缀名,如果后缀名不是swf则返回,把它替换为:
以下是代码片段:



Js代码
||/\.swf($|#|\?)/i.test(A.src)||/\.mpg($|#|\?)/i.test(A.src)   
||/\.asf($|#|\?)/i.test(A.src)||/\.wma($|#|\?)/i.test(A.src)   
||/\.wmv($|#|\?)/i.test(A.src)||/\.avi($|#|\?)/i.test(A.src)   
||/\.mov($|#|\?)/i.test(A.src)||/\.mp3($|#|\?)/i.test(A.src)   
||/\.rmvb($|#|\?)/i.test(A.src)||/\.mid($|#|\?)/i.test(A.src) 
||/\.swf($|#|\?)/i.test(A.src)||/\.mpg($|#|\?)/i.test(A.src)
||/\.asf($|#|\?)/i.test(A.src)||/\.wma($|#|\?)/i.test(A.src)
||/\.wmv($|#|\?)/i.test(A.src)||/\.avi($|#|\?)/i.test(A.src)
||/\.mov($|#|\?)/i.test(A.src)||/\.mp3($|#|\?)/i.test(A.src)
||/\.rmvb($|#|\?)/i.test(A.src)||/\.mid($|#|\?)/i.test(A.src)

文件格式可以根据情况来修改,但是注意要和其他的几个地方吻合

二、打开/editor/dialog/fck_flash/fck_flash.js

1、增加程序代码,这段代码用来判断后缀名
 
以下是代码片段: 
 

Js代码
function WinPlayer(url){   
var r, re;   
re = /.(avi|wmv|asf|wma|mid|mp3|mpg)$/i;   
r = url.match(re);   
return r;   
}   
    
function RealPlayer(url){   
var r, re;   
re = /.(.rm|.ra|.rmvb|ram)$/i;   
r = url.match(re);   
return r;   
}   
    
function QuickTime(url){   
var r, re;   
re = /.(mov|qt)$/i;   
r = url.match(re);   
return r;   
}   
    
function FlashPlayer(url){   
var r, re;   
re = /.swf$/i;   
r = url.match(re);   
return r;   

function WinPlayer(url){
var r, re;
re = /.(avi|wmv|asf|wma|mid|mp3|mpg)$/i;
r = url.match(re);
return r;
}

function RealPlayer(url){
var r, re;
re = /.(.rm|.ra|.rmvb|ram)$/i;
r = url.match(re);
return r;
}

function QuickTime(url){
var r, re;
re = /.(mov|qt)$/i;
r = url.match(re);
return r;
}

function FlashPlayer(url){
var r, re;
re = /.swf$/i;
r = url.match(re);
return r;







2、替换程序代码,这段代码是在UpdatePreview中用来添加type属性
以下是代码片段:
Js代码
SetAttribute( e, 'type', 'application/x-shockwave-flash' ) ; 
SetAttribute( e, 'type', 'application/x-shockwave-flash' ) ;


 
以下是代码片段: 
 

Js代码
if(WinPlayer(GetE('txtUrl').value)!=null){   
SetAttribute( e, 'type', 'application/x-mplayer2' ) ;   
}   
if(RealPlayer(GetE('txtUrl').value)!=null){   
SetAttribute( e, 'type', 'audio/x-pn-realaudio-plugin' ) ;   
}   
if(QuickTime(GetE('txtUrl').value)!=null){   
SetAttribute( e, 'type', 'application/video/quicktime' ) ;   
}   
if(FlashPlayer(GetE('txtUrl').value)!=null){   
SetAttribute( e, 'type', 'application/x-shockwave-flash' ) ;   
SetAttribute( e, 'pluginspage', 'http://www.macromedia.com/go/getflashplayer ' ) ;   

if(WinPlayer(GetE('txtUrl').value)!=null){
SetAttribute( e, 'type', 'application/x-mplayer2' ) ;
}
if(RealPlayer(GetE('txtUrl').value)!=null){
SetAttribute( e, 'type', 'audio/x-pn-realaudio-plugin' ) ;
}
if(QuickTime(GetE('txtUrl').value)!=null){
SetAttribute( e, 'type', 'application/video/quicktime' ) ;
}
if(FlashPlayer(GetE('txtUrl').value)!=null){
SetAttribute( e, 'type', 'application/x-shockwave-flash' ) ;
SetAttribute( e, 'pluginspage', 'http://www.macromedia.com/go/getflashplayer ' ) ;






3、替换程序代码,这段代码是在UpdateEmbed中用来添加type属性
 
以下是代码片段: 
 

Js代码
SetAttribute( e, 'type' , 'application/x-shockwave-flash' ) ;   
SetAttribute( e, 'pluginspage' , 'http://www.macromedia.com/go/getflashplayer ' ) ; 
SetAttribute( e, 'type' , 'application/x-shockwave-flash' ) ;
SetAttribute( e, 'pluginspage' , 'http://www.macromedia.com/go/getflashplayer ' ) ; 






 
以下是代码片段: 
 

Js代码
if(WinPlayer(GetE('txtUrl').value)!=null){   
    SetAttribute( e, 'type' , 'application/x-mplayer2' ) ;   
    SetAttribute( e, 'autostart', GetE('chkAutoPlay').checked ? 'true' : 'false' ) ;   
}   
if(RealPlayer(GetE('txtUrl').value)!=null){   
    SetAttribute( e, 'type' , 'audio/x-pn-realaudio-plugin' ) ;   
    SetAttribute( e, 'autostart', GetE('chkAutoPlay').checked ? 'true' : 'false' ) ;   
}   
if(QuickTime(GetE('txtUrl').value)!=null){   
    SetAttribute( e, 'type' , 'video/quicktime' ) ;   
    SetAttribute( e, 'autostart', GetE('chkAutoPlay').checked ? 'true' : 'false' ) ;   
}   
if(FlashPlayer(GetE('txtUrl').value)!=null){   
    SetAttribute( e, 'type' , 'application/x-shockwave-flash' ) ;   
    SetAttribute( e, 'pluginspage' , 'http://www.macromedia.com/go/getflashplayer ' ) ;   

if(WinPlayer(GetE('txtUrl').value)!=null){
    SetAttribute( e, 'type' , 'application/x-mplayer2' ) ;
    SetAttribute( e, 'autostart', GetE('chkAutoPlay').checked ? 'true' : 'false' ) ;
}
if(RealPlayer(GetE('txtUrl').value)!=null){
    SetAttribute( e, 'type' , 'audio/x-pn-realaudio-plugin' ) ;
    SetAttribute( e, 'autostart', GetE('chkAutoPlay').checked ? 'true' : 'false' ) ;
}
if(QuickTime(GetE('txtUrl').value)!=null){
    SetAttribute( e, 'type' , 'video/quicktime' ) ;
    SetAttribute( e, 'autostart', GetE('chkAutoPlay').checked ? 'true' : 'false' ) ;
}
if(FlashPlayer(GetE('txtUrl').value)!=null){
    SetAttribute( e, 'type' , 'application/x-shockwave-flash' ) ;
    SetAttribute( e, 'pluginspage' , 'http://www.macromedia.com/go/getflashplayer ' ) ;






三、打开/fckconfig.js,该文件为配置文件

替换程序代码,这个是在上传文件的时候检查后缀名

以下是代码片段:
Js代码
FCKConfig.FlashUploadAllowedExtensions = ".(swf)$" ; // empty for all 
FCKConfig.FlashUploadAllowedExtensions = ".(swf)$" ; // empty for all


以下是代码片段:
Js代码
FCKConfig.FlashUploadAllowedExtensions    
    = ".(swf|fla|mpg|asf|wma|wmv|avi|mov|mp3|rmvb|mid)$" ; // empty for all 
FCKConfig.FlashUploadAllowedExtensions
    = ".(swf|fla|mpg|asf|wma|wmv|avi|mov|mp3|rmvb|mid)$" ; // empty for all

三、打开/editor/lang/zh-cn.js 文件,该部分为语言文件,Flash替换掉就可以了

然后整体修改完成,现在lehu已经支持上传视频和音频文件,不过注意的是,如果视频文件太大,还是可能出现不能播放的情况

四、还需要在fckeditor.properties文件里加上(使用fckeditor2.6.3,fckeditor-java2.4)

Java代码
connector.resourceType.flash.extensions.allowed    
      = swf|fla|mpg|asf|wma|wmv|avi|mov|mp3|rmvb|mid 
connector.resourceType.flash.extensions.allowed
      = swf|fla|mpg|asf|wma|wmv|avi|mov|mp3|rmvb|mid

2.插件 这里介绍一个FCK的插件,多媒体插件,支持Windows Media,Real,QuickTime,Flash,
Shockwave,完全可以替换FCK自带的flash插入功能。
前段时间在发过一篇《利用Fckeditor插入MP3或视频文件》,是通过修改FCK的Flash插入实现插入多媒体的,和这里的插件原理是一样的。
插件的具体使用方法如下:
1、解压文件到 FCKeditor\editor\plugins,命名为Media
- 隐藏引用文字 -
2、修改配置文件 FCKeditor\fckconfig.js ,包括启用插件和添加按钮。
JavaScript代码

Js代码
FCKConfig.PluginsPath = FCKConfig.BasePath + 'plugins/' ;         //找到这一句,配置插件路径   
FCKConfig.Plugins.Add( 'Media', 'en,zh,zh-cn' ) ;  //启用插件   
     
…………  //中间代码省略   
     
FCKConfig.ToolbarSets["Default"] = [     
    ['Source','Templates'],     
    ['FontName','FontSize'],     
    ['TextColor','BGColor'],     
    ['Image','Flash'],  //可以用Media替换Flash   
    ['Table','Rule'],     
    ['FitWindow','ShowBlocks'],     
   ['Smiley','SpecialChar','Media'], //或者加入Media按钮   
    '/',     
    ['PasteText','PasteWord','RemoveFormat'],     
    ['Undo','Redo','Find','Replace'],     
    ['Bold','Italic','Underline','StrikeThrough'],     
    ['OrderedList','UnorderedList','-','Outdent','Indent','Blockquote'],     
    ['JustifyLeft','JustifyCenter','JustifyRight'],     
    ['Anchor','Link','Unlink'] //我的按钮的配置,可能和你的不太一样   
] ;   
FCKConfig.PluginsPath = FCKConfig.BasePath + 'plugins/' ;         //找到这一句,配置插件路径
FCKConfig.Plugins.Add( 'Media', 'en,zh,zh-cn' ) ;  //启用插件
 
…………  //中间代码省略
 
FCKConfig.ToolbarSets["Default"] = [ 
    ['Source','Templates'], 
    ['FontName','FontSize'], 
    ['TextColor','BGColor'], 
    ['Image','Flash'],  //可以用Media替换Flash
    ['Table','Rule'], 
    ['FitWindow','ShowBlocks'], 
   ['Smiley','SpecialChar','Media'], //或者加入Media按钮
    '/', 
    ['PasteText','PasteWord','RemoveFormat'], 
    ['Undo','Redo','Find','Replace'], 
    ['Bold','Italic','Underline','StrikeThrough'], 
    ['OrderedList','UnorderedList','-','Outdent','Indent','Blockquote'], 
    ['JustifyLeft','JustifyCenter','JustifyRight'], 
    ['Anchor','Link','Unlink'] //我的按钮的配置,可能和你的不太一样
] ;  
找到类似代码添加如下内容

Js代码
FCKConfig.MediaUpload = true ;   
FCKConfig.MediaUploadURL = FCKConfig.BasePath + 'filemanager/connectors/' +    
       _QuickUploadLanguage + '/upload.' + _QuickUploadLanguage + '?Type=Media' ;   
FCKConfig.MediaUploadAllowedExtensions = ".(avi|asf)$" ;  // empty for all   
FCKConfig.MediaUploadDeniedExtensions = "" ;       // empty for no one 
FCKConfig.MediaUpload = true ;
FCKConfig.MediaUploadURL = FCKConfig.BasePath + 'filemanager/connectors/' +
       _QuickUploadLanguage + '/upload.' + _QuickUploadLanguage + '?Type=Media' ;
FCKConfig.MediaUploadAllowedExtensions = ".(avi|asf)$" ;  // empty for all
FCKConfig.MediaUploadDeniedExtensions = "" ;       // empty for no one 
下载地址:http://dev.fckeditor.net/ticket/382 
  相关解决方案