百度富文本ueditor使用 以及 与 Struts2 整合时出现的问题解决
来源:互联网 发布:临淄广电网络客服电话 编辑:程序博客网 时间:2024/04/28 15:40
1.HTML 环境搭建
百度富文本下载地址
http://ueditor.baidu.com/website/download.html
解压完成之后的目录(没有demo.html)
根据官方文档说明可以创建一个demo.html
也可以直接修改index.html 来进行开发
创建一个富文本框的最简代码为
<!-- 加载编辑器的容器 --> <script id="container" name="content" type="text/plain"> 这里写你的初始化内容 </script> <!-- 配置文件 --> <script type="text/javascript" src="ueditor.config.js"></script> <!-- 编辑器源码文件 --> <script type="text/javascript" src="ueditor.all.js"></script> <!-- 实例化编辑器 --> <script type="text/javascript"> var ue = UE.getEditor('container'); </script>
放在网页中即可显示
二。jsp环境搭建
上面说的都是html 的
现在来说说 在jsp项目中的使用。
将下载的文件放在wen项目的 webRoot 下
(这时候使用富文本框的时候要注意一下js文件的引用路径)
注意:
jsp文件夹下面有一个lib包,里面存放了需要用到的jar包
将这些jar包放置在WEB-INF/lib的目录下
如果使用maven 管理项目的话,因为maven远程仓库跟本地仓库都是没有 ueditor 的jar的,所以需要手动配置添加到本地仓库
三。与Struts2 整合,
经过上面的步骤,我相信大家一定已经成功将富文本框显示出来了。
效果是这样的
但是如果有人的项目中使用了Struts来封装 servlet 一定就发现了一些问题
没错 图片附件之类的没法上传
找不到文件的数据
这是因为 Struts2中有实现好的文件上传功能,拦截器会拦截文件上传的请求然后使用默认的文件上传功能。这样ueditor的文件上传就没法接收到请求,接收不到文件的数据
解决方法:在Struts.xml中添加配置项,屏蔽到对ueditor请求的拦截
<constant name="struts.action.excludePattern" value="/ueditor/.*" />
value里面放置的是文件路径
,重启项目之后文件可以上传成功了,但是立刻又发现文件无法正常的在富文本框中显示出来。
点击左上角的html可以直接看到源码,会发现文件的路径不对。
这是因为在config.json 下面系统有一个默认路径
* 前后端通信相关的配置,注释只允许使用多行方式 */{ /* 上传图片配置项 */ "imageActionName": "uploadimage", /* 执行上传图片的action名称 */ "imageFieldName": "upfile", /* 提交的图片表单名称 */ "imageMaxSize": 2048000, /* 上传大小限制,单位B */ "imageAllowFiles": [".png", ".jpg", ".jpeg", ".gif", ".bmp"], /* 上传图片格式显示 */ "imageCompressEnable": true, /* 是否压缩图片,默认是true */ "imageCompressBorder": 1600, /* 图片压缩最长边限制 */ "imageInsertAlign": "none", /* 插入的图片浮动方式 */ "imageUrlPrefix": "", /* 图片访问路径前缀 */ "imagePathFormat": "/ueditor/jsp/upload/image/{yyyy}{mm}{dd}/{time}{rand:6}", /* 上传保存路径,可以自定义保存路径和文件名格式 */ /* {filename} 会替换成原文件名,配置这项需要注意中文乱码问题 */ /* {rand:6} 会替换成随机数,后面的数字是随机数的位数 */ /* {time} 会替换成时间戳 */ /* {yyyy} 会替换成四位年份 */ /* {yy} 会替换成两位年份 */ /* {mm} 会替换成两位月份 */ /* {dd} 会替换成两位日期 */ /* {hh} 会替换成两位小时 */ /* {ii} 会替换成两位分钟 */ /* {ss} 会替换成两位秒 */ /* 非法字符 \ : * ? " < > | */ /* 具请体看线上文档: fex.baidu.com/ueditor/#use-format_upload_filename */
重点关注 imageUrlPrefix 和 imagePathFormat
imageUrlPrefix 中配置项目名
imagePathFormat 中配置文件需要保存的路径
修改如下:
/* 上传图片配置项 */ "imageActionName": "uploadimage", /* 执行上传图片的action名称 */ "imageFieldName": "upfile", /* 提交的图片表单名称 */ "imageMaxSize": 2048000, /* 上传大小限制,单位B */ "imageAllowFiles": [".png", ".jpg", ".jpeg", ".gif", ".bmp"], /* 上传图片格式显示 */ "imageCompressEnable": true, /* 是否压缩图片,默认是true */ "imageCompressBorder": 1600, /* 图片压缩最长边限制 */ "imageInsertAlign": "none", /* 插入的图片浮动方式 */ "imageUrlPrefix": "/newschange/", /* 图片访问路径前缀 */ "imagePathFormat": "/ueditor/images/{yyyy}{mm}{dd}/{time}{rand:6}", /* 上传保存路径,可以自定义保存路径和文件名格式 */ /* {filename} 会替换成原文件名,配置这项需要注意中文乱码问题 */ /* {rand:6} 会替换成随机数,后面的数字是随机数的位数 */ /* {time} 会替换成时间戳 */ /* {yyyy} 会替换成四位年份 */ /* {yy} 会替换成两位年份 */ /* {mm} 会替换成两位月份 */ /* {dd} 会替换成两位日期 */ /* {hh} 会替换成两位小时 */ /* {ii} 会替换成两位分钟 */ /* {ss} 会替换成两位秒 */ /* 非法字符 \ : * ? " < > | */ /* 具请体看线上文档: fex.baidu.com/ueditor/#use-format_upload_filename */
之后在运行测试,发现真正的成功了。
阅读全文
0 0
- 百度富文本ueditor使用 以及 与 Struts2 整合时出现的问题解决
- 百度富文本编辑器Ueditor的使用
- 百度Ueditor富文本编辑器的使用
- 百度富文本ueditor的使用
- UEditor | 百度富文本使用
- 百度ueditor富文本编辑器使用 以及去除自动保存
- 百度的UEditor富文本控件的使用
- 关于使用百度UEditor富文本编辑器的总结
- 百度富文本编辑器UEditor的使用总结
- 使用百度富文本编辑器UEditor碰到的问题
- 使用百度富文本编辑器UEditor碰到的问题
- Ueditor富文本编辑器在JSP中的使用及与struts2结合的使用
- 百度UEditor富文本
- 百度富文本编辑器ueditor使用总结
- 百度富文本编辑器ueditor使用
- 百度富文本编辑器ueditor使用总结
- 百度富文本编辑器ueditor使用小结
- SSM整合百度富文本编辑器ueditor二
- 程序调试中的常见问题及解决方法
- OpenCV2编程手册笔记之 4.5反投影直方图以检测特定图像内容
- Java 加解密技术系列之 BASE64
- Servlet是线程安全的吗?
- C/C++ 调用 Lua 函数(非全局函数)
- 百度富文本ueditor使用 以及 与 Struts2 整合时出现的问题解决
- 存储过程中使用事务与try catch
- Java 加解密技术系列之 MD5
- 网站或者软件开发流程是什么样子呢?
- atitit 板块分类 上市公司 龙头企业公司 列表 attilax总结.docx
- matlab invalid mex-file caffe_.mexw64
- 算法学习:二叉树的列表实现
- Lua 脚本调用 C 函数
- python 中std()函数的对矩阵的过程解释(老司机越过)