ckedit+ckfinder整合于struts2框架 ，完成图片上传管理

上个项目用过的知识点总计：

一．需要的资源：

用到的网站，文件自己下载:
a) ckeditor_3.6.2 （解压）
b) ckeditor-java-3.6.2 （解压）
c) ckfinder_java_2.1 （解压）

推荐到官网下载最新版本 ：http://ckeditor.com/download
二． 执行步骤：

1. MyEclipse新建 Web Project ： CKEditor_Finder

2. 复制以下文件夹到WebRoot下面：

ckfinder_java_2.1\ckfinder\ CKFinderJava \ckfinder

注意：CKFinder 加粗的是 war 包解压后的文件夹的名称

ckeditor_3.6.2/ckeditor
3. 复制 CKFinder配置文件 到WEB-INF 下面：

ckfinder_java_2.1\ckfinder\CKFinderJava\WEB-INF\config.xml

4. 复制下面文件夹下面所有jar 文件到 WEB-INf/lib 下面：
ckfinder_java_2.1\ckfinder\CKFinderJava\WEB-INF\lib
ckeditor-java-3.6.2\WEB-INF\lib

三． 下面删除无用的文件
首先是ckeditor 下面的文件：
_sample,_source, CHANGES.html， ckeditor_php4.php ，  ckeditor_php5.php,
ckeditor.asp, ckeditor.pack, INSTALL.html, LICENSE.html

然后是ckfinder 下面的文件：
_samples, help, changelog.txt, install.txt, license.txt, translation.txt

四． 修改配置文件WEB-INF下config.xml
     <!-- 默认为false的改为true -->
    <enabled >true </enabled> 
    //指定上传文件或者图片的保存地址 ：CKEditor_Finder为项目名，改为你自己的。
    <baseURL >/CKEditor_Finder/userfiles/ </ baseURL >  

 
五． 在web.xml 中增加如下代码：

    <!-- 图片管理功能的配置 -->
  <filter> 
         <filter-name>FileUploadFilter</filter-name> 
         <filter-class>com.ckfinder.connector.FileUploadFilter</filter-class> 
         <init-param> 
             <param-name>sessionCookieName</param-name> 
             <param-value>JSESSIONID</param-value> 
         </init-param> 
         <init-param> 
             <param-name>sessionParameterName</param-name> 
             <param-value>jsessionid</param-value> 
         </init-param> 
     </filter> 
     <filter-mapping> 
         <filter-name>FileUploadFilter</filter-name> 
         <url-pattern>/ckfinder/core/connector/java/connector.java</url-pattern> 
     </filter-mapping>
  
  <servlet>    
      <servlet-name>ConnectorServlet</servlet-name>   
      <servlet-class>    
           com.ckfinder.connector.ConnectorServlet    
      </servlet-class>   
      <init-param>    
          <param-name>XMLConfig</param-name>    
          <param-value>/WEB-INF/config.xml</param-value>   
      </init-param>   
      <init-param>    
         <param-name>debug</param-name>   
         <param-value>false</param-value>   
      </init-param>    
      <load-on-startup>1</load-on-startup>   
  </servlet>    
  <servlet-mapping>    
      <servlet-name>ConnectorServlet</servlet-name>   
      <url-pattern>    
         /ckfinder/core/connector/java/connector.java   
     </url-pattern>   
  </servlet-mapping>
  <!-- 图片管理功能的配置结束 --> 

六. 修改ckeditor/config.js文件的内容

    CKEDITOR.editorConfig =  function (config) { 
        config.filebrowserBrowseUrl =  '/CKEditor_Finder/ckfinder/ckfinder.html' ; 
        config.filebrowserImageBrowseUrl =  '/CKEditor_Finder/ckfinder/ckfinder.html?type=Images' ; 
        config.filebrowserFlashBrowseUrl =  '/CKEditor_Finder/ckfinder/ckfinder.html?type=Flash' ; 
        config.filebrowserUploadUrl =  '/ckfinder/core/connector/java/connector.java?command=QuickUpload&type=Files' ; 
        config.filebrowserImageUploadUrl =  '/ckfinder/core/connector/java/connector.java?command=QuickUpload&type=Images' ; 
        config.filebrowserFlashUploadUrl =  '/ckfinder/core/connector/java/connector.java?command=QuickUpload&type=Flash' ; 
        config.filebrowserWindowWidth = '1000'; 
        config.filebrowserWindowHeight = '700'; 
        config.language =  "zh-cn" ; 
    };  

七． 修改index.jsp文件的内容如下：

    <%@   page   language = "java"   import = "java.util.*"   pageEncoding = "utf-8" %> 
    <%@   taglib   uri = "http://ckfinder.com"   prefix = "ckfinder"   %> 
    <%@   taglib   uri = "http://ckeditor.com"   prefix = "ckeditor"   %> 
    <% 
    String path = request.getContextPath(); 
    String basePath = request.getScheme()+ "://" +request.getServerName()+ ":" +request.getServerPort()+path+ "/" ; 
    %> 
   
    <! DOCTYPE   HTML  PUBLIC   "-//W3C//DTD HTML 4.01 Transitional//EN"> 
    < html > 
        < head > 
         < base   href = " <%= basePath %> " > 
         < title > 首页 </ title > 
       < meta   http-equiv = "pragma"   content = "no-cache" > 
       < meta   http-equiv = "cache-control"   content = "no-cache" > 
       < meta   http-equiv = "expires"   content = "0" > 
      </head> 
       <body> 
       < form   action = "getContent"   method = "get" > 
           < textarea   cols = "80"   id = "editor1"   name = "editor1"   rows = "10" ></ textarea > 
           < input   type = "submit"   value = "Submit"   /> 
       </ form > 
       < ckfinder:setupCKEditor   basePath = "/CKEditor_Finder/ckfinder/"   editor = "editor1"   /> 
       < ckeditor:replace   replace = "editor1"   basePath = "/CKEditor_Finder/ckeditor/"   /> 
       </body> 
    </html>  

 

修改tomcat配置文件URIEncoding="utf-8" 设置中的URIEncoding 是为了在访问的时候,即使访问路径中出现中文也能正常访问.
<Connector port="80" protocol="HTTP/1.1"
               connectionTimeout="20000"
  redirectPort="8443" URIEncoding="utf-8" />

重点：
注意：如果用到struts2,图片上传没反应的话。这点把上传的请求也拦截过滤掉了
把
 <filter-mapping>
  <filter-name>Struts2</filter-name>
  <url-pattern>/*</url-pattern>
  </filter-mapping>
改成
 <filter-mapping>
  <filter-name>Struts2</filter-name>
  <url-pattern>*.do</url-pattern>
 </filter-mapping>