FCKeditor与struts框架结合使用点滴-优快云博客

本文介绍如何将富文本编辑器FCKEditor与Struts框架集成，包括配置步骤、示例代码展示以及如何处理上传图片等问题。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

富客户的编辑器，已经使用很广泛了，我也好奇的想感受一把，学习学习。于是，就去down了最新的fckeditor

我使用的是：

fckeditor_2.6.3

使用的java开发包是fckeditor-java-core-2.4.1.jar

我首先按照fckeditor给例子，下了所有的jar包，然后拷贝了fckeditor_2.6.3里的fckeditor，当然按照提供的demo是需要去掉里面很多文件的。我的fckeditor文件夹下就只剩下了：

_samples、editor两个文件夹以及fckconfig.js、fckeditor.js、fckpackager.xml、fckstyles.xml、fcktemplates.xml几个文件。

要和struts结合使用需要修改你的vweb.xml

我的xml文件如下：

<?xml version="1.0" encoding="UTF-8"?>
<web-app version="2.4" id="fckeditor-java"
	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">
	<display-name>FCKeditor.Java Sample Web Application</display-name>
	<description>FCKeditor.Java Sample Web Application</description>
	<filter>
		<filter-name>encodingFilter</filter-name>
		<filter-class>
			com.test.fck.filter.CharacterEncodingFilter
		</filter-class>
		<init-param>
			<param-name>encoding</param-name>
			<param-value>UTF-8</param-value>
		</init-param>
		<init-param>
			<param-name>forceEncoding</param-name>
			<param-value>true</param-value>
		</init-param>
	</filter>
	
	<filter-mapping>
		<filter-name>encodingFilter</filter-name>
		<url-pattern>*.do</url-pattern>
	</filter-mapping>
	<filter-mapping>
		<filter-name>encodingFilter</filter-name>
		<url-pattern>*.jsp</url-pattern>
	</filter-mapping>
	
	
	<servlet>
		<servlet-name>Connector</servlet-name>
		<servlet-class>
			net.fckeditor.connector.ConnectorServlet
		</servlet-class>
		<load-on-startup>1</load-on-startup>
	</servlet>
	<servlet>
		<servlet-name>action</servlet-name>
		<servlet-class>
			org.apache.struts.action.ActionServlet
		</servlet-class>
		<init-param>
			<param-name>config</param-name>
			<param-value>/WEB-INF/struts-config.xml</param-value>
		</init-param>
		<load-on-startup>2</load-on-startup>
	</servlet>


	<servlet-mapping>
		<servlet-name>Connector</servlet-name>
		<!-- Do not wrap this line otherwise Glassfish will fail to load this file -->
		<url-pattern>
			/fckeditor/editor/filemanager/connectors/*
		</url-pattern>
	</servlet-mapping>
	<servlet-mapping>
		<servlet-name>action</servlet-name>
		<url-pattern>*.do</url-pattern>
	</servlet-mapping>
</web-app>

然后，就可以使用fckeditor了

我调用fckeditor的jsp如下：

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.fckeditor.net" prefix="FCK" %>
<%@ taglib uri="http://struts.apache.org/tags-html" prefix="html" %>
<%
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>FCKeditor.java2.4 for FCKeditor2.6.3Beate text</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
 <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">
  </head>
  <body>
    <html:form action="test.do" method="post">
    <FCK:editor instanceName="content" toolbarSet="Basic"></FCK:editor>
  <input type="submit" value="提交">
   </html:form>
    
  </body>
</html>

这里就是修改了一下fckeditor的demo而已。toolbar用的是basic，basic的配置可以在fckconfig.js中修改，至于fckconfig.js中各项的意思，就需要读者自己去查了（好多的）

我的显示用的jsp如下（实验中发现，如果用struts的tag来显示提交的内容，会把html标签也显示出来,使用jstl的标签也是一样的），所以就用最原始的jsp显示就好了。

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ taglib uri="http://struts.apache.org/tags-html" prefix="html" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%@ taglib uri="http://java.fckeditor.net" prefix="FCK" %>
<%
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>My JSP 'result.jsp' starting page</title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 <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">
  </head>
  <body>
   
   <%= request.getParameter("content")%>
	
  </body>
</html>

完全按照fckeditor的例子来就不会有错了，至于fckeditor上传图片等的问题。因为我也是初学，还没来的及研究呢。

不过富客户端的确是个好东西啊。不学学就落后了啊。