admin 管理员组

文章数量: 1086019


2024年3月19日发(作者：mece中的e什么意思)

第１０Ｒ第２期　Ｖｏ１．１ＯＮＯ．２　

Ｆｅｂ．２Ｏｌ１　

基于Ｊａｖａ　Ｗｅｂ的ＨＴＭ　Ｌ在线文本　

编辑器解决方案　

以ＦｃｋＥｄｉｔｏｒ在线编辑器为例　

于梅英，姜　波，张珂　

（兰州大学网络教育学院，甘肃兰州７３００００）　

摘　要：ＦｃｋＥｄｉｔｏｒ作为众多优秀ＨＴＭＬ在线文本编辑器之一，以其支持多语言的优势而受到众多国内外开发者的　

亲睐。在Ｊａｖａ　Ｗｅｂ开发中使用ＦＣＫｅｄｉｔｏｒ可以实现类似微软Ｗｏｒｄ桌面文本编辑器的许多强大功能，因此掌握　

ＦｃｋＥｄｉｔｏｒ在Ｊａｖａ　Ｗｅｂ开发环境下的配置过程也是开发者必备的技能之一。　

关键词：Ｊｓｐ；ＦｅｋＥｄｉｔｏｒ；ＨＴＭＩ　；在线文本编辑器　

中图分类号：ＴＰ３１２　文献标识码：Ａ　文章编号：１６７２—７８００（２０１１）０２—００３６—０２　

ｊａｖａ—ｄｅｍｏ一２．６；　

１基于Ｊａｖａ　Ｗｅｂ的ＨＴＭＬ在线编辑器存在的　

问题　

目前国内外ＨＴＭＬ在线编辑器的版本有很多种，开源　

３．２　ＦｃｋＥｄｉｔｏｒ在Ｊａｖａ　Ｗｅｂ中的基本配置　

（１）在ＭｙＥｘｃｌｉｐｓｅ文件下建设Ｊａｖａ　Ｗｅｂ项目ＦｃｋＥｄ—　

ｉｔｏｒ。　

（２）解压ＦｃｋＥｄｉｔｏｒ一２．６．６．ｚｉｐ文件，将解压后的根目　

的ＨＴＭＬ在线编辑器也是千差万别，其中大多数都支持常　

用的ｗｅｂ开发语言，如ＡＳＰ、ＰＨＰ、．ＮＥＴ等语言。然而，随　

着Ｊｓｐ技术的成熟和发展，一部分不支持Ｊｓｐ编辑器已不能　

录下的ＦｃｋＥｄｉｔｏｒ文件夹拷贝到ＳＳＨ框架项目下的　

ＷｅｂＲｏｏｔ目录里；　

（３）将下载ＦｃｋＥｄｉｔｏｒ—ｊａｖａ—ｄｅｍｏ一２．６文件解压后，把　

满足开发者需求，只有少数的开源在线编辑器支持Ｊｓｐ技　

术，但多数框架配置过程复杂、文件上传下载的效率低下。　

根目录下Ｗｅｂ—ＩＮＦ中的１．ｂ里５个．ｊａｒ文件：ｃｏｍｍｏｎｓ—　

ｆｉｌｅｕｐｌｏａｄ一１．２．１．ｊａｒ、ｃｏｍｍｏｎｓ—ｉｏ一１．３．２．ｊａｒ、ＦｅｋＥｄｉｔｏｒ—ｊａ—　

ｖａ　ｃｏｒｅ一２．４．ｊａｒ、ｓｌｆ４ｊ—ａｐｉ　１．５．２．ｊａｒ及ｓｌｆ４ｊ—ｓｉｍｐｌｅ－１．５．２．　

２基于Ｊａｖａ　Ｗｅｂ的ＨＴＭＬ在线编辑器解决方案　

著名的开源网页编辑软件ＦＣＫＥｄｉｔｏｒ在Ｏ９年发布至　

现在已经更新到３．０版本，ＦｃｋＥｄｉｔｏｒ由于其资源轻量化、　

配置简单、免费开源、文本编辑功能齐全、支持多浏览器、　

支持ＰＨＰ、ＪａｖａＳｃｒｉｐｔ、ＡＳＰ、ＡＳＰ．ＮＥＴ、ＣｏｌｄＦｕｓｉｏｎ、Ｊａｖａ、　

ｊａｒ拷贝到ＳＳＨ框架项目下的Ｗｅｂ—ＩＮＦ目录中的ｌ　目录　

里。　

（４）将ＦｃｋＥｄｉｔｏｒ—ｊａｖａ—ｄｅｍｏ一２．６文件下的ＷｅｂＲｏｏｔ　

目录下的ｉｎｄｅｘ．ｊｓｐ文件和ｓｈｏｗｄａｔａ．ｊｓｐ拷贝到ＳＳＨ框　

架项目下的ＷｅｂＲｏｏｔ目录下。以上４步完成后的ＳＳＨ　

框架项目如图１所示。　

以及ＡＢＡＰ等不同的编程语言的强大优势，受到众多开　

发者亲睐。目前，众多的Ｊａｖａ　Ｗｅｂ项目中ＦｃｋＥｄｉｔｏｒ成为　

开发者对在线编辑器的首选，为网络文本交互提供文本样　

上传文件或附件的路径及存放文件的文件夹名，可根　

据项目需要自行设定　

３．３实现文本样式编辑、图片上传和附件上传下载　

式编辑、图片上传下载和附件上传下载的功能。　

（１）在ＳＳＨ框架项目的ｓｒｃ目录下新建文件ＦｃｋＥｄｉ—　

ｔｏｒ．ｐｒｏｐｅｒｔｉｅｓ，并添加如下内容：　，　

３　ＦｃｋＥｄｉｔｏｒ编辑器在Ｊａｖａ　Ｗｅｂ开发中的配置　

３．１　开发环境和ＦｃｋＥｄｉｔｏｒ配置文件　

／／ＦｃｋＥｄｉｔｏｒ的基本设置　

ｃｏｎｎｅｃｔｏｒ．ｕｓｅｒＦｉｌｅｓＰａｔｈ＝／ＵｐＦｉｌｅｓ　

ｃｏｎｎｅｃｔｏｒ．ｕｓｅｒＡｃｔｉｏｎｌｍｐｌ—ｎｅｔ．ＦｃｋＥｄｉｔｏｒ．ｒｅｑｕｅｓｔ—　

ｃｙｃｌｅ．ｉｍｐ１．ＵｓｅｒＡｃｔｉｏｎｌｍｐｌ　

（１）开发环境：ＭｙＥｃｌｉｐｓｅ７．５，ＪＤＫ１．６，ｔｏｍｃａｔ６．０；　

（２）ＦｅｋＥｄｉｔｏｒ配置文件：ＦｃｋＥｄｉｔｏｒ２．６．６，ＦｃｋＥｄｉｔｏｒ　

／／上传下载文件的业务处理类，一般无需修改，按默　

作者简介：于海英（１９８０　），女，甘肃嘉峪关人，硕士，兰州大学网络教育学院技术支撑中心主任、工程师，研究方向为软件工程；姜波　

（１９８５一），女，山东龙口人，兰州大学网络教育学院职员，研究方向为软件工程；张珂（１９８４一），女，甘肃兰州人，兰州大学网　

络教育学院助理工程师，研究方向为软件工程。　

第２期　于梅英，姜波，张珂：基于Ｊａｖａ　ｗｅｂ的ＨＴＭＬ在线文本编辑器解决方案　．３７．　

认方式处理　

ｃｏｎｎｅｃｔｏｒ．ｒｅｓｏｕｒｃｅＴｙｐｅ．ｆｉｌｅ．ｅｘｔｅｎｓｉｏｎｓ．ａｌｌｏｗｅｄ一【　

＜ｕｒｌ—ｐａｔｔｅｒｎ＞／ＦｃｋＥｄｉｔｏｒ／ｅｄｉｔｏｒ／ｆｉｌｅｍａｎａｇｅｒ／ｃｏｎｎｅｃ—　

ｔｏｒｓ／＊＜／ｕｒｌ—ｐａｔｔｅｒｎ￣　

＜／ｓｅｒｖｌｅｔ—ｍａｐｐｉｎｇ￣　

ｊｐｇｊ　ｇｉｆｌ　ｐｎｇｆ　ｒａｒｆ　ｚｉｐｌ　ｔｘｔｆ　ｄｏｃｆ　ｗｍａｌ　ｗｍｖｆ　ｍｐ３　ｆ　ｆｌｖＩ　ｓｗｆｉ　ｘｌｓ　

／／上传附件文件的类型限制，可根据项目需要自行删　

增　

ｃｏｎｎｅｃｔｏｒ．ｒｅｓｏｕｒｃｅＴｙｐｅ．ｍｅｄｉａ．ｅｘｔｅｎｓｉｏｎｓ．ａｌｌｏｗｅｄ—　

１ｗｍａｌｗｍｖｆｍｐ３ｌｆｌｙｊ　ｓｗｆｌ　

／／上传媒体文件的类型限制，可根据项目需要自行删　

增　

ｃｏｎｎｅｃｔｏｒ．ｒｅｓｏｕｒｅｅＴｙｐｅ．ｉｍａｇｅ．ｅｘｔｅｎｓｉｏｎｓ．ａｌｌｏｗｅｄ—　

ｌｊｐｇ　Ｊ　ｐｎｇ　ｇｉｆｌ／／允许上传的图片文件类型，可根据项目需　

要自行删增　

ｃｏｎｎｅｃｔｏｒ．ｒｅｓｏｕｒｃｅＴｙｐｅ．ｆｌａｓｈ．ｅｘｔｅｎｓｉｏｎｓ．ａｌｌｏｗｅｄ￣Ｉ　

ｓｗｆ　　Ｊ

／／允许上传的媒体文件类型，可根据项目需要自行删　

增　

ＦｃｋＥｄｉｔｏｒ．ｂａｓｅＰａｔｈ一／ＦｃｋＥｄｉｔｏｒ　

／／ＦｃｋＥｄｉｔｏｒ的配置文件存放路径，此处要和项目中　

实际存放的路径保持一致　

添加完成后保存。　

（２）根据第１步的配置文件要求，在ＳＳＨ项目的　

ＷｅｂＲｏｏｔ目录下新建文件夹ＵｐＦｉｌｅｓ，在ＵｐＦｉｌｅｓ根目录　

先新建４个文件夹一次命名为ｉｍａｇｅ、ｆｉｌｅｓ、ｆｌａｓｈ、ｍｅｄｉａ，　

用来分类存放上传的附件。完成以上两个步骤后效果如　

图２所示。　

・　ｆｃｋ　“ｔｏｔ　

捧ｓｒ　

蒜　￡ｓ郫、　＿Ｌ　ｒ　ｙ。　一　。ｔ　

蒜　・Ｅ量ｓ　Ｌｉｈ…§　

．１　

ｆｃｋｅｌｉｔ　ｒ　

｝　■ｎ＾　Ｉ船　

密俏ｓ　抨　

，ｉⅡｄ・ｘｊ　ｓ，　

ｓｈ　ｄ　ｔ　Ｊ‘　

图１　ＳＳＨ框架项目　图２效果　

（３）修改ｉｎｄｅｘ．ｊｓｐ文件中的ｓｃｒｉｐｔ脚本，在里面添加　

如下内容，并且设置ＦｃｋＥｄｉｔｏｒ的框架大小，可根据需要　

自行设定。　

ｏＦｃｋＥｄｉｔｏｒ．Ｈｅｉｇｈｔ＝　４００　；　

ｏＦｃｋＥｄｉｔｏｒ．Ｗｉｄｔｈ一　８００　；　

（４）在ＳＳＨ项目下Ｗｅｂ—ＩＮＦ目录的Ｗｅｂ．ｘｍｌ文件　

中配置一下内容，启动上传、下载业务处理类，以及文件上　

传所需的配置文件路径。　

＜ｓｅｒｖｌｅｔ＞　

＜ｓｅｒｖｌｅｔ—ｎａｍｅ＞Ｃｏｎｎｅｃｔｏｒ￣／ｓｅｒｖｌｅｔ—ｎａｍｅ＞　

＜ｓｅｒｖｌｅｔ—ｃｌａｓｓ＞ｎｅｔ．ＦｃｋＥｄｉｔｏｒ．ｃｏｎｎｅｃｔｏｒ．Ｃｏｎｎｅｃ—　

ｔｏｒＳｅｒｖｌｅｔ％｝ｓｅｒｖｌｅｔ—ｃｌａｓｓ＞　

＜ｌｏａｄ—ｏｎ—ｓｔａｒｔｕｐ＞１％／ｌｏａｄ—ｏｎ—ｓ　Ｌａｒｔｕｐ￣　

＜／ｓｅｒｖｌｅｔ＞　

￣ｓｅｒｖｌｅｔ—ｍａｐｐｉｎｇ￣　

＜ｓｅｒｖｌｅｔ—ｎａｍｅ￣Ｃｏｎｎｅｃｔｏｒ￣／ｓｅｒｖｌｅｔ—ｎａｍｅ￣＞　

（５）以上配置全部完成后，将ＳＳＨ项目ＦｃｋＥｄｉｔｏｒ部　

署在ｔｏｍｃａｔ服务器下，启动ｔｏｍｃａｔ服务器，在浏览器地址　

输入ｈｔｔｐ：／／ｌｏｃａｌｈｏｓｔ：８Ｏ８０／ＦｃｋＥｄｉｔｏｒ　ｉｎｄｅｘ．ｊｓｐ，上传图　

片附件，效果如图３所示　

（６）上传完成后效果如图４所示。　

０　ｌ　ｉ？一　、０　

；　簸ｇ　勰　

一　

｜耋》棼　

图３上传图片附件效果　圈４上传完成后的效果　

３．４配置问题解决补充　

墨　

（１）以上配置完成后，ＦｃｋＥｄｉｔｏｒ和Ｊａｖａ　Ｗｅｂ环境下　

ＪＳＰ页面便完成了基本兼容。之后，还可以根据开发者个　

人喜好在ＦｃｋＥｄｉｔｏｒ．ｐｒｏｐｅｒｔｉｅｓ文件中添加删除配置，也　

可以对ｆｃｋｅｄｉｔｒｏ目录下的ｅｄｉｔｏｒ文件目录中的ｆｃｋｃｏｎｆｉｇ．　

ｊＳ文件做配置和修改。其中的具体属性可以参考ＦｃｋＥｄｉ—　

ｔｏｒ官方网站提供的参考文档。　

（２）为了精简项目可以将ｆｃｋｅｄｉｔｒｏ目录下的ｅｄｉｔｏｒ文　

件目录中关于ＰＨＰ、ＡＳＰ的配置文件删除。只保留ｆｃｋ—　

ｃｏｎｆｉｇ．ｊＳ、ＦｃｋＥｄｉｔｏｒ．ｊＳ、ｆｃｋｐａｃｋａｇｅｒ．ｘｍｌ、ｆｃｋｓｔｙｌｅｓ．ｘｍｌ、　

ｆｃｋｔｅｍｐｌａｔｅｓ．ｘｍｌ５个文件即可，还可以将ｆｃｋｅｄｉｔｒｏ目录　

下的

ｓａｍｐｌｅｓ文件夹删除，至此得到精简版的ＦｃｋＥｄｉｔｏｒ。　

（３）ＦｃｋＥｄｉｔｏｒ在配置过程中若遇到中文乱码的问题，　

主要是与项目有关，所以建议使用者在编码设置和页面设　

置时采用统一的编码格式，就能很好地避免这类问题。　

４　结束语　

本文所做的ＦｃｋＥｄｉｔｏｒ在Ｊａｖａ　ｗｅｂ环境下的配置解　

决方案，能够很好解决ＦｃｋＥｄｉｔｏｒ和Ｊａｖａ　Ｗｅｂ项目之间的　

兼容和配套使用问题，简单快捷地完成配置过程。利用　

ＦｃｋＥｄｉｔｏｒ编辑器提供的强大编辑功能，能让用户方便地　

对编辑的内容进行修改和排版，可以更加方便地上传图　

片、文档、动画文件等，并将其轻松加载到网页内容中，也　

可以通过插入信息组件与其他网页内容进行整合，使得网　

页效果更加个性化、美观化。　

参考文献　

［１］刘颖．ＦＣＫｅｄｉｔｏｒ在Ｗｅｂ开发中的应用［Ｊ］．电脑开发与应用，２００９　

（２）．　

［２］　蒙祖强，龚涛．Ｊｓｐ程序员成长攻略［Ｍ］．北京：中国水电水利出版　

社．２００８．　

（责任编辑：周晓辉）　


本文标签： 配置 上传 文件 项目

版权声明：本文标题：基于Java Web的HTML在线文本编辑器解决方案——以FckEditor在线编辑器 内容由网友自发贡献，该文观点仅代表作者本人， 转载请联系作者并注明出处：http://www.roclinux.cn/p/1710823340a574908.html， 本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，一经查实，本站将立刻删除。