1、设置FCKeditor的BasePath和UserFilesPath
BasePath是FCKeditor的根目录,而UserFilesPath则是上传的图片、文件等等的存储目录。在FCKeditor文件夹下(我的FCKeditor位于网站的根目录下),添加Web.Config文件,在<appSettings>配置节下添加如下代码:
<add key="FCKeditor:BasePath" value="/FCKeditor/" />
<add key="FCKeditor:UserFilesPath" value="~/UploadFiles/" />
在开发过程中,UserFilesPath可以使用 "~/UploadFiles/" 的形式,发布后,你可能会遇到两种情况:1)以虚拟目录的形式来运行的,如果是以虚拟目录的形式来运行你的项目,那么UserFilesPath的值就不需要改变。2)以独立网站的形式来运行,如果你的网站以独立网站的形式来运行的话,则必须要将 "~/UploadFiles/" 改为 "/UploadFiles/” 。否则就会报错!
2、设置FCKeditor上传组件所使用的语言
在FCKeditor文件夹下有个fckconfig.js文件,该文件是FCKeditor的配置文件,找到如下代码:
var _QuickUploadLanguage = ' aspx ' ; // asp | aspx | cfm | lasso | perl | php | py
如上面的代码所示,将_FileBrowserLanguage和_QuickUploadLanguage的值设为ASPX。同时,将FCKeditor编辑器的默认语言设为'zh-cn',其代码如下:
3、设置FCKeditor的工具栏
打开fckconfig.js文件,在该文件中我们可以找到如下代码:
1 FCKConfig.ToolbarSets["Default"] = [
2 ['Source','DocProps','-','Save','NewPage','Preview','-','Templates'],
3 ['Cut','Copy','Paste','PasteText','PasteWord','-','Print','SpellCheck'],
4 ['Undo','Redo','-','Find','Replace','-','SelectAll','RemoveFormat'],
5 ['Form','Checkbox','Radio','TextField','Textarea','Select','Button','ImageButton','HiddenField'],
6 '/',
7 ['Bold','Italic','Underline','StrikeThrough','-','Subscript','Superscript'],
8 ['OrderedList','UnorderedList','-','Outdent','Indent','Blockquote','CreateDiv'],
9 ['JustifyLeft','JustifyCenter','JustifyRight','JustifyFull'],
10 ['Link','Unlink','Anchor'],
11 ['Image','Flash','Table','Rule','Smiley','SpecialChar','PageBreak'],
12 '/',
13 ['Style','FontFormat','FontName','FontSize'],
14 ['TextColor','BGColor'],
15 ['FitWindow','ShowBlocks','-','About'] // No comma for the last row.
16 ] ;
17
18 FCKConfig.ToolbarSets["Basic"] = [
19 ['Bold','Italic','-','OrderedList','UnorderedList','-','Link','Unlink','-','About']
20 ] ;
这段代码定义了FCKeditor工具栏的两种形式,Default和Basic。也可以根据项目的需要,自己定子工具栏的形式,其中,'-' 表示按钮间的一条竖线,两个[ ]内的内容表示可以组合到一起的工具按钮,'/' 表示换行。我自己定义了一个简单的工具栏形式:
[ ' Source ' , ' - ' , ' Bold ' , ' Italic ' , ' Underline ' , ' - ' , ' OrderedList ' , ' Smiley ' ],
[ ' FontFormat ' , ' FontName ' , ' FontSize ' , ' TextColor ' ],
[ ' About ' ]
];
这样,就可以在ASP.NET页面中使用它了,其代码如下:
4、The Server didn't send back a proper XML response.Please contact your system administrator.XML request error:Internal Server Error(500)
出现上面的错误提示的原因有很多,仅仅根据这句话还很难判断到底那里出了问题,我们来看比较详细的内容,如下图:
我们可以看到如下内容:“使用主题CSS文件要求页上有标头文件。”,解决这个问题需要分两步:1)在fckeditor/editor/filemanager/connectors/aspx文件夹下有connector.aspx和upload.aspx两个文件,打开后我们发现,这两个文件的内容相同,只有一段代码:
我们为其添加一个head标签,代码如下:
< FCKeditor:Config id = " Config " runat = " server " ></ FCKeditor:Config >
</ head >
2)在FCKeditor文件夹下的Web.config文件中<system.web>配置节下,添加如下代码:
通过以上两步,就可以顺利解决这个问题了。
5、中文编码的问题
使用FCKeditor的上传功能时,对一些中文命名的文件会出现乱码的问题,解决该问题的办法是:在web.config文件的<system.web>配置节下,添加如下代码:
< globalization requestEncoding = " utf-8 " responseEncoding = " gb2312 " />
</ system.web >
6、The Server didn't send back a proper XML response.Please contact your system administrator.XML request error:Internal Server Error(500) 之未能映射路径……
在使用“插入超链接”的“浏览服务器”的功能时,会出现这个错误提示。上文中提到,出现“The Server ……”提示的原因很多,我们要根据具体的细节,来判断是那里的问题。我们在错误提示中发现下面一句话:“未能映射路径"/UploadFiles/file/"。也就是说,没有找到这个路径。再次查找fckconfig.js文件,我找到如下代码:
FCKConfig.LinkBrowser = true ;
FCKConfig.LinkBrowserURL = FCKConfig.BasePath + 'filemanager/browser/default/browser.html?&Connector=' + encodeURIComponent( FCKConfig.BasePath + 'filemanager/connectors/' + _FileBrowserLanguage + '/connector.' + _FileBrowserExtension ) ;
FCKConfig.ImageBrowser = true ;
FCKConfig.ImageBrowserURL = FCKConfig.BasePath + 'filemanager/browser/default/browser.html?Type=Image&Connector=' + encodeURIComponent( FCKConfig.BasePath + 'filemanager/connectors/' + _FileBrowserLanguage + '/connector.' + _FileBrowserExtension ) ;
FCKConfig.FlashBrowser = true ;
FCKConfig.FlashBrowserURL = FCKConfig.BasePath + 'filemanager/browser/default/browser.html?Type=Flash&Connector=' + encodeURIComponent( FCKConfig.BasePath + 'filemanager/connectors/' + _FileBrowserLanguage + '/connector.' + _FileBrowserExtension ) ;
FCKConfig.LinkUpload = true ;
FCKConfig.LinkUploadURL = FCKConfig.BasePath + 'filemanager/connectors/' + _QuickUploadLanguage + '/upload.' + _QuickUploadExtension;
FCKConfig.LinkUploadAllowedExtensions = ".(7z|aiff|asf|avi|bmp|csv|doc|exe|fla|flv|gif|gz|gzip|jpeg|jpg|mdb|mid|mov|mp3|mp4|mpc|mpeg|mpg|ods|odt|pdf|png|ppt|pxd|qt|ram|rar|rm|rmi|rmvb|rtf|sdc|sitd|swf|sxc|sxw|tar|tgz|tif|tiff|txt|vsd|wav|wma|wmv|xls|xml|zip)$" ; // empty for all
FCKConfig.LinkUploadDeniedExtensions = "" ; // empty for no one
FCKConfig.ImageUpload = true ;
FCKConfig.ImageUploadURL = FCKConfig.BasePath + 'filemanager/connectors/' + _QuickUploadLanguage + '/upload.' + _QuickUploadExtension + '?Type=Image' ;
FCKConfig.ImageUploadAllowedExtensions = ".(jpg|gif|jpeg|png|bmp)$" ; // empty for all
FCKConfig.ImageUploadDeniedExtensions = "" ; // empty for no one
FCKConfig.FlashUpload = true ;
FCKConfig.FlashUploadURL = FCKConfig.BasePath + 'filemanager/connectors/' + _QuickUploadLanguage + '/upload.' + _QuickUploadExtension + '?Type=Flash' ;
FCKConfig.FlashUploadAllowedExtensions = ".(swf|flv)$" ; // empty for all
FCKConfig.FlashUploadDeniedExtensions = "" ; // empty for no one
在这段代码中,我发现:ImageBrowserURL和FlashBrowserURL的值中都有"Type=image"或者"Type=Flash"字样,而LinkBrowserURL则没有。同样的情况也出现在LinkUploadURL属性中。解决的办法就是对照着ImageBrowserURL和ImageUpload的形式将字符串"Type=file"分别加入到LinkBrowserURL和LinkUploadURL属性的相应位置中,结果如下:
FCKConfig.LinkBrowserURL = FCKConfig.BasePath + 'filemanager/browser/default/browser.html?Type=File&Connector=' + encodeURIComponent( FCKConfig.BasePath + 'filemanager/connectors/' + _FileBrowserLanguage + '/connector.' + _FileBrowserExtension ) ;
FCKConfig.LinkUploadURL = FCKConfig.BasePath + 'filemanager/connectors/' + _QuickUploadLanguage + '/upload.' + _QuickUploadExtension + '?Type=File' ;
7、关于Invalid File问题
出现Invalid File提示,是因为FCKeditor不支持该文件类型的缘故。打开fckconfig.js文件,我们可以看到LinkUploadAllowedExtensions、ImageUploadAllowedExtensions和FlashUploadAllowedExtensions的属性,只需要加入相应文件的扩展名就可以顺利解决了。
8、使用“插入超链接”、“插入Flash”和“插入图片”的上传功能时,如下图所示:
虽然能成功上传,但通过“浏览服务器”按钮来浏览是,却找不到上传的文件。最后,我在上传文件的根目录下找到了它们,也就是说,通过这个页面上传的内容没有上传到相应的目录中去,那么该如何解决呢?
在fckeditor/editor/filemanager/connectors/aspx下的config.ascx文件中,有个UserFilesAbsolutePath属性,我们发现这个属性是直接指向上传文件根目录的,而不是相应的分类目录,我们只需要将UserFilesAbsolutePath的属性值与UserFilesPath属性值保持一致就可以了,修改后的代码如下:
TypeConfig[ "File" ].FilesPath = "%UserFilesPath%file/";
TypeConfig[ "File" ].FilesAbsolutePath = ( UserFilesAbsolutePath == "" ? "" : "%UserFilesAbsolutePath%file/" );
TypeConfig[ "File" ].QuickUploadPath = "%UserFilesPath%file/";
TypeConfig[ "File" ].QuickUploadAbsolutePath = ( UserFilesAbsolutePath == "" ? "" : "%UserFilesAbsolutePath%file/" );
TypeConfig[ "Image" ].FilesPath = "%UserFilesPath%image/";
TypeConfig[ "Image" ].FilesAbsolutePath = ( UserFilesAbsolutePath == "" ? "" : "%UserFilesAbsolutePath%image/" );
TypeConfig[ "Image" ].QuickUploadPath = "%UserFilesPath%image/";
TypeConfig[ "Image" ].QuickUploadAbsolutePath = ( UserFilesAbsolutePath == "" ? "" : "%UserFilesAbsolutePath%image/" );
TypeConfig[ "Flash" ].FilesPath = "%UserFilesPath%flash/";
TypeConfig[ "Flash" ].FilesAbsolutePath = ( UserFilesAbsolutePath == "" ? "" : "%UserFilesAbsolutePath%flash/" );
TypeConfig[ "Flash" ].QuickUploadPath = "%UserFilesPath%flash/";
TypeConfig[ "Flash" ].QuickUploadAbsolutePath = ( UserFilesAbsolutePath == "" ? "" : "%UserFilesAbsolutePath%flash/" );
TypeConfig[ "Media" ].FilesPath = "%UserFilesPath%media/";
TypeConfig[ "Media" ].FilesAbsolutePath = ( UserFilesAbsolutePath == "" ? "" : "%UserFilesAbsolutePath%media/" );
TypeConfig[ "Media" ].QuickUploadPath = "%UserFilesPath%media";
TypeConfig[ "Media" ].QuickUploadAbsolutePath = ( UserFilesAbsolutePath == "" ? "" : "%UserFilesAbsolutePath%media/" );
修改完成以后,再使用该功能时,就会自动上传到相应的目录中去了!