CKEditor和CKFinder整合实现上传下载功能
一、用到的资源。
ckfinder_java_2.4.2.zip
ckeditor_4.2_standard.zip/ckeditor.zip
ckeditor-java-core-3.5.3.zip
二、执行步骤
1. MyEclipse新建 Web Project ： test_CKEditor_Finder
2. 复制以下文件夹到WebRoot 下面：
ckfinder_java_2.4.2\ckfinder\ CKFinderJava \ckfinder
注意：CKFinder 加粗的是 war 包解压后的文件夹的名称
ckeditor_3.6.2/ckeditor
3. 复制 CKFinder配置文件 到WEB-INF 下面：
ckfinder_java_2.4.2\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
四． 修改配置文件config.xml
<enabled> true </enabled> <baseURL> /CKEditor_Finder/userfiles/ </baseURL>
五． 在web.xml 中增加如下代码：
<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> <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> <session-config> <session-timeout>10</session-timeout> </session-config>
六. 修改ckeditor/config.js文件的内容
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://cksource.com/ckfinder" 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>index.jsp</title> <meta http-equiv="pragma" content="no-cache"> <meta http-equiv="cache-control" content="no-cache"> <meta http-equiv="expires" content="0"> <meta http-equiv="keywords" content="keyword1,keyword2,keyword3"> <meta http-equiv="description" content="This is my page"> <!-- <link rel="stylesheet" type="text/css" href="styles.css"> --> </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="/test_ CKEditor_Finder/ckfinder/" editor="editor1" /> <ckeditor:replace replace="editor1" basePath="/test_ CKEditor_Finder/ckeditor/" /> </body> </html>
本文出自 “黑足Sanji” 博客，谢绝转载！