`

CKEditor、CKfinder与Struts2整合

 
阅读更多

1. 下载好ckeditor和ckfinder插件。地址:http://ckeditor.com/downloadhttp://ckfinder.com/download

 

2. 解压ckeditor和ckfinder,把ckeditor和ckfinder放在同一个文件夹里面,如下图

Ckeditor+Ckfinder+Java集成 - 飞 - 狼族传说

Ckeditor+Ckfinder+Java集成 - 飞 - 狼族传说
 
 3. 修改ckeditor中的配置(ckeditor文件夹中的config.js) ,集成ckfinder的上传功能,把以下代码放入配置中:
//配置默认配置
 config.language = 'zh-cn'; //配置语言
 // config.uiColor = '#FFF'; //背景颜色
 // config.width = 400; //宽度
 // config.height = 400; //高度
 // config.skin = 'v2'; //编辑器皮肤样式
 // 取消 “拖拽以改变尺寸”功能
 // config.resize_enabled = false;
 // 使用基础工具栏
 // config.toolbar = "Basic";
 // 使用全能工具栏
 config.toolbar = "Full";
 //使用自定义工具栏
 // config.toolbar =
 // [
 // ['Source', 'Preview', '-'],
 // ['Cut', 'Copy', 'Paste', 'PasteText', 'PasteFromWord', ],
 // ['Undo', 'Redo', '-', 'Find', 'Replace', '-', 'SelectAll', 'RemoveFormat'],
 // ['Image', 'Flash', 'Table', 'HorizontalRule', 'Smiley', SpecialChar','PageBreak'],
 // '/',
 // ['Bold', 'Italic', 'Underline', '-', 'Subscript', 'Superscript'],
 // ['NumberedList', 'BulletedList', '-', 'Outdent', 'Indent', 'Blockquote'],
 // ['JustifyLeft', 'JustifyCenter', 'JustifyRight', 'JustifyBlock'],
 // ['Link', 'Unlink', 'Anchor'],
 // '/',
 // ['Format', 'Font', 'FontSize'],
 // ['TextColor', 'BGColor'],
 // ['Maximize', 'ShowBlocks', '-', 'About']
 // ];
 // 在 CKEditor 中集成 CKFinder,注意 ckfinder 的路径选择要正确。 ( CKEditor与CKFinder均放在WebRoot目录下,则将Fckeditor改为..)
 config.filebrowserBrowseUrl = 'Fckeditor/ckfinder/ckfinder.html',
 config.filebrowserImageBrowseUrl = 'Fckeditor/ckfinder/ckfinder.html?type=Images',
 config.filebrowserFlashBrowseUrl = 'Fckeditor/ckfinder/ckfinder.html?type=Flash',
 config.filebrowserUploadUrl = 'Fckeditor/ckfinder/core/connector/java/connector.java?command=QuickUpload&type=Files',
 config.filebrowserImageUploadUrl = 'Fckeditor/ckfinder/core/connector/java/connector.java?command=QuickUpload&type=Images',
 config.filebrowserFlashUploadUrl = 'Fckeditor/ckfinder/core/connector/java/connector.java?command=QuickUpload&type=Flash',
 config.filebrowserWindowWidth = '1000',
  config.filebrowserWindowHeight = '700'
 
4. 页面调用
 先引入ckeditor和ckfinder的js文件
    <script type="text/javascript" src="Fckeditor/ckeditor/ckeditor.js"></script>
    <script type="text/javascript" src="Fckeditor/ckfinder/ckfinder.js"></script>
然后利用标签显示
<textarea id="editor1" name="editor1" class="ckeditor" rows="10" cols="80">&nbsp;</textarea>
注:&nbsp;是为了防止IE9出现页面异常,经过测试发现IE9出现乱跳转问题。
 

5.  去水印的方法

一共有两处需要去掉水印

Ckeditor+Ckfinder+Java集成 - 飞 - 狼族传说

 第1处水印可以通过隐藏进行处理,打开ckfinder下面的ckfinder.js文件,查找<h4,此标签上添加隐藏样式style='display:none;'及隐藏该水印。

第2处水印可以通过把水印信息提示置空进行处理,打开ckfinder下面的ckfinder.js文件,查找\x3c\144会找到相应16禁止ASCII编码,如下:

Ckeditor+Ckfinder+Java集成 - 飞 - 狼族传说

 把此处的ASCII编码进行删除就可以了,注意,不是变成p="",而是var p="\x20";

至此,ckeditor3.5.3+ckfinder2.0.2+Java已经配置完毕。

 

 

 

附录:

没有struts2,则web.xml内容如下:

<?xml version="1.0" encoding="UTF-8"?>
<web-app id="WebApp_ID" version="2.4"
	xmlns="http://java.sun.com/xml/ns/j2ee" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
	xsi:schemaLocation="http://java.sun.com/xml/ns/j2ee http://java.sun.com/xml/ns/j2ee/web-app_2_4.xsd">

	<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>

</web-app>
 

 

与struts2的整合关键是web.xml与struts.xml文件的变化。

 

有两种方案:

方案一:

web.xml内容为:

<?xml version="1.0" encoding="UTF-8"?>
<web-app id="WebApp_ID" version="2.4"
	xmlns="http://java.sun.com/xml/ns/j2ee" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
	xsi:schemaLocation="http://java.sun.com/xml/ns/j2ee http://java.sun.com/xml/ns/j2ee/web-app_2_4.xsd">

	<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>


<filter>
        <filter-name>struts2</filter-name>
        <filter-class>org.apache.struts2.dispatcher.ng.filter.StrutsPrepareAndExecuteFilter</filter-class>
        <!-- <init-param>
        	<param-name>config</param-name>
        	<param-value>../struts-xml/struts.xml</param-value>
        </init-param> -->
    </filter>

    <filter-mapping>
        <filter-name>struts2</filter-name>
        <url-pattern>*.action</url-pattern>
    </filter-mapping>

  </web-app>
    

 方案二:(推荐)

web.xml内容为:

<?xml version="1.0" encoding="UTF-8"?>
<web-app id="WebApp_ID" version="2.4"
	xmlns="http://java.sun.com/xml/ns/j2ee" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
	xsi:schemaLocation="http://java.sun.com/xml/ns/j2ee http://java.sun.com/xml/ns/j2ee/web-app_2_4.xsd">

	<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>


<filter>
        <filter-name>struts2</filter-name>
        <filter-class>org.apache.struts2.dispatcher.ng.filter.StrutsPrepareAndExecuteFilter</filter-class>
        <!-- <init-param>
        	<param-name>config</param-name>
        	<param-value>../struts-xml/struts.xml</param-value>
        </init-param> -->
    </filter>

    <filter-mapping>
        <filter-name>struts2</filter-name>
        <url-pattern>/*</url-pattern>
    </filter-mapping>

  </web-app>
 

 

同时,在strutsmxl添加一句话:

<constant name="struts.action.excludePattern" value="/ckfinder.*"/> 
 

 

 

 

 

感谢:

Ckeditor+Ckfinder+Java集成  

ckeditor&ckfinder&s2sh集成

 

 

 

分享到:
评论

相关推荐

    ckeditor3.6.5+ckfinder2.1+struts2

    ckeditor3.6.5+ckfinder2.1+struts2的整合,破解方法,有源码,ckfinder.js已经被破解了, 可以直接用。ckfinder和struts2的整合在文档最后。 最新版本的ckfinder我没有找到破解方法, 所以用的2.1版本。 希望可以帮...

    Struts2整合之CKeditor和CKfinder

    在这个主题中,“Struts2整合之CKeditor和CKfinder”涉及到的是如何在Struts2应用中集成富文本编辑器CKeditor和文件管理工具CKfinder。 CKeditor是一款广泛使用的开源富文本编辑器,它允许用户在网页上创建和编辑...

    Struts2整合CKeditor

    在Struts2中整合CKeditor和CKfinder,主要是为了让用户在编辑内容时能够方便地插入和管理多媒体资源。这个过程涉及以下几个关键知识点: 1. **Struts2配置**:首先,你需要在Struts2的配置文件(struts.xml)中添加...

    ckeditor+ckfinder(java 版本)

    2. **集成度高**:CKEditor与CKFinder的集成使得用户在编辑文本时可以直接处理文件,无需离开编辑界面,提高了工作效率。 3. **跨平台**:由于是Java实现,该系统具备良好的跨平台性,可以在Windows、Linux、Mac等...

    struts下ckeditor4.2+ckfinder2.3.1结合简单demo

    在这个"struts下ckeditor4.2+ckfinder2.3.1结合简单demo"中,我们将探讨如何在Struts框架中整合这两个工具以实现高效的富文本编辑和文件管理。 首先,集成CKEditor和CKFinder需要在项目中引入它们的库文件。...

    Ckeditor3.X与ckfinder2.X整合forJAVA (支持文件上传,解决中文乱码)

    在网上找了半天,看见两偏整合教程不错,把两偏整理成一偏供参考。 别人一个文档就要10分才能下,本人分不多了,扣大家5分来赚取回来。...Ckeditor3.X与ckfinder2.X整合forJAVA (支持文件上传,解决中文乱码)

    ckeditor+ckfinder

    将CKFinder与CKEditor整合,可以实现在CKEditor中直接上传、选择和插入服务器上的文件。这种集成通常涉及以下步骤: 1. **安装CKEditor**:首先,在项目中引入CKEditor的JavaScript库,根据官方文档设置初始化配置...

    ckfinder的java实现

    CKFinder通常与富文本编辑器CKEditor一起使用,为用户提供了一套完整的多媒体内容管理解决方案。 在Java环境下实现CKFinder,我们需要了解以下关键知识点: 1. **CKFinder的安装与配置**: - 首先,从官方下载...

    ckfinder_java_2.6.0

    如果你正在使用Java开发Web应用,CKFinder Java 2.6.0会是一个理想的选择,因为它可以轻松地与Spring、Struts、JSF等Java框架整合,让文件管理功能成为你应用的一部分。 至于压缩包中的"ckfinder"文件,这很可能是...

    struts2.3.4.1+hibernate4.1.6+spring3.1.2 整合全注解例子

    struts2.3.4.1+hibernate4.1.6+spring3.1.2 整合,全注解例子。数据库用的mysql,数据库会自动生成。整合分页、ckeditor+ckfinder.CK有些问题,上传图片不显示缩略图。

Global site tag (gtag.js) - Google Analytics