ueditor:百度富文本编辑器,地址:ueditor.baidu.com
版本选择,之所以选择1.4.3,是因为ueditor 1.4.2才修复在bootstrap环境下图片拖拽异常,看到1.4.3也修复了不少的bug,没敢使用1.4.2,稍微看了下源码,1.4.3里面很多todo注释,ueditor一直在改进,不太成熟,既然这么多bug,为什么要选ueditor做富文本编辑?简单也是个有点
配置使用:
1,需导入jar包(当然一般项目commons都有)
2,ueditor.config.js
该文件定义了ueditor的请求入口和toolbar功能,这个文件对使用来说可以不用修改,想删除不用的功能的话,修改数组即可
3,ueditor.all.js
ueditor通过getActionUrl获取路径,修改这个方法配置图片上传路径
其中getServerName是获取上下文路径的js,自行修正路径
action有
uploadimage://执行上传图片或截图的action名称
uploadscrawl://执行上传涂鸦的action名称
uploadvideo://执行上传视频的action名称
uploadfile://controller里,执行上传视频的action名称
catchimage://执行抓取远程图片的action名称
listimage://执行列出图片的action名称
listfile://执行列出文件的action名称
具体参见百度文档:http://fex.baidu.com/ueditor/#qa-customurl
4,congroller.jsp
ueditor请求入口,需要的话,应该可以修改成springmvc 控制器,未测试
5,图片上传Controller
public String ueditImageUpload(@RequestParam(value = "upfile", required = false) MultipartFile upfile) {
// 上传图片
//返回数据
}
注:返回数据为json串,内容如下:
public class UploaderParam {
private String name; //通过upfile获取
private String originalName; //通过upfile获取
private Long size; //通过upfile获取
private String state;//成功必须为"SUCCESS"
private String type; //通过upfile获取
private String url; //图片回显url
自行拼凑json
6,config.json
项目中图片保存在一个静态资源服务器,所以这里设置空前缀,自行修改
7,一切就绪部署上,即可