先放个CKEDITOR的链接，有兴趣的小伙伴可以自己去看看。
再放一个富文本编辑框的介绍
在这里就不说这玩意是干啥的了，说一下遇到的问题，在编辑图片的时候，需要程序自己提供接口接收参数，并保存图片到服务器中，上传保存都没有问题，回写的时候前端怎么都接收不到我回写的地址，头疼了好久，最后发现4.0之后他的回写方式变了！！！变了！！！！！坑啊。。代码放上来，以供自己回来查找。
public class UpLoadImage {
@RequestMapping(value = "uploadImage")
private void uploadImage(HttpServletRequest request, HttpServletResponse response, HttpSession session) {
Map<String, Object> result = new HashMap<String, Object>();
System.out.println(((ServletRequestAttributes) RequestContextHolder.getRequestAttributes()).getRequest()
.getSession().getServletContext().getRealPath("/"));
String uploadPath = ((ServletRequestAttributes) RequestContextHolder.getRequestAttributes()).getRequest()
.getSession().getServletContext().getRealPath("/");
response.setCharacterEncoding("UTF-8");
PrintWriter out = null;
try {
out = response.getWriter();
String callback = request.getParameter("CKEditorFuncNum");
// 获得response,request
Map<String, Object> m = new HashMap<String, Object>();
if (!ServletFileUpload.isMultipartContent(request)) {
m.put("error", 1);
m.put("message", "请选择文件!");
}
DiskFileItemFactory factory = new DiskFileItemFactory();
factory.setSizeThreshold(Integer.parseInt(ReadConfigUtil.getPlatformConfig("fileUpload.memorySizeThreshold")));
ServletFileUpload upload = new ServletFileUpload(factory);
upload.setSizeMax(Integer.parseInt(ReadConfigUtil.getPlatformConfig("fileUpload.totalFileMaxsize")));
upload.setFileSizeMax(Integer.parseInt(ReadConfigUtil.getPlatformConfig("fileUpload.singleFileMaxsize")));
upload.setHeaderEncoding("UTF-8");
List<?> items;
items = upload.parseRequest(request);
String originalFileName = null;// 上传的图片文件名
String fileExtensionName = null;// 上传图片的文件扩展名
FileItem file = null;
for (int j = 0; j < items.size(); j++) {
file = (FileItem) items.get(j);
if(file.getContentType()==null||"".equals(file.getContentType()))continue;
if (file.getSize() > 10 * 1024 * 1024) {
out.println("<script type=\"text/javascript\">");
out.println("window.parent.CKEDITOR.tools.callFunction(" + callback + ",''," + "'文件大小不得大于10M');");
out.println("</script>");
}
originalFileName = file.getName();
fileExtensionName = originalFileName
.substring(originalFileName.lastIndexOf("."), originalFileName.length()).toLowerCase();
String[] imageExtensionNameArray = WebsiteConstant.IMAGE_EXTENSION_NAME_ARRAY;
String allImageExtensionName = "";
boolean isContain = false;// 默认不包含上传图片文件扩展名
for (int i = 0; i < imageExtensionNameArray.length; i++) {
if (fileExtensionName.equals(imageExtensionNameArray[i])) {
isContain = true;
}
if (i == 0) {
allImageExtensionName += imageExtensionNameArray[i];
} else {
allImageExtensionName += " , " + imageExtensionNameArray[i];
}
}
String newFileName = java.util.UUID.randomUUID().toString() + fileExtensionName;
uploadPath += "/picture/images/ckeditor/";
if (isContain) {// 包含
File pathFile = new File(uploadPath);
if (!pathFile.exists()) { // 如果路径不存在，创建
pathFile.mkdirs();
}
FileUtils.copyInputStreamToFile(file.getInputStream(), new File(uploadPath, newFileName));
// InputStream is=file.getInputStream();
// File toFile = new File(uploadPath, newFileName);
// OutputStream os = new FileOutputStream(toFile);
// byte[] buffer = new byte[1024];
// int length = 0;
// while ((length = is.read(buffer)) > 0) {
// os.write(buffer, 0, length);
// }
// is.close();
// os.close();
String imageUrl = "../../picture/images/ckeditor/" + newFileName;
// 返回"图像信息"选项卡并显示图片 ,在对应的文本框中显示图片资源url
// return "{'uploaded': 1,'fileName':
// '"+newFileName+"','url': '"+imageUrl+"'}";
// out.print("<script type=\"text/javascript\">");
// out.print("window.parent.CKEDITOR.tools.callFunction('1','"
// + imageUrl + "','')");
// out.print("</script>");
// result.put("uploaded", 1);
// result.put("fileName", newFileName);
// result.put("url", imageUrl);
//// JSONUtils.beanToJson(result);
// //out.print("{'uploaded': 1,'fileName':
// '"+newFileName+"','url': '"+imageUrl+"'}");
//// return null;
// return "111.png";
JSONObject obj = new JSONObject();
obj.put("uploaded", 1);
obj.put("fileName", newFileName);
obj.put("url", imageUrl);
out.write(obj.toString());
} else {
}
}
} catch (IOException | FileUploadException e1) {
e1.printStackTrace();
}finally{
if (out != null) {
out.flush();
out.close();
}
}
}
}
看注释就能知道我尝试了多少种方法吧。。4.0之后不能直接写url到前端了，需要写一个JSON过去提供页面解析。
