FCKEditor2.6.6 配合 JavaWeb 的 使用步骤

  FCKEditor 是一个很好的用于 Web页面中的格式化文本编译控件 。现在越来越多的论坛的发帖页面中更多的使用了这个控件,
  我总结的 把 这个控件 如何在
JavaWeb 开发中使用 FCKEditor 控件的步骤 提供给大家,为的是让更多的 Java初学发者 花费更少的时间去做更多的事


总体来说 4 个步骤:


One :

    首先去下载FCKEditor2.6.6 (现在已经是 3.6.1 的版本了,建议还是 使用稳定的版本比较好)

下载地址: http://www.fckeditor.net/download

我们需要下载两个文件:

(1) FCKeditor_2.6.6.zip,就是FCKEditor的控件;

(2) FCKeditor.Java(fckeditor-java-2.6-bin.zip),就是在Java代码中使用FCKEditor的相关工具类;


two :

    有了这两个文件,使用  FCKEditor 的基础就具备了,接下来做 2 件事情:

    (1)就是要把  FCKEditor控件 放到 web项目中,这个控件是用于网页的,所以其代码是使用JavaScript脚本编写的,需要和web网页一起被下载的浏览器上才能执行,

    (2)是这个网页上的控件因为支持图片的上传与下载,所以在上传与下载的时候需要服务端的支持,我们就的需要 FCKEditor 自身提供了相关的Java工具  用来支持这个控件的工作 ,也就是就是我们下载的第二个文件。
 
    因此我们要做的第二件事情就是在服务端配置  Java工具,使得FCKEditor控件在处理上传图片时能够正确工作。


Three:

接下来我们就开始对配置 FCKEditor 控件进行 2 项工作:

(1) :
      解压缩FCKeditor_2.6.3.zip ,在其中我们能找到一个文件夹叫fckeditor,那么将这个文件夹整个复制到你的web应用的根目录下,就是存放jsp页面的地方。

(2) :
      解压缩fckeditor-java-2.6-bin.zip,将这样几个jar文件复制到web应用的WEB-INF\lib目录中

      commons-fileupload-1.2.1.jar
      commons-io-1.3.2.jar
      imageinfo-1.9.jar
      java-core-2.6.jar
      slf4j-api-1.5.8.jar
      slf4j-simple-1.5.8.jar




其中最后一个文件在这个zip包中可能不存在,那么你可以去这个链接地址下载一个文件叫 fckeditor-java-demo-2.6.war
(
   下载地址1:
          http://sourceforge.net/projects/fckeditor/files/FCKeditor.Java/2.6/

   下载地址2:
          http://sourceforge.net/projects/fckeditor/files/FCKeditor.Java/2.6/fckeditor-java-demo-2.6.war/download
)

在这个war文件中的 lib 中存在上述的 6 个 jar 文件,其实在 war 中也包含了  FCKEditor 控件的内容,也就是说如果你只是下载了 war 也可以了。

  然后在classpath目录中创建一个名叫为fckeditor.properties的文件 src ( 编译之后处于 classes 目录中 ) 文件中放置内容为:  
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   (fck 资源所在 webapp 中的目录 )
fckeditor.skinPath = /skins/office2003/ (fck 样式 , 这里可选默认和 office2003 的样式 )
fckeditor.height = 630 (fck 编辑器的高度 )

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| 
cnnector.resourceType.flash.extensions.allowed=|swf| 
connector.userActionImpl=net.fckeditor.requestcycle.impl.UserActionImpl 
fckeditor.basePath = /fckeditor  
fckeditor.skinPath = /skins/office2003/ 
fckeditor.height = 630 





在web.xml中添加一个Servlet的配置,配置内容如下:

< servlet >
     < servlet-name >ConnectorServlet </ servlet-name >
     < servlet-class >net.fckeditor.connector.ConnectorServlet </ servlet-class >
     < load-on-startup >1 </ load-on-startup >
</ servlet >

< servlet-mapping >
     < servlet-name >ConnectorServlet </ servlet-name >
     < url-pattern >/fckeditor/editor/filemanager/connectors/* </ url-pattern >
</ servlet-mapping >




Four: 

好了,现在你已经完成了配置的过程,接下来我们需要在jsp中使用FCKEditor控件了,

在需要使用这个控件的jsp文件的开头添加标签库的引入语句:

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

在使用控件进行文本格式化输入的地方(原来你可能使用的textarea标签)使用如下的内容来替换原来的输入控件:

< form action ="result.jsp" method ="post" >        

< FCK:editor instanceName ="content" >        

< jsp:attribute name ="value" >        

内容.....        

</jsp:attribute>        

</FCK:editor>        

     < input type ="submit" value ="提交" >        

</form>


其中 instanceName 属性的 值就相当于 form 表单中的 input 的 name 值。 就是 表单 提交 时候 的 键值对 中 的键 的名字。


< FCK:editor instanceName ="content" height ="400pt" >
        
     < jsp:body >
   < FCK:config SkinPath ="${skin}" />
     </jsp:body>
        
</FCK:editor>


最后 在  创建一个 result  页面 , 在里面 用 你想用的用的方式接收一下 输出 即可: 

例如 这样 : <%=request.getParameter("content") %>

OVER !!!

你可能感兴趣的:(js,fckeditor,javaweb,FCKEditor2.6.6,FCKEditor2.6)