ckeditor作為老牌的優秀線上編輯器，一直受到開發者的青睞。 這裡我們講解下 ckeditor最新版本4.7的圖片上傳配置。 https://ckeditor.com/ 官方 進入下載 https://ckeditor.com/download 我們下載完整版 預設本地上傳沒有開啟； 找到cke ...
ckeditor作為老牌的優秀線上編輯器，一直受到開發者的青睞。
這裡我們講解下 ckeditor最新版本4.7的圖片上傳配置。
進入下載 https://ckeditor.com/download
我們下載完整版
預設本地上傳沒有開啟；
找到ckeditor/plugins/image/dialogs/image.js文件 打開
然後搜索 id:"Upload",hidden 預設值是!0 我們改成0即可
刷新頁面，點擊那個上傳圖片圖標，
出現了上傳；
然後我們配置下上傳後臺請求路徑
找到ckeditor下的config.js 打開
config.filebrowserUploadUrl="/admin/film/ckeditorUpload";
配置下
後臺處理有個callback參數CKEditorFuncNum我們要接收下 並且要返回
這裡我下我項目里的參考實現 用的是springboot
/**
* 上傳圖片
* @param file
* @return
*/
@ResponseBody
@RequestMapping("/ckeditorUpload")
public String ckeditorUpload(@RequestParam("upload")MultipartFile file,String CKEditorFuncNum)throws Exception{
// 獲取文件名
String fileName = file.getOriginalFilename();
// 獲取文件的尾碼名
String suffixName = fileName.substring(fileName.lastIndexOf("."));
String newFileName=DateUtil.getCurrentDateStr()+suffixName;
FileUtils.copyInputStreamToFile(file.getInputStream(), new File(imageFilePath+newFileName));
StringBuffer sb=new StringBuffer();
sb.append("<script type=\"text/javascript\">");
sb.append("window.parent.CKEDITOR.tools.callFunction("+ CKEditorFuncNum + ",'" +"/static/filmImage/"+ newFileName + "','')");
sb.append("</script>");
return sb.toString();
}
獲取文件，重命名，搞到本地 然後返回ajax信息。
轉載：http://blog.java1234.com/blog/articles/339.html
