百度编辑器ueditor1.4.2-更改图片上传路径和图片读取路径

/**
 * ueditor相关的Controller
 * 
 * @author zsj
 */

@Controller
public class UeditorController {

	protected final Logger logger = LoggerFactory.getLogger(getClass());
	 

	@RequestMapping(value = { "/ueditor/config" }, method = {
			RequestMethod.POST, RequestMethod.GET })
	@ResponseBody
	public Object ueditorConfig(
			@RequestParam(value = "action", required = false) String action,
			HttpServletRequest request, HttpServletRequest response)
			throws Exception {
		logger.info("百度编辑器action=[{}]", action);
		if ("config".equals(action)) {
			UeditorConfigBean ucb = new UeditorConfigBean();
			return ucb;
		} else if ("/ueditor/uploadImg".equals(action)) {// 图片上传
			return uploadImg(((MultipartHttpServletRequest) request)
					.getFile("upfile"));
		}
		return action;
	}

	 

	/**
	 * 图片上传
	 * 
	 * @return
	 * @throws Exception
	 */
	public Object uploadImg(MultipartFile upfile) throws Exception {

		String orgName = upfile.getOriginalFilename(), houzui = orgName
				.substring(orgName.lastIndexOf("."), orgName.length()), fileName = DateUtil
				.format(new Date(), "yyyyMMddHHmmss"), contentType = upfile
				.getContentType(), imgName = fileName + houzui;
		String imgPath = CommonDef.FS_ROOT + "annex/baidueditor/" + imgName;
		logger.info("百度编辑器上传图片orgName=[{}],contentType=[{}],imgPath=[{}]",
				orgName, contentType, imgPath);
		FileUtils.writeByteArrayToFile(new File(imgPath), upfile.getBytes());
		String imgUrl = "ueditor/readImg/" + fileName + "/"
				+ houzui.replace(".", "");
		logger.info("imgUrl=[{}]", imgUrl);
		return "{'url':'" + imgUrl + "','state':'SUCCESS'}";
	}

	/**
	 * 读取图片
	 * 
	 * @return
	 * @throws Exception
	 */
	@RequestMapping(value = { "/ueditor/readImg/{imgName}/{houzui}" }, method = {
			RequestMethod.POST, RequestMethod.GET })
	public void readImg(@PathVariable("imgName") String imgName,
			@PathVariable("houzui") String houzui, HttpServletResponse response)
			throws Exception {
		logger.debug("读取百度编辑器的图片imgName=[{}]", imgName);
		response.setContentType("image/*");
		String ctxPath = CommonDef.FS_ROOT + "annex/baidueditor/" + imgName
				+ "." + houzui;
		File image = new File(ctxPath);
		if (!image.exists()) {
			response.getWriter().append("");
			return;
		}
		response.getOutputStream().write(FileUtils.readFileToByteArray(image));
		response.getOutputStream().flush();
		response.getOutputStream().close();
	}

	 

}

/***
 * <pre>
 * 	1. 上传图片配置项
 * 
 *     imageActionName {String} [默认值："uploadimage"] //执行上传图片的action名称,
 *     imageFieldName {String} [默认值："upfile"] //提交的图片表单名称
 *     imageMaxSize {Number} [默认值：2048000] //上传大小限制，单位B
 *     imageAllowFiles {String} , //上传图片格式显示
 * 
 *     //默认值：
 *     [".png", ".jpg", ".jpeg", ".gif", ".bmp"]
 * 
 *     imageCompressEnable {Boolean} [默认值：true] //是否压缩图片,默认是true
 *     imageCompressBorder {Number} [默认值：1600] //图片压缩最长边限制
 *     imageInsertAlign {String} [默认值："none"] //插入的图片浮动方式
 *     imageUrlPrefix {String} [默认值：""] //图片访问路径前缀
 *     imagePathFormat {String} [默认值："/ueditor/php/upload/image/{yyyy}{mm}{dd}/{time}{rand:6}"] //上传保存路径,可以自定义保存路径和文件名格式，上传路径配置
 * </pre>
 * 
 * <pre>
 * 附件上传：filePathFormat、fileUrlPrefix
 * 视频上传：videoPathFormat、videoUrlPrefix
 * </pre>
 */
class UeditorConfigBean {

	/**
	 * <pre>
	 * 通过在 php/config.json 文件，配置 imageUrlPrefix 可以给返回的路径添加指定的前缀。
	 * 
	 * 编辑器和图片地址同域的情况下，可以直接使用后台返回的路径，不需要额外配置前缀 假如编辑器和图片不在一个域名下，需要给返回路径添加域名前缀，可以设置
	 * imageUrlPrefix 配置项为 "http://img.domain"，这时插入编辑器的图片会是这样：
	 * 
	 * "http://img.domain/ueditor/php/upload/2014/06/06/123.jpg" 
	 * [默认值：""]图片访问路径前缀
	 * </pre>
	 */
	private String imageUrlPrefix = CommonDef.WEBSITE_URL;

	/**
	 * <pre>
	 * 	[默认值："uploadimage"] //执行上传图片的action名称,
	 * </pre>
	 */
	private String imageActionName = "/ueditor/uploadImg";
	private String fileUrlPrefix = CommonDef.WEBSITE_URL;
	private String videoUrlPrefix = CommonDef.WEBSITE_URL;
	@Deprecated
	private String imagePathFormat = "/ueditor/image/{yyyy}{mm}{dd}/{time}{rand:6}";
	@Deprecated
	private String filePathFormat = "/ueditor/file/{yyyy}{mm}{dd}/{time}{rand:6}";
	@Deprecated
	private String videoPathFormat = "/ueditor/video/{yyyy}{mm}{dd}/{time}{rand:6}";
	/**
	 * imageFieldName {String} [默认值："upfile"] //提交的图片表单名称
	 */
	private String imageFieldName = "upfile";
	private String[] imageAllowFiles = { ".png", ".jpg", ".jpeg", ".gif",
			".bmp" };
	private String[] fileAllowFiles = { ".doc", ".docx", ".txt", ".pdf",
			".xlsx", ".xls", ".png", ".jpg", ".jpeg", ".gif", ".bmp" };

	public String getImageUrlPrefix() {
		return imageUrlPrefix;
	}

	public void setImageUrlPrefix(String imageUrlPrefix) {
		this.imageUrlPrefix = imageUrlPrefix;
	}

	public String getImageActionName() {
		return imageActionName;
	}

	public void setImageActionName(String imageActionName) {
		this.imageActionName = imageActionName;
	}

	public String getImagePathFormat() {
		return imagePathFormat;
	}

	public void setImagePathFormat(String imagePathFormat) {
		this.imagePathFormat = imagePathFormat;
	}

	public String getFilePathFormat() {
		return filePathFormat;
	}

	public void setFilePathFormat(String filePathFormat) {
		this.filePathFormat = filePathFormat;
	}

	public String getFileUrlPrefix() {
		return fileUrlPrefix;
	}

	public void setFileUrlPrefix(String fileUrlPrefix) {
		this.fileUrlPrefix = fileUrlPrefix;
	}

	public String getVideoPathFormat() {
		return videoPathFormat;
	}

	public void setVideoPathFormat(String videoPathFormat) {
		this.videoPathFormat = videoPathFormat;
	}

	public String getVideoUrlPrefix() {
		return videoUrlPrefix;
	}

	public void setVideoUrlPrefix(String videoUrlPrefix) {
		this.videoUrlPrefix = videoUrlPrefix;
	}

	public String[] getImageAllowFiles() {
		return imageAllowFiles;
	}

	public void setImageAllowFiles(String[] imageAllowFiles) {
		this.imageAllowFiles = imageAllowFiles;
	}

	public String[] getFileAllowFiles() {
		return fileAllowFiles;
	}

	public void setFileAllowFiles(String[] fileAllowFiles) {
		this.fileAllowFiles = fileAllowFiles;
	}

	public String getImageFieldName() {
		return imageFieldName;
	}

	public void setImageFieldName(String imageFieldName) {
		this.imageFieldName = imageFieldName;
	}

}

如何自定义请求地址

本文档说明修改请求地址的方法。

应用场景

ueditor 1.4.2+ 推荐使用唯一的请求地址，通过GET参数action指定不同请求类型。但很多用户都希望使用自己写好的上传地址，下面提供一种解决方法：由于所有ueditor请求都通过editor对象的getActionUrl方法获取请求地址，可以直接通过复写这个方法实现，例子如下：

js覆盖原有getActionUrl 方法的实现

UE.Editor.prototype._bkGetActionUrl = UE.Editor.prototype.getActionUrl;
UE.Editor.prototype.getActionUrl = function(action) {
    if (action == 'uploadimage' || action == 'uploadscrawl' || action == 'uploadimage') {
        return 'http://a.b.com/upload.php';
    } else if (action == 'uploadvideo') {
        return 'http://a.b.com/video.php';
    } else {
        return this._bkGetActionUrl.call(this, action);
    }
}

action类型以及说明

• uploadimage：//执行上传图片或截图的action名称
• uploadscrawl：//执行上传涂鸦的action名称
• uploadvideo：//执行上传视频的action名称
• uploadfile：//controller里,执行上传视频的action名称
• catchimage：//执行抓取远程图片的action名称
• listimage：//执行列出图片的action名称
• listfile：//执行列出文件的action名称

跨域

修改请求链接往往会遇上跨域问题，跨域支持说明请移步：跨域文档