ueditor

项目中有文字编辑的需求,选取百度开源富文本控件ueditor作为编辑器。

1.官方下载地址

http://ueditor.baidu.com/website/download.html

ueditor_第1张图片

2.整合到项目中



3.重写配置文件的读取方式

package com.saidian.ueditor.hander;

import java.io.FileInputStream;
import java.io.IOException;
import java.io.OutputStream;
import java.io.PrintWriter;
import java.util.HashMap;
import java.util.Map;
import java.util.UUID;

import javax.servlet.ServletException;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

import org.apache.commons.io.IOUtils;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestMethod;
import org.springframework.web.bind.annotation.ResponseBody;
import org.springframework.web.multipart.MultipartFile;

import com.saidian.ueditor.ActionEnter;
import com.saidian.utils.UploadUtils;


@Controller
@RequestMapping(value = "/uEditor")
public class UeditorUploadHandler {

	private String configDir = "plugs/ueditor/config.json";
	
	/**
	 * 自带controller.jsp中读取配置文件的写法,已被ueditorConfig重写
	 * @param request
	 * @param response
	 * @throws ServletException
	 * @throws IOException
	 */
	@Deprecated
	@RequestMapping(value = "/getUEditorConfig")
	public void getUEditorConfig(HttpServletRequest request,
			HttpServletResponse response) throws ServletException, IOException {
		// 这里就是把controller.jsp代码copy下来
		request.setCharacterEncoding( "utf-8" );
		response.setHeader("Content-Type" , "text/html");
		response.setContentType("application/json");
		String rootPath = request.getSession().getServletContext().getRealPath("/");

		try {
			String exec = new ActionEnter(request, rootPath).exec();
			PrintWriter writer = response.getWriter();
			writer.write(exec);
			writer.flush();
			writer.close();
		} catch (IOException e) {
			e.printStackTrace();
		}

	}

	/**
	 * 重写ueditor自带的controller.jsp,读取config.json
	 * @param request
	 * @param response
	 * @throws IOException
	 */
	@RequestMapping(value = "/ueditorConfig", method = RequestMethod.GET)    
    @ResponseBody    
    public void upload(HttpServletRequest request, HttpServletResponse response) throws IOException {    
		String action = request.getParameter("action");
        if ("config".equals(action)) {  
            OutputStream os = response.getOutputStream();
            String configPath = request.getSession().getServletContext().getRealPath(configDir);
            IOUtils.copy(new FileInputStream(configPath), os);    
        }  
    }  
      
	/**
	 * 文件上传
	 * state 传状态SUCCESS 一定要大写
	 * url 上传地址
	 * title 图片名称
	 * original 图片名称
	 */
	@ResponseBody
	@RequestMapping(value = "/uploadFile", method = RequestMethod.POST)
	public Map uploadFile(MultipartFile upfile) {
		String fileName = upfile.getOriginalFilename();
		String newFileName = UUID.randomUUID().toString() + fileName;
		String relaPath = null;
		//这里返回编辑器需要的格式
		Map map = new HashMap();
		try {
			relaPath = UploadUtils.uploadFile(upfile.getBytes(), fileName);
			map.put("state", "SUCCESS");
		} catch (IOException e) {
			map.put("state", "FAIL");
			e.printStackTrace();
		}
		map.put("original", newFileName);
		map.put("title", fileName);
		map.put("url", relaPath);
		return map;
	}
	
}


4.图片上传,重写其action请求

UE.getEditor('editor');
UE.Editor.prototype._bkGetActionUrl = UE.Editor.prototype.getActionUrl;
UE.Editor.prototype.getActionUrl = function(action) {
    if (action == 'uploadimage' || action == 'uploadscrawl' || action == 'uploadimage'
            || action == 'uploadvideo' || action == 'uploadfile') {
    	return '<%=basePath%>uEditor/uploadFile';
    }else {
        return this._bkGetActionUrl.call(this, action);
    }
}




你可能感兴趣的:(ueditor)