Kind Editor 编辑器 图片上传

KindEditor 编辑器 图片上传

最近接触到了html文本的存储。 以前没有涉及这么全面的html + 图片 上传。

今天用KindEditor 做了一些功能。 我的项目用spring mvc+mybatis 整的。

贴出我的前端和后端代码 。供新手参考。 不用多余jar。 跟普通上传图片差不多。

前端js代码

var editor;
		KindEditor.ready(function(K) {
			var editor = K.create('textarea[name="Description"]', {
				uploadJson : 'kingedit/imageUpload',上传图片的地址
			});
			
			
		});

前端html代码

<textarea rows="5" cols="70" name="Description"></textarea>
		   		

后端上传图片代码，注意，编辑器必须接收到返回的json。

@RequestMapping("/imageUpload")
	@ResponseBody
	public String imageUpload(MultipartHttpServletRequest request) throws Exception {
		String webpath =  null;
		try {
			//上传图片
			MultipartFile file = request.getFile("imgFile");
			webpath = FileUtil.saveWebImgFile(file);
			if(StringUtils.isNotEmpty(webpath)){
				String path = request.getContextPath();
				String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
				webpath = "{\"error\" : 0,\"url\" : \""+basePath+webpath+"\"}";//成功
			}else{
				webpath = "{\"error\" : 0,\"message\" : \"上传文件不存在\"}";//失败
			}
		}catch (Exception e) {
			e.printStackTrace();
		}
		return webpath;
	}