S2SH与ckeditor+ckfinder整合笔记

最新推荐文章于 2022-03-19 15:17:29 发布

Roy_zdc

最新推荐文章于 2022-03-19 15:17:29 发布

阅读量3.6k

点赞数

分类专栏： ckeditor ckfinder SSH整理合文章标签： struts url java servlet string tiff

本文链接：https://blog.csdn.net/greensurfer/article/details/7552739

版权

SSH整理合同时被 3 个专栏收录

14 篇文章 0 订阅

订阅专栏

ckeditor

1 篇文章 0 订阅

订阅专栏

ckfinder

1 篇文章 0 订阅

订阅专栏

在S2SH开发的项目中需要做文章管理的功能，使用ckeditor+ckfinder实现文章编辑和文件管理。

一、需要的下载的资源有：

ckeditor_3.6.3.zip

ckeditor-java-3.6.2.war

ckfinder_java_2.2.1.zip （注意要下载java版）

将下载的ckeditor和ckfinder文件夹放到WebRoot根目录下同一级别：

把下载的ckedditor和ckfinder包时包含在其lib目录下的资源包引用到自己的项目中：

这里还有两个jar包：commons-io-2.0.1.jar、commons-fileupload-1.2.2.jar没有放进来，是因为我struts2的引用中已经有这两个jar包了。

二、代码

前台页面代码：

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>

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

<script type="text/javascript" src="<%=basePath%>ckeditor/ckeditor.js"></script>
<script type="text/javascript" src="<%=basePath%>ckfinder/ckfinder.js"></script>

</head>

<body>
	<a href="<%=basePath%>jsp/index.jsp">返回首页</a> | <a href="<%=basePath%>jsp/viewNews.jsp">查看新闻</a>
	<div>
		<center><h2>添加新闻</h2></center>
		
		<form name="form1" action="newsInfo" method="post">
			<table style="width:1024px;height:auto;" border="0" cellspacing="10px;" cellpadding="5">
				<tr>
					<td>标题：</td>
					<td><input type="text" value="" name="news.title"
						style="width:100%;height:28px;padding-left:5px; margin-top:3px;" />
					</td>
				</tr>
				<tr>
					<td valign="top">内容：</td>
					<td><textarea id="editor1" name="news.content" rows="5" cols="50"></textarea>
					</td>
				</tr>
				<tr>
					<td></td>
					<td></td>
				</tr>
				<tr>
					<td></td>
					<td><input type="submit" value="提交"  style="width:80px;height:25px;"/>
					</td>
				</tr>
			</table>

		</form>
	</div>
	
	<script type="text/javascript">
		CKEDITOR.replace('editor1',{
			filebrowserBrowseUrl : '<%=basePath%>ckfinder/ckfinder.html',
			filebrowserImageBrowseUrl : '<%=basePath%>ckfinder/ckfinder.html?type=Images',
			filebrowserFlashBrowseUrl : '<%=basePath%>ckfinder/ckfinder.html?type=Flash',
			filebrowserUploadUrl : '<%=basePath%>ckfinder/core/connector/java/connector.java?command=QuickUpload&type=Files',
			filebrowserImageUploadUrl : '<%=basePath%>ckfinder/core/connector/java/connector.java?command=QuickUpload&type=Images',
			filebrowserFlashUploadUrl : '<%=basePath%>ckfinder/core/connector/java/connector.java?command=QuickUpload&type=Flash'
		});
	</script>
</body>
</html>

三、配置文件：

web.xml中添加以下配置，原先struts2及其spring的配置都不变：

<!-- ckfinder文件上传配置 start -->
	<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>
	<!-- ckfinder文件上传配置 end -->

把下载的ckfinder包中WEB-INF目录下的config.xml文件拷贝过来，放到自己项目的WEB-INF目录下。

config.xml：

<config>
	<enabled>true</enabled>
	<baseDir>C:\tomcat7\webapps\UserManager\ckfinderFiles</baseDir>
	<baseURL>http://localhost:10002/UserManager/ckfinderFiles/</baseURL>
	<licenseKey></licenseKey>
	<licenseName></licenseName>
	<imgWidth>1600</imgWidth>
	<imgHeight>1200</imgHeight>
	<imgQuality>80</imgQuality>
	<uriEncoding>UTF-8</uriEncoding>
	<forceASCII>false</forceASCII>
        <disallowUnsafeCharacters>false</disallowUnsafeCharacters>
	<userRoleSessionVar>CKFinder_UserRole</userRoleSessionVar>
	<checkDoubleExtension>true</checkDoubleExtension>
	<checkSizeAfterScaling>true</checkSizeAfterScaling>
	<secureImageUploads>true</secureImageUploads>
	<htmlExtensions>html,htm,xml,js</htmlExtensions>
	<hideFolders>
		<folder>.svn</folder>
		<folder>CVS</folder>
	</hideFolders>
	<hideFiles>
		<file>.*</file>
	</hideFiles>
	<defaultResourceTypes></defaultResourceTypes>
	<types>
		<type name="Files">
			<url>%BASE_URL%files/</url>
			<directory>%BASE_DIR%files</directory>
			<maxSize>0</maxSize>
			<allowedExtensions>7z,aiff,asf,avi,bmp,csv,doc,docx,fla,flv,gif,gz,gzip,jpeg,jpg,mid,mov,mp3,mp4,mpc,mpeg,mpg,ods,odt,pdf,png,ppt,pptx,pxd,qt,ram,rar,rm,rmi,rmvb,rtf,sdc,sitd,swf,sxc,sxw,tar,tgz,tif,tiff,txt,vsd,wav,wma,wmv,xls,xlsx,zip
			</allowedExtensions>
			<deniedExtensions></deniedExtensions>
		</type>
		<type name="Images">
			<url>%BASE_URL%images/</url>
			<directory>%BASE_DIR%images</directory>
			<maxSize>0</maxSize>
			<allowedExtensions>bmp,gif,jpeg,jpg,png</allowedExtensions>
			<deniedExtensions></deniedExtensions>
		</type>
		<type name="Flash">
			<url>%BASE_URL%flash/</url>
			<directory>%BASE_DIR%flash</directory>
			<maxSize>0</maxSize>
			<allowedExtensions>swf,flv</allowedExtensions>
			<deniedExtensions></deniedExtensions>
		</type>
	</types>
	<accessControls>
		<accessControl>
			<role>*</role>
			<resourceType>*</resourceType>
			<folder>/</folder>
			<folderView>true</folderView>
			<folderCreate>true</folderCreate>
			<folderRename>true</folderRename>
			<folderDelete>true</folderDelete>
			<fileView>true</fileView>
			<fileUpload>true</fileUpload>
			<fileRename>true</fileRename>
			<fileDelete>true</fileDelete>
		</accessControl>
	</accessControls>
	<thumbs>
		<enabled>true</enabled>
		<url>%BASE_URL%_thumbs/</url>
		<directory>%BASE_DIR%_thumbs</directory>
		<directAccess>false</directAccess>
		<maxHeight>100</maxHeight>
		<maxWidth>100</maxWidth>
		<quality>80</quality>
	</thumbs>
	<plugins>
		<plugin>
			<name>imageresize</name>
			<class>com.ckfinder.connector.plugins.ImageResize</class>
			<params>
				<param name="smallThumb" value="90x90"></param>
				<param name="mediumThumb" value="120x120"></param>
				<param name="largeThumb" value="180x180"></param>
			</params>
		</plugin>
		<plugin>
			<name>fileeditor</name>
			<class>com.ckfinder.connector.plugins.FileEditor</class>
			<params></params>
		</plugin>
	</plugins>
	<basePathBuilderImpl>com.ckfinder.connector.configuration.ConfigurationPathBuilder</basePathBuilderImpl>
</config>

修改baseDir和baseURL配置：

baseDir 是ckfinder文件上传时的绝对路径。

baseURL 是ckeditor访问ckfinder提供的文件的网络路径。

最后，在struts.xml配置文件中增加以下配置：

<!-- ckfinder文件上传配置 -->
	<constant name="struts.action.excludePattern" value="/ckfinder.*" />

ckfinder采用servlet处理文件的，我配置的是struts默认会拦截所有请求，这里需要排除struts2拦截ckfinder的请求，否则ckfinder上传文件会失败。

Roy_zdc

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
2
评论
S2SH与ckeditor+ckfinder整合笔记

在S2SH开发的项目中需要做文章管理的功能，使用ckeditor+ckfinder实现文章编辑和文件管理。一、需要的下载的资源有：ckeditor_3.6.3.zipckeditor-java-3.6.2.warckfinder_java_2.2.1.zip （注意要下载java版）将下载的ckeditor和ckfinder文件夹放到WebRoot根目录下
复制链接

扫一扫