在jsp页面中使用FCKeditor

            参考了很多网上的文章，终于在jsp页面中成功使用了FCKeditor。

           1，我用到的包是：FCKeditor-2.3.zip和FCKEditor_v2.6.8.zip（在csdn上就可以下载到）。

          ,2，过程：

                      a，新建一个web项目，例如MyFCKeditor；

                      b，在WebRoot下新建一个FCKeditor包；

                      c，将\FCKeditor_v2.6.8\fckeditor\editor目录和FCKeditor_v2.6.8\fckeditor中的fckconfig.js、fckeditor.js、fckstyles.xml以及fcktemlates.xml放在FCKeditor包中；

                            修改fckconfig.js文件（以下是修改后的结果）

                            FCKConfig.DefaultLanguage  = 'zh-cn' ;

                            FCKConfig.LinkBrowserURL = FCKConfig.BasePath + 'filemanager/browser/default/browser.html?Connector=connectors/jsp/connector';

                            FCKConfig.ImageBrowserURL = FCKConfig.BasePath + 'filemanager/browser/default/browser.html?Type=Image&Connector=connectors/jsp/connector';

                            FCKConfig.FlashBrowserURL = FCKConfig.BasePath + 'filemanager/browser/default/browser.html?Type=Flash&Connector=connectors/jsp/connector';

                            FCKConfig.LinkUploadURL = FCKConfig.BasePath + 'filemanager/upload/simpleuploader?Type=File';

                            FCKConfig.ImageUploadURL = FCKConfig.BasePath + 'filemanager/upload/simpleuploader?Type=Image';

                            FCKConfig.FlashUploadURL = FCKConfig.BasePath + 'filemanager/upload/simpleuploader?Type=Flash';

                      d，将\FCKeditor-2.3\web\WEB-INF\lib中的jar包全部放在MyFCKeditor的WEB-INF\lib下；

                      e，将\FCKeditor-2.3\src下的FCKeditor.tld复制到WEB-INF下；

                      f，将\FCKeditor-2.3\web\WEB-INF下的web.xml与MyFCKeditor下的web.xml合并；

                           即将下边代码放在<web-app></web-app>下

                           <display-name>FCKeditor Test Application</display-name>
 
 <servlet>
  <servlet-name>Connector</servlet-name>
  <servlet-class>com.fredck.FCKeditor.connector.ConnectorServlet</servlet-class>
  <init-param>
   <param-name>baseDir</param-name>
   <param-value>/UserFiles/</param-value>
  </init-param>
  <init-param>
   <param-name>debug</param-name>
   <param-value>true</param-value>
  </init-param>
  <load-on-startup>1</load-on-startup>
 </servlet>

 <servlet>
  <servlet-name>SimpleUploader</servlet-name>
  <servlet-class>com.fredck.FCKeditor.uploader.SimpleUploaderServlet</servlet-class>
  <init-param>
   <param-name>baseDir</param-name>
   <param-value>/UserFiles/</param-value>
  </init-param>
  <init-param>
   <param-name>debug</param-name>
   <param-value>true</param-value>
  </init-param>
  <init-param>
   <param-name>enabled</param-name>
   <param-value>true</param-value>
  </init-param>
  <init-param>
   <param-name>AllowedExtensionsFile</param-name>
   <param-value></param-value>
  </init-param>
  <init-param>
   <param-name>DeniedExtensionsFile</param-name>
   <param-value>php|php3|php5|phtml|asp|aspx|ascx|jsp|cfm|cfc|pl|bat|exe|dll|reg|cgi</param-value>
  </init-param>
  <init-param>
   <param-name>AllowedExtensionsImage</param-name>
   <param-value>jpg|gif|jpeg|png|bmp</param-value>
  </init-param>
  <init-param>
   <param-name>DeniedExtensionsImage</param-name>
   <param-value></param-value>
  </init-param>
  <init-param>
   <param-name>AllowedExtensionsFlash</param-name>
   <param-value>swf|fla</param-value>
  </init-param>
  <init-param>
   <param-name>DeniedExtensionsFlash</param-name>
   <param-value></param-value>
  </init-param>
  <load-on-startup>1</load-on-startup>
 </servlet>

  <servlet-mapping>
    <servlet-name>Connector</servlet-name>
    <url-pattern>/editor/filemanager/browser/default/connectors/jsp/connector</url-pattern>
  </servlet-mapping>
 
  <servlet-mapping>
    <servlet-name>SimpleUploader</servlet-name>
    <url-pattern>/editor/filemanager/upload/simpleuploader</url-pattern>
  </servlet-mapping> 

 

注意红色标注部分，表示启用上传功能。默认为false，需要改为true；

如果是使用js来使用FCKeditor，那么web.xml中可以不用<taglib>,我这里使用标签方式，因此需要加上<taglib>,旧版本的直接在<web-app></web-app>中添加<taglib></taglib>,新版本需要将<taglib></taglib>放在<jsp-config></jsp-config>中，如下：

<jsp-config>
 <taglib>
  <taglib-uri>/WEB-INF/FCKeditor.tld</taglib-uri>
  <taglib-location>/WEB-INF/FCKeditor.tld</taglib-location>
 </taglib>
 </jsp-config>
 

              g，在index.jsp页面中使用FCKeditor，页面内容如下：

<%@page language="java" import="java.util.*" pageEncoding="GB18030"%>
<%@page language="java" import="com.fredck.FCKeditor.*" %>
<%@taglib uri="/WEB-INF/FCKeditor.tld" 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 'index.jsp' starting page</title>
 <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">
 <!--
 <link rel="stylesheet" type="text/css" href="styles.css">
 -->
 <script type="text/javascript" src="/FCKeditorTest/fckeditor.js"></script>
  </head>
 
  <body>
    <form method="POST" action="">
<fck:editor id="content"  width="700" height="500" skinPath="/FCKeditorTest/FCKeditor/editor/skins/silver/" toolbarSet = "Default">
input
</fck:editor>
<input type="submit" value="Submit">
   </form>
  </body>
</html>

 

完成，效果如下：