SSM+MAVEN整合百度富文本编辑器Ueditor（含后台代码）上传图片保存到本地

SSM项目中使用Ueditor需要提前下载Ueditor和映入pom依赖，这里就不阐述了。
本文章主要讲如何将图片保存到本地。
当配置好ueditor的时候，这个时候上传的图片是在一个临时文件夹内，当重启tomact服务器就没了，所以我们要获取到富文本编辑器上传的图片并保存到本地。
先贴前台代码：

 var ue = UE.getEditor('editor');
    UE.Editor.prototype._bkGetActionUrl = UE.Editor.prototype.getActionUrl;
    UE.Editor.prototype.getActionUrl = function(action) {
        if (action == 'uploadimage' || action == 'uploadscrawl') {
            return '${APP_PATH}/ueditor/uploadimage';//这就是自定义的上传地址
        } else if (action == 'uploadvideo') {
            return '';
        } else {
            return this._bkGetActionUrl.call(this, action);
        }
    }

注意这里return的一个是后台接口的位置
再来看后台代码：
第一步我们需要创建一个bean文件，用来处理返回的数据。

public class ReturnUploadImage{

	private String state;//上传状态SUCCESS，一定要大写
	private String url;//上传地址
	private String title;//图片名称
	private String original;//图片名称
	public String getState() {
		return state;
	}
	public void setState(String state) {
		this.state = state;
	}
	public String getUrl() {
		return url;
	}
	public void setUrl(String url) {
		this.url = url;
	}
	public String getTitle() {
		return title;
	}
	public void setTitle(String title) {
		this.title = title;
	}
	public String getOriginal() {
		return original;
	}
	public void setOriginal(String original) {
		this.original = original;
	}
	
}

然后controller代码：

@Controller
@RequestMapping("/ueditor")
public class UeditorController {
    @RequestMapping("/uploadimage")
    public String uploadimage(HttpServletRequest request , HttpServletResponse response) throws Exception {
		response.setContentType("text/html;charset=UTF-8");
		MultipartHttpServletRequest m = (MultipartHttpServletRequest) request;
    	MultipartFile file = m.getFile("upfile");
    	
    	String filePath = "E:\\upload\\";// 保存图片的路径
		// 获取原始图片的拓展名
		String originalFilename = file.getOriginalFilename();
		// 新的文件名字
		String newFileName = UUID.randomUUID() + originalFilename;
		
		File targetFile = new File(filePath, newFileName);
		file.transferTo(targetFile);
		
		String savepath = "/upload/" + newFileName;
		
		ReturnUploadImage rui = new ReturnUploadImage();
		if(targetFile != null) {
			rui.setState("SUCCESS");
			rui.setUrl(savepath);
			rui.setOriginal(newFileName);
			rui.setTitle(newFileName);
		}
		String result = new JSONObject(rui).toString();
    	response.getWriter().write(result);
    	System.out.println(result);
    	return null;
    	
    }
	 
	
	 
     
}

我们仔细看这段代码里面savepath为一个本地的路径，要使服务器能访问到，需要进行如下步骤，右键服务器open,在右侧选择add Ex…

然后
设置好如第一张图的样子。
这样图片的访问路径就是以"/upload"为访问路径，即/upload映射到了本地的E:\upload,所以我们要保存的图片路径即为本地路径。
要注意下面这段代码，这些是需要反馈给服务器的json数据，这里使用了JSON的toString方法，即把对象转换为String,这步是必须的。

if(targetFile != null) {
			rui.setState("SUCCESS");
			rui.setUrl(savepath);
			rui.setOriginal(newFileName);
			rui.setTitle(newFileName);
		}
		String result = new JSONObject(rui).toString();
    	response.getWriter().write(result);
    	System.out.println(result);

使用这个方法，需要在pom中映入依赖，如下

<dependency>
			<groupId>org.json</groupId>
			<artifactId>json</artifactId>
			<version>20170516</version>
</dependency>

ok,这个时候上传是没有任何问题，但是图片可能无法在富文本框中回显，这是因为我们在config.json中 “imageUrlPrefix”: “”, /* 图片访问路径前缀 */这一项中填入了东西，仔细研究就会发现我们设置的url是upload/…,后台返回的数据和imageUrlPrefix拼接后组成了图片的完整路径，所以我们把UrlPrefix设置为空。这样图片的url路径就是我们seturl的路径。
ok，至此，我们就搭建完了。测试一下。
网页显示如下，

我们再去看看我们的本地文件夹

当然我们也可以把图片上传到服务器的工程目录下，但是有一个很严重的问题就是，每次上传完之后，我们必须刷新项目才能够访问到图片，所以还不如上传到本地文件夹。
本次解决参考了下面链接的文章
文章
十分感谢，大家在配置中遇到什么问题，可以在下面留言！萌新一个，欢迎指教