[置顶] ckeditor 与 ckfinder基于Struts2 集成实现在线编辑以及文件上传(JAVA版)
2015-02-28 14:58
1096 查看
FCKeditor(ckeditor )是目前最优秀的可见即可得网页编辑器之一,它采用JavaScript编写。具备功能强大、配置容易、跨浏览器、支持多种编程语言、开源等特点。它非常流行,互联网上很容易找到相关技术文档,国内许多WEB项目和大型网站均采用了FCKeditor。
CKFinder是一个强大而易于使用的Web浏览器的Ajax文件管理器。其简单的界面使得它直观,快速学习的各类用户,从高级人才到互联网初学者。
1. 下载所需文件
ckeditor:http://ckeditor.com/download
建议Full Package,工具齐全;
以及下载所需JAR包
CKFinder:http://cksource.com/ckfinder/download#java-download
注意:请选择JAVA版下载
2. 配置ckeditor与ckfinder环境
解压下载的ckeditor 以及ckfinder,将解压了的文件夹 拷贝,放置在项目WebRoot目录下
将解压好的相关的JAR包加入lib目录下.。
ckeditor 与ckfinder整合在一起(注意目录)
修改ckeditor下面的config.js配置
添加以下信息:
config.language = "zh-cn" ;
config.image_previewText = ' ';
config.filebrowserBrowseUrl = '/testCK/ckfinder/ckfinder.html' ;
config.filebrowserImageBrowseUrl = '/testCK/ckfinder/ckfinder.html?type=Images' ;
config.filebrowserFlashBrowseUrl = '/testCK/ckfinder/ckfinder.html?type=Flash' ;
config.filebrowserUploadUrl = '/testCK/ckfinder/core/connector/java/connector.java? command=QuickUpload&type=Files' ;
config.filebrowserImageUploadUrl = '/testCK/ckfinder/core/connector/java/connector.java?command=QuickUpload&type=Images' ;
config.filebrowserFlashUploadUrl = '/testCK/ckfinder/core/connector/java/connector.java?command=QuickUpload&type=Flash' ;
config.filebrowserWindowWidth = '1000';
config.filebrowserWindowHeight = '700';
3. 引用ckeditor与ckfinder
页面引入对应的JS,以及给textarea添加样式与提示语
最终展示效果:
ckfinder整合在web.xml加入对应的servlet具体加入内容可参考ckfinder解压的web.xml
同时将config.xml拷贝只项目WEB-INF下面,修改config.xml:设置ckfinder为启动,且设置上传文件的目录
PS: Struts2在web.xml配置有设置为/*,所以也会拦截ckfinder的上传路径!
解决方案:修改struts2将/*改为*.action
struts2 2.3.4以下添加拦截器,继承FilterDispatcher
struts2 2.3.4以上(包含),在struts.xml添加
<constant name="struts.action.excludePattern" value="/ckfinder.*" /> 即可
效果展示:
图片上传:浏览服务器,可直接选择上传
服务器已存在上传的图片
过两天在写篇破解ckeditor 以及下载。。。。。
CKFinder是一个强大而易于使用的Web浏览器的Ajax文件管理器。其简单的界面使得它直观,快速学习的各类用户,从高级人才到互联网初学者。
1. 下载所需文件
ckeditor:http://ckeditor.com/download
建议Full Package,工具齐全;
以及下载所需JAR包
CKFinder:http://cksource.com/ckfinder/download#java-download
注意:请选择JAVA版下载
2. 配置ckeditor与ckfinder环境
解压下载的ckeditor 以及ckfinder,将解压了的文件夹 拷贝,放置在项目WebRoot目录下
将解压好的相关的JAR包加入lib目录下.。
ckeditor 与ckfinder整合在一起(注意目录)
修改ckeditor下面的config.js配置
添加以下信息:
config.language = "zh-cn" ;
config.image_previewText = ' ';
config.filebrowserBrowseUrl = '/testCK/ckfinder/ckfinder.html' ;
config.filebrowserImageBrowseUrl = '/testCK/ckfinder/ckfinder.html?type=Images' ;
config.filebrowserFlashBrowseUrl = '/testCK/ckfinder/ckfinder.html?type=Flash' ;
config.filebrowserUploadUrl = '/testCK/ckfinder/core/connector/java/connector.java? command=QuickUpload&type=Files' ;
config.filebrowserImageUploadUrl = '/testCK/ckfinder/core/connector/java/connector.java?command=QuickUpload&type=Images' ;
config.filebrowserFlashUploadUrl = '/testCK/ckfinder/core/connector/java/connector.java?command=QuickUpload&type=Flash' ;
config.filebrowserWindowWidth = '1000';
config.filebrowserWindowHeight = '700';
3. 引用ckeditor与ckfinder
页面引入对应的JS,以及给textarea添加样式与提示语
最终展示效果:
ckfinder整合在web.xml加入对应的servlet具体加入内容可参考ckfinder解压的web.xml
同时将config.xml拷贝只项目WEB-INF下面,修改config.xml:设置ckfinder为启动,且设置上传文件的目录
PS: Struts2在web.xml配置有设置为/*,所以也会拦截ckfinder的上传路径!
解决方案:修改struts2将/*改为*.action
struts2 2.3.4以下添加拦截器,继承FilterDispatcher
struts2 2.3.4以上(包含),在struts.xml添加
<constant name="struts.action.excludePattern" value="/ckfinder.*" /> 即可
效果展示:
图片上传:浏览服务器,可直接选择上传
服务器已存在上传的图片
过两天在写篇破解ckeditor 以及下载。。。。。
相关文章推荐
- Ckeditor与Ckfinder(java)整合实现富媒体内容编辑(支持文件上传)
- cakephp中使用ckeditor+ckfinder实现在线编辑与文件上传.
- struts2下使用ckeditor集成ckfinder无法上传文件的解决方法
- ckeditor3.5.3+ckfinder for java 2.1.1,嵌入文本编辑器,实现上传文件
- 富文本编辑器(ckEditor)集成struts2实现文件的上传
- CKEditor+CKFinder+JSP实现在线编辑器上传文件(包括图片、flash)
- java struts2入门学习实例--使用struts2快速实现多个文件上传
- CKEditor 3.6.2+CKFinder2.2.2配置,实现文件上传
- 基于struts2实现文件上传功能
- Java乔晓松-Struts2中文件上传和多文件上传以及获取HttpServletRequest / HttpSession / ServletContext / HttpServletRespons
- java中如何实现文件打包上传以及自动解压
- CKEditor3.0在asp.net环境下上传文件的配置,集成CKFinder
- ckeditor+ckfinder 集成 实现上传下载(Image/Flash/File/Other) 有下载连接
- java_struts2实现文件上传
- java中如何实现文件打包上传以及自动解压
- Java程序员从笨鸟到菜鸟之(七十一)细谈struts2(十三)struts2实现文件上传和下载详解
- JavaWeb中struts2实现文件上传下载功能实例解析
- CKEditor3.0在asp.net环境下上传文件的配置,集成CKFinder
- struts2实现word文件上传和在线阅读
- 基于jquery ajax 无刷新 文件批量上传插件 GooUploader整合struts2实现上传