FCKeditor支持jsp的配置(myeclipse工具)

    网上有许多关于FCKeditor支持jsp的配置,但自己还是要总结一下。
    IDE:MyEclipse6.5
    框架:Struts2+spring+hibernate
    步骤:
1. 在fckeditor的官方网站 http://ckeditor.com/download下载FCKeditor_2.5.1.zip和FCKeditor-2.3.zip(for java),版本不同内容不同
2. 在MyEclipse中新建web项目,我的叫做wsjx
3. 解压缩两个文件,把FCKeditor_2.5.1.zip解压出来的fckeditor文件夹放在WebRoot目录下,把FCKeditor-2.3.zip(for java)解压出来的web下的WEB-INF下的lib目录中的commons-fileupload.jar和FCKeditor-2.3.jar两个jar包拷到项目的lib目录下,把FCKeditor-2.3.zip(for java)解压出来的src目录下的FCKeditor.tld拷贝到项目的WEB-INF下
4. 修改fckeditor文件夹下的fckeditor.js,找到FCKeditor.BasePath 并附值FCKeditor.BasePath = ' /wsjx/fckeditor/'
5. 修改fckeditor文件夹下的fckconfig.js,找到并作如下修改
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' ;
    不好意思,这部分的修改没有搞明白什么原因
6. 修改web.xml,加入:
web.xml

    
< 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 >
            /fckeditor/editor/filemanager/browser/default/connectors/jsp/connector
        
</ url-pattern >
    
</ servlet-mapping >

    
< servlet-mapping >
        
< servlet-name > SimpleUploader </ servlet-name >
        
< url-pattern >
            /fckeditor/editor/filemanager/upload/simpleuploader
        
</ url-pattern >
    
</ servlet-mapping >
7. 现在开始编写页面:有两个页面,一个是提交页面(addContent.jsp),一个是显示页面(showContent.jsp)
addContent.jsp:
<% @ page language="java" import="java.util.*" pageEncoding="utf-8" %>

<% @ taglib uri="/WEB-INF/FCKeditor.tld" prefix="fck" %>
< html >
    
< head >
        
< title > FCKeditor </ title >
    
</ head >

    
< body >
        
< form  action ="showContent.jsp"  method ="post" >
            
< table  align ="center" >

                
< tr >
                    
< td ></ td >
                
</ tr >
                
< tr >
                    
< td >
                        
< fck:editor  id ="content"  basePath ="/wsjx/fckeditor/"  width ="1000"
                            height
="500"  skinPath ="/wsjx/fckeditor/editor/skins/office2003/"
                            toolbarSet
="Default" >
                        
</ fck:editor >
                    
</ td >
                
</ tr >
                
< tr >
                    
< td >
                        
< input  type ="submit"  value ="Submit" >
                    
</ td >
                
</ tr >
            
</ table >

        
</ form >

    
</ body >
</ html >

showConten.jsp:这个相对简单
<% @ page language="java" import="java.util.*" pageEncoding="utf-8" %>

< html >
    
< head >

        
< title > 显示页面 </ title >

    
</ head >

    
< body >
        
<% = request.getParameter( " content " ) %>
    
</ body >
</ html >
现在部署到tomcat中,浏览,提交,看效果

这还没有完,因为可能会出现几种错误:
1. 当你上传图片时,提示“没有权限”,在控制台会输出“找不到Image文件夹”,那么在UserFiles里新建Image文件夹,即可
2. 当传输文字包括中文时,可能会出现显示乱码的问题,那么把showContent.jsp中的<%=request.getParameter("content")%>改成<%=new String(request.getParameter("content").getBytes("ISO-8859-1"),"utf-8")%> 即可
3. 当上传中文名的图片时,图片名称显示乱码,解决方式,在FCKeditor-2.3.zip(for java)解压出来的文件夹下,找到ConnectorServlet.java和SimpleUploadServlet.java,分别在两个文件中找到DiskFileUpload upload = new DiskFileUpload();这句,并在后面加上upload.setEncoding("utf-8");重新编译,并使用WinRAR打到jar包FCKeditor-2.3.jar的对应位置,替换掉原来的那个,即可
4. 当浏览服务器,并新建中文名的文件夹出现乱码时,只需设置tomcat的server.xml : <Connector port="8181" protocol="HTTP/1.1"
               connectionTimeout="20000"
               redirectPort="8443" URIEncoding="utf-8" /> 以及
<Connector port="8009" protocol="AJP/1.3" redirectPort="8443" URIEncoding="utf-8" /> 红色为添加部分,即可
5. 如果你还使用了struts2来过滤,那么就修改web.xml(也可以有其他方法,但这个相对简单些)
把原来的:
<filter>
  <filter-name>struts2</filter-name>
  <filter-class>
   org.apache.struts2.dispatcher.FilterDispatcher
  </filter-class>
 </filter>
 <filter-mapping>
  <filter-name>struts2</filter-name>
  <url-pattern>/*</url-pattern>
 </filter-mapping>
改成如下方式:
<filter>
  <filter-name>struts2</filter-name>
  <filter-class>
   org.apache.struts2.dispatcher.FilterDispatcher
  </filter-class>
 </filter>
 <filter-mapping>
  <filter-name>struts2</filter-name>
  <url-pattern>/struts/*</url-pattern>
 </filter-mapping>
 <filter-mapping>
  <filter-name>struts2</filter-name>
  <url-pattern>*.action</url-pattern>
 </filter-mapping>
 <filter-mapping>
  <filter-name>struts2</filter-name>
  <url-pattern>*.jsp</url-pattern>
 </filter-mapping>
 <filter-mapping>
  <filter-name>struts2</filter-name>
  <url-pattern>*.js</url-pattern>
 </filter-mapping>
即可

这样,就能畅快的享受fckeditor带给你的乐趣了……

你可能感兴趣的:(FCKeditor支持jsp的配置(myeclipse工具))