ckeditor编辑器在java项目中配置
一、基本使用：
1、所需文件架包
A. Ckeditor基本文件包，比如：ckeditor_3.6.2.zip
下载地址：http://ckeditor.com/download
2、配置使用
A．将下载下来的CKEditor压缩解压，将解压后的文件夹(“ckeditor”)拷贝进项目里面，比如我是放在”WebContent”的”commons”文件夹下；
B．在需要使用CKEditor的页面引入CKEditor的支持javascript
<head>
<script type="text/javascript" src="/commons/ckeditor/ckeditor.js"></script>
</head>
C．一般我们的内容是使用一个”<textarea>”来显示内容，然后使用调用脚本替换
<textarea id="editor1"name="editor1">Initial value.</textarea>
<script type="text/javascript">CKEDITOR.replace(“editor1”);</script>
D．CKEDITOR.replace(“editor1”)中的”editor1”为id或者是name搜索方式默认是先按id来搜索，没找到再按name来搜索
E．具体的图例
二、Java项目中配置使用：
1、所需文件架包
A．Ckeditor基本文件包，比如：ckeditor_3.6.2.zip
下载地址：http://ckeditor.com/download
B．CKEditor for Java 架包，比如：ckeditor-java-core-3.5.3.jar
下载地址：http://ckeditor.com/download
2、配置使用
A．将下载下来的CKEditor压缩解压，将解压后的文件夹(“ckeditor”)拷贝进项目里面，比如我是放在”WebContent”的”commons”文件夹下；
B．将下载下来的CKEditorfor Java 包(ckeditor-java-core-3.5.3.jar)复制进项目” /WEB-INF/lib”目录；
C．在需要使用CKEditor的jsp页面配置CKEditor的标签，以后使用通过标签使用
<%@ taglib uri="http://ckeditor.com" prefix="ckeditor"%>
D．一般我们的内容是使用一个”<textarea>”来显示内容，然后替换成CKEditor编辑器
<textareaid="id_1"name="id_1">Initial value.</textarea>
<ckeditor:replacereplace="id_1"basePath="/commons/ckeditor/"/>
* replace 只的是textarea 的name或者id
* basePath CKEditor的根目录
三、Java项目中配置使用并支持简单的图片上传功能：
CKEditor在Java项目中配置使用，并支持图片的上传功能。原理是通过showModalDialog来实现的，弊端不支持Chrome浏览器，IE,FireFox支持；
1、所需文件架包
A．Ckeditor基本文件包，比如：ckeditor_3.6.2.zip
下载地址：http://ckeditor.com/download
B．CKEditor for Java 架包，比如：ckeditor-java-core-3.5.3.jar
下载地址：http://ckeditor.com/download
2、配置使用
A．将下载下来的CKEditor压缩解压，将解压后的文件夹(“ckeditor”)拷贝进项目里面，比如我是放在”WebContent”的”commons”文件夹下；
B．将下载下来的CKEditorfor Java 包(ckeditor-java-core-3.5.3.jar)复制进项目” /WEB-INF/lib”目录；
C．在需要使用CKEditor的jsp页面配置CKEditor的标签，以后使用通过标签使用
<%@ taglib uri="http://ckeditor.com" prefix="ckeditor"%>
D．一般我们的内容是使用一个”<textarea>”来显示内容，然后替换成CKEditor编辑器
<textareaid="id_1"name="id_1">Initial value.</textarea>
<ckeditor:replacereplace="id_1"basePath="/commons/ckeditor/"/>
* replace 只的是textarea 的name或者id
* basePath CKEditor的根目录
E．简单快捷的给CKEditor加上图片上传功能
CKEditor非常好用，但它的图片/文件上传使用了CKFinder，虽然功能非常强大，但集成起来还是比较麻烦，而且根据应用还需要改造。如果自己的应用已经有图片/文件上传模块，能否直接拿过来用呢？答案是肯定的，而且非常简单，就是在图片链接输入框的右边加个按钮，点击事件链接到已有的上传模块，上传后把图片的url传递给左边的输入框即可。步骤如下：
打开ckeditor\plugins\image\dialogs\image.js，在链接输入框代码结尾也就是“m.lang.image.urlMissing)},”后面加上这些代码：
“{type:'button',id:'myUpload',align:'center',label:'新上传',onClick:function(){varretFile = showModalDialog("/common/uploadImage.jsp","", "dialogHeight:20;dialogWidth:29;"); if(retFile !=null){this.getDialog().setValueOf('info','txtUrl',retFile);}}},”
“/common/uploadImage.jsp”是应用已经有的上传模块链接，上传成功后通过模式对话框的returnValue返回图片链接，比如在上传成功页面加上如下js函数，点击确定时调用。
function Done() {
window.returnValue = imgPath;//上传后的图片链接
window.close();
}
四、Java项目中配置使用并支持图片上传功能包括FTP上传，图片压缩：
CKEditor在Java项目中配置使用，并支持图片的上传功能。原理是通过commons-fileupload上传组件实现的，这里已经封装好上传处理Servlet只需要在配置文件ckeditor.properties 中配置相关FTP服务器信息，是否压缩图片，上传附件的大小格式限制等。
1、所需文件架包和配置文件
A．Ckeditor基本文件包，比如：ckeditor_3.6.2.zip
下载地址：http://ckeditor.com/download
B．CKEditor for Java 架包，比如：ckeditor-java-core-3.5.3.jar
下载地址：http://ckeditor.com/download
C．Apache的上传组包 commons-fileupload，比如：commons-fileupload-1.2.1.jar
下载地址：http://commons.apache.org/
D．Apache的上传组包 commons-io，比如：commons-io-1.4.jar
下载地址：http://commons.apache.org/
E．Apache的FTP组件包commons-net， 比如：commons-net-ftp-2.0.jar
下载地址：http://commons.apache.org/
F．Apache的工具包 commons-lang，比如：commons-lang-2.5.jar
下载地址：http://commons.apache.org/
G．上传处理组件包 ckeditor-upload-1.0.jar
自己封装的基于Servlet的图片上传处理组件
H．CKEditor的图片上传配置属性文件：ckeditor.properties
I．CKEditor的配置文件 config.js
备注：点击下载以上资源包
2、配置使用
A．将下载下来的CKEditor压缩解压，将解压后的文件夹(“ckeditor”)拷贝进项目里面，比如我是放在”WebContent”的”commons”文件夹下；
B．将下载下来的所需组件架包拷贝进项目” /WEB-INF/lib”目录；
C．将图片上传配置文件ckeditor.properties拷贝到项目SRC(classes)根目录下
属性文件内容如下：
# default allowed extensionssettings
ckeditor.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
# base directory for the userfiles relative to the context root
ckeditor.userFilesPath = /files/ckeditor/
# default encoding
ckeditor.encoding = UTF-8
# default file size threshold: 1*1024*1024 = 1048576
ckeditor.size.threshold = 1048576
# default one file size :5*1024*1024 = 52428800
ckeditor.file.size.max = 52428800
# default all files size :10*1024*1024 = 10485760
ckeditor.size.max = 10485760
# some messages
message.request.not.contain.images= Requestdoes not contain image or media file.
message.request.general.form = Request is thegeneral form.
message.request.file.max = One file is toolarge.
message.request.all.file.max = All files is toolarge.
# ftp configurations
# open ftp file upload istrue otherwise false
ftp.upload = true
ftp.server = 127.0.0.1
ftp.user_name = jjy
ftp.password = 123
ftp.port = 21
# image resize configurations
# open image resize is trueotherwise false
image.resize = true
#resizeByMaxSize:0,resizeByRatio:1,resizeByFixedWidth:2,resizeByFixedHeight:3
image.resize.type = 0
# resize size 100,120,240,400,640
image.resize.size = 120,240,400
D．CKEditor配置文件” /ckeditor/config.js”修改
CKEDITOR.editorConfig = function(config) {
//获取项目的目录比如：http://www.mymyty.com
var strFullPath = window.document.location.href;
var strPath = window.document.location.pathname;
var pos = strFullPath.indexOf(strPath);
var prePath = strFullPath.substring(0,pos);
var postPath =strPath.substring(0,strPath.substr(1).indexOf('/')+1);
var path_url = prePath+postPath;
//显示出图片上传模块
config.pasteFromWordRemoveStyles = true;
config.filebrowserImageUploadUrl = path_url + "/commons/ckeditor/images/upload.html"; //为图片上传处理Servlet在web.xml中配置
// 去掉ckeditor“保存”按钮
config.removePlugins = 'save';
};
E．在web.xml中配置Servlet
<servlet>
<servlet-name>ckeditor</servlet-name>
<servlet-class>com.ebiz.ssi.ckeditor.CkeditorImagesUploadServlet</servlet-class>
<load-on-startup>1</load-on-startup>
</servlet>
<servlet-mapping>
<servlet-name>ckeditor</servlet-name>
<url-pattern>/commons/ckeditor/images/upload.html</url-pattern>
</servlet-mapping>
F．在需要使用CKEditor的jsp页面配置CKEditor的标签，以后使用通过标签使用
<%@ taglib uri="http://ckeditor.com" prefix="ckeditor"%>
G．一般我们的内容是使用一个”<textarea>”来显示内容，然后替换成CKEditor编辑器
<textareaid="id_1"name="id_1">Initial value.</textarea>
<ckeditor:replacereplace="id_1"basePath="/commons/ckeditor/"/>
* replace 只的是textarea 的name或者id
* basePath CKEditor的根目录
五、CKEditor中config.js配置文件的说明即样式自定义调整：
Congfig.js是CKDitor的配置文件，在这个里面可以修改编辑器的样式和所需工具栏等等
config.language= 'zh-cn'; // 编辑器语言
config.width =600; //初始化时的宽度
config.height = 400; //初始化时的高度
config.skin='kama'; //编辑器样式，有三种：’kama’（默认）、’office2003′、’v2′
config.tabSpaces =4;
config.resize_maxWidth =600; //如果设置了编辑器可以拖拽 这是可以移动的最大宽度
config.toolbarCanCollapse =false; //工具栏可以隐藏
//config.toolbarLocation ='bottom'; //可选：设置工具栏在整个编辑器的底部bottom
config.resize_minWidth =600; //如果设置了编辑器可以拖拽 这是可以移动的最小宽度
config.resize_enabled =false; //如果设置了编辑器可以拖拽
//以下是后添加的验证非法数据
config.protectedSource.push(/<\s*iframe[\s\S]*?>/gi); //<iframe>tags.
config.protectedSource.push(/<\s*frameset[\s\S]*?>/gi); // <frameset> tags.
config.protectedSource.push(/<\s*frame[\s\S]*?>/gi); // <frame> tags.
config.protectedSource.push(/<\s*script[\s\S]*?\/script\s*>/gi); // <SCRIPT> tags.
config.baseFloatZIndex = 10000; // 编辑器的z-index值
config.baseHref = “”; //设置是使用绝对目录还是相对目录，为空为相对目录
六、CKEditor精简说明：
下载了完整的程序之后，先要对程序中的不必要的东西进行删除。凡是文件名或文件夹名前面有"_"的文件或文件夹都可以删除，这些文件是一些说明文件或者实例文件。另外，./lang文件夹中，只保留：zh_cn.js，en.js文件即可，这个文件夹是程序的语言包，因为其它语言大家用不到，放在那里也占用空间，所以删掉。./skins文件夹是编辑器的界面，根据情况保留至少一个文件夹即可，其中kama是可自定颜色UI的文件，建议保留，当然如果不在乎空间大小的话，也可以全部上传。删除根目录下的changes.html(更新列表),install.html(安装指向),license.html(使用许可).
ckeditor编辑器在java项目中配置的更多相关文章
- eclipse java项目中明明引入了jar包 为什么项目启动的时候不能找到jar包 项目中已经 引入了 com.branchitech.app 包 ，但时tomcat启动的时候还是报错？ java.lang.ClassNotFoundException: com.branchitech.app.startup.AppStartupContextListener java.lang.ClassN
eclipse java项目中明明引入了jar包 为什么项目启动的时候不能找到jar包 项目中已经 引入了 com.branchitech.app 包 ,但时tomcat启动的时候还是报错?java. ...
- java项目中build path的设置
右键点击项目新建文件libs 添加jtds jar包引用本地动态链接库(dll)的设置方法 配置LibraryJRE的添加和更换 Java项目中build path的设置总结,包括JRE的添加和更 ...
- 在Java项目中整合Scala
Scala是一个运行在Java JVM上的面向对象的语言.它支持函数编程,在语法上比Java更加灵活,同时通过Akka库,Scala支持强大的基于Actor的多线程编程.具有这些优势,使得我最近很想在 ...
- XML在JAVA项目中的作用
java项目中,xml文件一般都是用来存储一些配置信息 一般的编程, 多数用来存储配置信息 . 拿JDBC来说,可以把数据库连接字符串写到xml,如果要修改数据源,只需要改xml就可以了,没必要再去重 ...
- redis在java项目中的使用
在上一篇文章中已经讲了redis的spring配置,这篇将会描述redis在java项目中的使用. redis存储形式都是key-value(键值对),按照存储的内容分为两种,一种是存简单数据,即数字 ...
- Redis学习笔记之二 ：在Java项目中使用Redis
成功配置redis之后,便来学习使用redis.首先了解下redis的数据类型. Redis的数据类型 Redis支持五种数据类型:string(字符串),hash(哈希),list(列表),set( ...
- SuperDiamond在JAVA项目中的三种应用方法实践总结
SuperDiamond在JAVA项目中的三种应用方法实践总结 1.直接读取如下: @Test public static void test_simple(){ PropertiesConfigur ...
- JAVA项目中引用Logback的方法
一.简介 本文主要讲JAVA项目中引入Logback的方法. 二.解决 1.引入依赖. <!--Begin LogBack Log--> <!-- https://mvnreposi ...
- Mac笔记本中是用Idea开发工具在Java项目中调用python脚本遇到的环境变量问题解决
问题描述: mac笔记本本身会自带几个python版本,比如python2.7版本,我没有改动mac默认的python版本,只是安装了python3.7版本. 使用Pycharm开发Python项目没 ...
随机推荐
- javascript的stringFormat函数实现
写一个简单的stringFormat来给自己用 function stringFormat(format, args) { var formatData; if (arguments.length = ...
- WeUI
从WeUI学习到的知识点 WeUI是微信Web服务开发的UI套件, 目前包含12个模块 (Button, Cell, Toast, Dialog, Progress, Msg, Article, ...
- WINDOWS API 函数（超长，值得学习）
一.隐藏和显示光标 函数: int ShowCursor ( BOOL bShow ); 参数 bshow,为布尔型,bShow的值为False时隐藏光标,为True时显示光标:该函数的返回值为整型 ...
- aliyun.com
https://help.aliyun.com/knowledge_detail/39495.html?spm=5176.7839494.2.1.AhdvPM
- 获取ActiveX控件本身所在的路径 和 error PRJ0050
一. CString GetCurPath() { TCHAR exeFullPath[MAX_PATH]; CString strPath; ...
- linux服务器WEB环境一键安装包lanmp教程之五
在我们安装了linux服务器WEB环境一键安装包lanmp后,可能会有不少疑问还有就是使用过程中出现的问题,下面为大家总结几点比较常见的,如若还有其他疑问,可到wdlinux论坛寻找相关教程. 1.增 ...
- linux中的strings命令简介
摘自:http://blog.csdn.net/stpeace/article/details/46641069 linux中的strings命令简介 在linux下搞软件开发的朋友, 几乎没有不知道 ...
- hdu 1978 How many ways（dp）
Problem Description 这是一个简单的生存游戏,你控制一个机器人从一个棋盘的起始点(1,1)走到棋盘的终点(n,m).游戏的规则描述如下: 1.机器人一开始在棋盘的起始点并有起始点所标 ...
- 有关ios中images.xcassets的导入图片等命名问题
最近遇到一个问题,就是在设置启动图片的时候,把启动图片命名设置为了xxx@2x.png, 然后应用死活没有显示启动图片,调试了很久,才发现是因为文件命名的原因. 1. 如果在图片的下方有2x或3x的标 ...
- The Balance(母函数)
The Balance Time Limit: 1000/1000 MS (Java/Others) Memory Limit: 32768/32768 K (Java/Others) Tota ...