FCKeditor 文件上传

Jar 包：

 

帮助文档：

 

Site 文件夹下的 index.html 文件

 

通过帮助文档我们知道了，要成功实现上传下载功能，一共分为 2 两个步骤：

第一步

我们查看到了 web.xml 中提供的 servlet ，那我我就就把他放大我们项目中的 web.xml 文档中。

<!-- 文件上传 -->

  < servlet >

      < servlet-name > ConnectorServlet </ servlet-name >

        < servlet-class >

          net.fckeditor.connector.ConnectorServlet

      </ servlet-class >

      < load-on-startup > 1 </ load-on-startup >

    </ servlet >

    < servlet-mapping >

      < servlet-name > ConnectorServlet </ servlet-name >

      < url-pattern >

        /fckeditor/editor/filemanager/connectors/* <!-- 映射到指定的 url 位置 -->

      </ url-pattern >

</ servlet-mapping >

第二步

在项目 src 文件下新建一个文本文件，名字： fckeditor.properties （注意：文件名称一定要相同），在文件中编写： connector.userActionImpl=net.fckeditor.requestcycle.impl.EnabledUserAction 。

大功告成！来看看效果图吧！

上传按钮也同理，爽吧 ~~~

上传中文乱码

但是，我们在上传过程中会遇到很多问题，其中要上传的文件名称为中文时，我们上传到服务器上的文件名称就会变成乱码。

解决方案：

首先，我们遇到这这样的问题，我们要先检查项目中 fckeditor 文件夹下的 editor 文件夹下的 filemanager 文件夹 browser 文件夹下 default 文件夹 js 文件夹下的 frmupload.html 文件

我们来查看一下 frmupload.html 文件：

< meta http-equiv = "Content-Type" content = "text/html; charset=utf-8" > <!— 我们可以看到 在使用 getPost 时 我们采用的是 UTF-8 编码格式 所以 frmupload.html 没有问题 -->

< link href = "browser.css" type = "text/css" rel = "stylesheet" >

< script type = "text/javascript" src = "js/common.js" ></ script >

< script type = "text/javascript" >

 

既然 frmupload.html 文件没有问题，那么我们就来检查一下是不是 web.xml 文件中出了什么问题。

< servlet >

< servlet-name > ConnectorServlet </ servlet-name >

     <servlet-class>net.fckeditor.connector.ConnectorServlet</servlet-class>

     < load-on-startup > 1 </ load-on-startup >

</ servlet >

< servlet-mapping >

< servlet-name > ConnectorServlet </ servlet-name >

< url-pattern > /fckeditor/editor/filemanager/connectors/* <!-- 映射到指定的 url 位置 -->

</ url-pattern >

</ servlet-mapping >

我们通过 web.xml 文件中的上传文件配置可以看出，配置文件调用了 net.fckeditor.connector.ConnectorServlet 文件，那么我们接下来就来找到 ConnectorServlet 文件。

发现无法打开啊，这是我就需要调用 fckeditor-java-2.6-src.zip 了

好了，通过 fckeditor-java-2.6-src.zip 包的帮助，我们顺利查看到了 ConnectorServlet 文件的源码，但是我们是不能在这对 ConnectorServlet 文件进行修改的，那我们不妨把他复制出去，我们想怎么改就怎么改。

在项目 src 包中创建 net.igit.fckeditor.connector 包（可以定义），在自定义的包下新建 ConnectorServlet.Class 文件，把我们的从源码中复制来的源码粘贴过来，我们不需要动它的任何源码，只需要把报错的地方导包即可。

在 FCKeditor2.6 以后， FCKeditor 把主要修改上传功能权限的修改都放在了 fckeditor-java-core-2.6.jar 中的 net.fckeditor.connector 包中的 Dispatcher.class 文件下，同理，我们也在自定义的 net.igit.fckeditor.connector 包下新建一个 Dispatcher.class 文件，把 Dispatcher.class 文件的源码复制过去，报错的地方导包。

在 Dispatcher.class 文件下修改：

源码：

UploadResponse doPost( final HttpServletRequest request) {

logger .debug( "Entering Dispatcher#doPost" );

……

try {

     List<FileItem> items = upload.parseRequest(request);

……

}

修改后：

GetResponse doGet( final HttpServletRequest request) {

     logger .debug( "Entering Dispatcher#doGet" );     

……

upload.setHeaderEncoding("UTF-8");   // 自己改动 解决上传中文名文件出现乱码问题

try {

     List<FileItem> items = upload.parseRequest(request);

……

}

 

创建中文名目录出现乱码问题

修改 Dispatcher 类

源码：

GetResponse doGet( final HttpServletRequest request) {

     logger .debug( "Entering Dispatcher#doGet" );

     ……

try {

         if (command.equals(Command. CREATE_FOLDER )) {

              String newFolderNameStr = request

         ……

}

修改后：

GetResponse doGet( final HttpServletRequest request) {

     logger .debug( "Entering Dispatcher#doGet" );

     ……

if (command.equals(Command. CREATE_FOLDER )) {

         String tempStr = request.getParameter( "NewFolderName" );

              try {

                   tempStr = new String(tempStr.getBytes( "iso8859-1" ), "UTF-8" );     

} catch (UnsupportedEncodingException e) {

                   e.printStackTrace();

              }

              String newFolderNameStr = tempStr;   

……

}

引用中文名图片无法正常显示

修改 Dispatcher 类

源码：

UploadResponse doPost( final HttpServletRequest request) {

     logger .debug( "Entering Dispatcher#doPost" );

     ……

String fileName = FilenameUtils. getName (uplFile.getName());

     logger .debug( "Parameter NewFile: {}" , fileName);

     ……

}

修改后：

UploadResponse doPost( final HttpServletRequest request) {

     logger .debug( "Entering Dispatcher#doPost" );

     ……

String fileName = FilenameUtils. getName (uplFile.getName());   

     ……

String filrNameX = fileName.substring(0, fileName.indexOf( "." ));   

     String extensionStr = fileName.substring(fileName.indexOf( "." ));   

     filrNameX = UUID. randomUUID ().toString()+extensionStr;   

     fileName = filrNameX;   

     logger .debug( "Parameter NewFile: {}" , fileName);   

……

}

上传文件格式设置

我们要修改 FCKeditor 上传文件类型，要从客户端和服务器两方面修改

服务端

从服务端修改，我们就要参考文档：

帮助文档：

 

我们从 Referenced Libraries 中 fckeditor-java-core-2.6.jar 下的 net.fckeditor.handlers 包中的 default..properties 文件中：

connector.resourceType.file.extensions.allowed = 7z|aiff|asf|avi|bmp|csv|doc|fla|flv|gif|gz|gzip|jpeg|jpg|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

connector.resourceType.image.extensions.allowed = bmp|gif|jpeg|jpg|png

connector.resourceType.flash.extensions.allowed = swf|fla

connector.resourceType.media.extensions.allowed = aiff|asf|avi|bmp|fla|flv|gif|jpeg|jpg|mid|mov|mp3|mp4|mpc|mpeg|mpg|png|qt|ram|rm|rmi|rmvb|swf|tif|tiff|wav|wma|wmv

粘贴到自定义的 fckeditor.properties 文件中修改

客户端

找到 fckeditor 文件夹下的 fckconfig.js 文件，找到：

FCKConfig.LinkUploadAllowedExtensions = ".(7z|aiff|asf|avi|bmp|csv|doc|fla|flv|gif|gz|gzip|jpeg|jpg|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)$" ;         

FCKConfig.ImageUploadAllowedExtensions     = ".(jpg|gif|jpeg|png|bmp)$" ;

FCKConfig.FlashUploadAllowedExtensions     = ".(swf|flv)$" ;

粘贴到自定义的 myconfig.js 文件中修改

 

上传文件大小控制

修改 Dispatcher 类

源码：

UploadResponse doPost( final HttpServletRequest request) {

     logger .debug( "Entering Dispatcher#doPost" );

    ……

if (type.isDeniedExtension(FilenameUtils. getExtension (fileName)))

         uploadResponse = UploadResponse. getInvalidFileTypeError ();

         // Secure image check (can't be done if QuickUpload)

         else if (type.equals(ResourceType. IMAGE )

         && PropertiesLoader. isSecureImageUploads ()

         && !UtilsFile. isImage (uplFile.getInputStream())) {

         uploadResponse = UploadResponse. getInvalidFileTypeError ();

     } else {

         ……

}

修改后：

UploadResponse doPost( final HttpServletRequest request) {

     logger .debug( "Entering Dispatcher#doPost" );

……

if (type isDeniedExtension(FilenameUtils. getExtension (fileName))) {

         uploadResponse = UploadResponse. getInvalidFileTypeError ();

         } else if (type.equals(ResourceType. IMAGE )

              && PropertiesLoader. isSecureImageUploads ()

              && !UtilsFile. isImage (uplFile.getInputStream())) {

              uploadResponse = UploadResponse. getInvalidFileTypeError ();

         } else if (uplFile.getSize() > 10 * 1024) { // 检查文件大小

              uploadResponse = UploadResponse

              . getInvalidCurrentFolderError ();

         } else {

……

}

自定义的 UploadResponse 类，除了内容全部拷贝 FCKeditor 中 UploadResponse 类的内容外，需要增加一个错误常量和一个错误方法：

public static final int EN_INVALID_FILE_SIZE_ERROR = 204;

     public static UploadResponse getInvalidFileSizeError() {

         LocalizedMessages lm = LocalizedMessages. getInstance (ThreadLocalData. getRequest ());

         return new UploadResponse( EN_INVALID_FILE_SIZE_ERROR , lm.getInvalidFileTypeSpecified());

}

以上服务器端修改完成。然后需要修改 WebRoot/fckeditor/editor/dialog/fck_image/fck_image.js 文件。在其中加入对我们新定义的 205 方法的 alert 语句：
case 204 : alert( "A file is too big. You should change the file" ) ;
return ;

都是自己学到的东西 大家如果有什么问题 可以一起探究 呵呵

FCKeditor 2