Ueditor下载地址:
下载后直接解压缩。我主要实现文件上传和form表单提交数据。
一、配置文件修改
uedit.config.js
var URL = window.UEDITOR_HOME_URL; //主要是本地ueditor文件目录
serverUrl: URL + "jsp/config.jhtml" // 服务器统一请求接口路径
conf.json
"p_w_picpathUrlPrefix": "http://localhost:8080/fetchbaike/ueditor/jsp/upload/", /* 图片访问路径前缀 */
二 、页面修改
tyle type="text/css">
div{
width:100%;
}
欢迎使用UEditor!
//实例化编辑器
//建议使用工厂方法getEditor创建和引用编辑器实例,如果在某个闭包下引用该编辑器,直接调用UE.getEditor('editor')就能拿到相关的实例
var editor_a = UE.getEditor('myEditor',{
initialFrameWidth : 400,
initialFrameHeight: 300});
UE.Editor.prototype._bkGetActionUrl = UE.Editor.prototype.getActionUrl;
UE.Editor.prototype.getActionUrl = function(action) {
if (action == 'uploadp_w_picpath' || action == 'uploadscrawl' || action == 'uploadp_w_picpath'
|| action == 'uploadvideo' || action == 'uploadfile') {
return './ueditor/uploadp_w_picpath.jhtml';
}else {
return this._bkGetActionUrl.call(this, action);
}
}
三、后台操作
@Controller
@RequestMapping(value="/ueditor")
public class UeditorController {
@RequestMapping(value="/jsp/config")
public void config(HttpServletRequest request,HttpServletResponse response,String action) throws Exception {
request.setCharacterEncoding("utf-8");
response.setHeader("Content-Type", "text/html");
String rootPath=request.getSession().getServletContext().getRealPath("/");
//会加载conf.json文件,注意路径问题
response.getWriter().write(new ActionEnter(request,rootPath).exec());
}
@RequestMapping(value="/uploadp_w_picpath")
@ResponseBody
public Map uploadp_w_picpath(@RequestParam("upfile") MultipartFile[] multipartFiles, HttpServletRequest request,HttpServletResponse response) throws Exception {
Map map=new HashMap();
String path=request.getSession().getServletContext().getRealPath("/ueditor/jsp/upload/");
System.out.println("path++"+path);
if(multipartFiles!=null && multipartFiles.length>0){
//循环遍历
for (MultipartFile multipartFile : multipartFiles) {
//原来图片的名称
String OriginalFilename=multipartFile.getOriginalFilename();
//获得图片新名称
String newFileName=getFileNewName(OriginalFilename.substring(OriginalFilename.lastIndexOf(".")));
//创建文件
File targetFile=new File(path,newFileName);
if(!targetFile.exists()){
targetFile.mkdirs();
}
String state="SUCCESS";
try {
multipartFile.transferTo(targetFile);
map.put("original", OriginalFilename);
map.put("name",newFileName);
//注意url会和conf.json中的路径配合找到图片
map.put("url", newFileName);
map.put("state", "SUCCESS");
} catch (Exception e) {
state="FAIL";
}
}
}
return map;
}