FCKEditor使用、修改源代码经验总结

suhuanzheng7784877

浏览: 707052 次
性别:
来自: 北京

最近访客更多访客>>

yangguangpiaosa

yekui

gaofeng393

s929498110

博主相关

博客

微博

相册

留言

关于我

博客专栏

: 读金庸故事，品程序人生
浏览量：47831

文章分类

社区版块

存档分类

博客分类：

JavaWeb

fckeditor Java Servlet JSP Web

FCKEditor使用、修改源代码经验总结

作者：刘岩

Email：suhuanzheng7784877@163.com

前言：

废话不多说了，搞过web开发的人大概都知道FCKeditor是做为在线HTML编辑器的，类似于word的编辑试图和展现方式，实际上幕后依然是转成了HTML脚本的。因为笔者使用的是Java语言，所以开发环境也是基于Java的IDE，其他语言的版本的集成和使用请查阅google。在使用fck中会遇到一些问题，大家需要修改一下它的源代码（还好它是开源的）才能解决。

下载：

从网站http://sourceforge.net/projects/fckeditor/files/FCKeditor.Java/2.4.1/下载压缩包，和源代码包src（内涵源代码，版本因人而异，个人觉得2.4.1足够了）

在自己的项目中使用FCKeditor：

1.在自己的web项目中添加一下jar包

/FCKDemo/WebRoot/WEB-INF/lib/commons-fileupload-1.2.1.jar

/FCKDemo/WebRoot/WEB-INF/lib/commons-io-1.3.2.jar

/FCKDemo/WebRoot/WEB-INF/lib/slf4j-api-1.5.2.jar

/FCKDemo/WebRoot/WEB-INF/lib/slf4j-simple-1.5.2.jar

/FCKDemo/WebRoot/WEB-INF/lib/java-core-2.4.1.jar

其中java-core-2.4.1.jar是fck自己的java程序原包、里面包含了fck的核心servlet和一些辅助util处理类。它在fckeditor-java-2.4.1-bin.zip的根目录下面。commons-fileupload-1.2.1.jar、commons-io-1.3.2.jar、slf4j-api-1.5.2.jar在fckeditor-java-2.4.1-bin.zip的lib下面，而slf4j-simple-1.5.2.jar需要读者自己从网上下载。

2.在您的web项目src下面添加fckeditor.properties文件，内容如下

connector.userFilesPath=/UserUploadFile

connector.resourceType.file.extensions.allowed=|jpg|gif|png|rar|zip|txt|doc|wma|wmv|mp3|flv|swf|

connector.resourceType.media.extensions.allowed=|wma|wmv|mp3|flv|swf|

connector.resourceType.image.extensions.allowed=|jpg|png|gif|

connector.resourceType.flash.extensions.allowed=|swf|

connector.userActionImpl=net.fckeditor.requestcycle.impl.UserActionImpl

fckeditor.basePath = /fckeditor

fckeditor.skinPath =/skins/silver/

配置文件里面的配置相信聪明的您一看英文就知道什么意思了，虽然笔者英语很差，但是也大概知道配置的大致意思。

3.引入fckeditor的javascript文件

把您下载的源码包fckeditor-java-2.4.1-src.zip中的

fckeditor-java-2.4.1-src.zip\fckeditor-java-2.4.1\java-demo\src\main\webapp下的fckeditor文件夹解压后整个拷贝到您的页面文件夹下。并且与fckeditor文件夹同级建立一个叫做UserUploadFile的文件夹用于存储用户上传的文件。

4.加入fckservlet：

修改web.xml，内容如下

<!—FCK的servlet-->

<servlet-name>Connector</servlet-name>

<servlet-class> net.fckeditor.connector.ConnectorServlet </servlet-class>

<load-on-startup>1</load-on-startup>

</servlet>

<servlet-mapping>

<servlet-name>Connector</servlet-name>

<url-pattern> /fckeditor/editor/filemanager/connectors/* </url-pattern>

</servlet-mapping>

OK，完成以上步骤，基本上就把FCKEditor加入到您的web项目中了。

下面我们来写个JSP页面测试一下效果

新建一个JSP页面form.jsp，内容如下：

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

<%@ taglib uri="http://java.fckeditor.net" prefix="FCK"%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>

<head>

<title>测试FCK页面 by-素还真</title>

<!--

-->

</head>

<body>

<table width="886" height="345" border="0" cellpadding="0"

cellspacing="0">

<tr>

<td>

<FCK:editor instanceName="content" height="345">

<jsp:attribute name="value">

</jsp:attribute>

</FCK:editor>

</form>

</td>

</tr>

</table>

</body>

</html>

在新建一个显示页面result.jsp，内容如下

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

String content = request.getParameter("content");

content = new String(content.getBytes("iso-8859-1"), "UTF-8");

System.out.println("---------------------");

out.println(content);

System.out.println("---------------------");

启动web服务器，打开IE输入url ：http://127.0.0.1:8080/FCKDemo/form.jsp，效果如下：

编辑一下，上传一张图片试试，效果如下

提交后显示如下

查看图片附件

分享到：

修改fck源代码（1）

2010-12-30 14:23
浏览 3692
评论(0)
分类:Web前端
查看更多

发表评论

您还没有登录,请您登录后再发表评论