FCKeditor - Fckeditor使用说明含文件上传功能

大家知道FCKeditor是一款强大的富文本框控件,可能很多人还不知道如何把她加入到项目中,或者知道但是已经忘记了,没关系,我们在这学习学习,复习复习。

[color=red][b]1、下载fckeditor[/b][/color]
地址:http://ckeditor.com/

[color=red][b]2、导入jar包和文件[/b][/color]
fckeditor-java-core-2.6.jar
imageinfo-1.9.jar
fckeditor下的js、html等文件,可以删除所有以"_"开头的文件夹

[color=red][b]3、导入标签和使用标签[/b][/color]

<%@ taglib uri="http://java.fckeditor.net" prefix="fck" %>
<fck:editor instanceName="movInfo.info"></fck:editor>
<fck:editor inputName="movInfo.info" instanceName="movInfomation" toolbarSet="Basic"></fck:editor>


[color=red][b]4、自定义工具栏[/b][/color]
配置fckconfig.js

FCKConfig.ToolbarSets["Default"] = [
['Source','DocProps','-','Save','NewPage','Preview','-','Templates'],
['Cut','Copy','Paste','PasteText','PasteWord','-','Print','SpellCheck'],
['Undo','Redo','-','Find','Replace','-','SelectAll','RemoveFormat'],
['Form','Checkbox','Radio','TextField','Textarea','Select','Button','ImageButton','HiddenField'],
'/',
['Bold','Italic','Underline','StrikeThrough','-','Subscript','Superscript'],
['OrderedList','UnorderedList','-','Outdent','Indent','Blockquote','CreateDiv'],
['JustifyLeft','JustifyCenter','JustifyRight','JustifyFull'],
['Link','Unlink','Anchor'],
['Image','Flash','Table','Rule','Smiley','SpecialChar','PageBreak'],
'/',
['Style','FontFormat','FontName','FontSize'],
['TextColor','BGColor'],
['FitWindow','ShowBlocks','-','About'] // No comma for the last row.
] ;

FCKConfig.ToolbarSets["Basic"] = [
['Bold','Italic','-','OrderedList','UnorderedList','-','Link','Unlink','-','About']
] ;

[color=red]说明:[/color]

instanceName 就是相当去控件的name
toolbarSet 就是设置你需要使用的功能样式,在上面定义的,当然你也可以自己增加新的
<fck:editor instanceName="movInfo.info" toolbarSet="Basic"></fck:editor>


[color=red][b]5、配置文件上传(与Struts2共存)[/b][/color]
由于大部分情况下我们在配置Struts2的过滤器的时候都是用*,所以这边我要绕过她,在这里写一个过滤器先。

package com.main.movie.filter;

import java.io.IOException;

import javax.servlet.Filter;
import javax.servlet.FilterChain;
import javax.servlet.FilterConfig;
import javax.servlet.ServletException;
import javax.servlet.ServletRequest;
import javax.servlet.ServletResponse;
import javax.servlet.http.HttpServletRequest;

public class FckUploadFilter implements Filter {
private String DispatcherUrl;
public void destroy() {

}

public void doFilter(ServletRequest request, ServletResponse response,
FilterChain chain) throws IOException, ServletException {
HttpServletRequest httprequest = (HttpServletRequest) request;
//其实就是根据传的参数来判断在做什么
if (httprequest.getParameter("Type") != null && httprequest.getParameter("Type").equals("Image")) {
//跳转到fck用的页面,不执行后面的过滤器
httprequest.getRequestDispatcher(DispatcherUrl).forward(request, response);
} else {
//否则才继续执行过滤器,所以在配置web.xml的时候要把该过滤器放在struts2的前面
chain.doFilter(request, response);
}
}

public void init(FilterConfig filterConfig) throws ServletException {
DispatcherUrl = filterConfig.getInitParameter("DispatcherUrl");
}

}

配置struts.xml,加入下面的代码片段

<constant name="struts.multipart.saveDir" value="/tmp"></constant>


[color=red][b]6、配置web.xml[/b][/color]
[color=red][b]注意FCK的过滤器一定要配置在Struts2过滤器的前面[/b][/color]

<!-- FckUploadFilter -->
<filter>
<filter-name>FckUploadFilter</filter-name>
<filter-class>com.main.movie.filter.FckUploadFilter</filter-class>
<init-param>
<param-name>DispatcherUrl</param-name>
<param-value>/fckeditor/editor/filemanager/connectors/</param-value>
</init-param>
</filter>
<filter-mapping>
<filter-name>FckUploadFilter</filter-name>
<url-pattern>/fckeditor/editor/filemanager/connectors/*</url-pattern>
</filter-mapping>

<!-- Fckeditor -->
<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>


[color=red][b]7、配置fckeditor.properties(就创建这个文件然后把下面的代码复制进去就行了)[/b][/color]

# default allowed extensions settings
connector.resourceType.file.extensions.allowed = 7z|aiff|asf|avi|bmp|csv|doc|fla|flv|gif|gz|gzip|jpeg|jpg|mid|mov|mp3|mp4|mpc|mpeg|mpg|ods|odt|pdf|png|ppt|pxd|qt|ram|rar|rm|rmi|rmvb|rtf|sdc|sitd|swf|sxc|sxw|tar|tgz|tif|tiff|txt|vsd|wav|wma|wmv|xls|xml|zip
connector.resourceType.image.extensions.allowed = bmp|gif|jpeg|jpg|png
connector.resourceType.flash.extensions.allowed = swf|fla
connector.resourceType.media.extensions.allowed = aiff|asf|avi|bmp|fla|flv|gif|jpeg|jpg|mid|mov|mp3|mp4|mpc|mpeg|mpg|png|qt|ram|rm|rmi|rmvb|swf|tif|tiff|wav|wma|wmv

# default resource type paths
connector.resourceType.file.path = /file
connector.resourceType.image.path = /image
connector.resourceType.flash.path = /flash
connector.resourceType.media.path = /media

# Due to security issues with Apache modules, it is recommended to leave this
# setting enabled.
connector.forceSingleExtension = true

# base URL path for the userfiles
connector.userFilesPath = /fckupload

# base system path on the backend for the userfiles
connector.userFilesAbsolutePath = /fckupload

# Instructs the Connector to check, if the uploaded image is really one
connector.secureImageUploads = true

# directory of the editor relative to the context root
fckeditor.basePath = /fckeditor

# default height of the editor
fckeditor.height = 200

# default toolbar set of the editor
fckeditor.toolbarSet = Default

# default width of the editor
fckeditor.width = 100%

# default implementations
connector.impl = net.fckeditor.connector.impl.ContextConnector
connector.userActionImpl = net.fckeditor.requestcycle.impl.EnabledUserAction
connector.userPathBuilderImpl = net.fckeditor.requestcycle.impl.ContextPathBuilder
localization.localeResolverImpl = net.fckeditor.localization.impl.AcceptLanguageHeaderResolver
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值