1凫海、在下載ckeditor包
https://ckeditor.com/ckeditor-4/download/
2拦键、引用ckeditor的js文件
<script src="../../../static/js/ckeditor/ckeditor.js"></script>
<textarea name="content" id="editor">? <p>This is some sample content.</p>? </textarea>
window.onload =function(){CKEDITOR.replace('editor');};
3、引入config.js文件
<script src="../../../static/js/ckeditor/config.js"></script>
在config.js添加config.filebrowserUploadUrl="http://127.0.0.1:8080/llz/test/testPost";
config.filebrowserUploadUrl=""http://配置圖片上傳接口
3毅往、服務(wù)器上傳接口
//圖片黏貼上傳接口
@PostMapping("/testPost&responseType=json")
public MaptestPostRes(@RequestParam("upload") MultipartFile file){
System.out.print(file);
? if (!file.isEmpty()) {
try {
String relaPath ="static\\upload\\"+new Date().getTime()+"\\";
? ? ? ? String path ="E:\\project\\" + relaPath;
? ? ? ? File filepath =new File(path);
? ? ? ? if (!filepath.exists())
filepath.mkdirs();
? ? ? ? // 文件保存路徑
? ? ? ? String savePath = path? + file.getOriginalFilename();
? ? ? ? // 轉(zhuǎn)存文件
? ? ? ? file.transferTo(new File(savePath));
? ? ? ? Map res =new HashMap();
? ? ? ? res.put("uploaded",1);
? ? ? ? res.put("fileName",file.getOriginalFilename());
? ? ? ? res.put("url",savePath);
? ? ? ? return res;
? ? ? }catch (Exception e) {
e.printStackTrace();
? ? ? }
}
return null;
}
//圖片上傳接口
@PostMapping("/testPost")
public MaptestPost(@RequestParam("upload") MultipartFile file){
System.out.print(file);
? if (!file.isEmpty()) {
try {
String relaPath ="static\\upload\\"+new Date().getTime()+"\\";
? ? ? ? String path ="E:\\project\\" + relaPath;
? ? ? ? File filepath =new File(path);
? ? ? ? if (!filepath.exists())
filepath.mkdirs();
? ? ? ? // 文件保存路徑
? ? ? ? String savePath = path? + file.getOriginalFilename();
? ? ? ? // 轉(zhuǎn)存文件
? ? ? ? file.transferTo(new File(savePath));
? ? ? ? Map res =new HashMap();
? ? ? ? res.put("uploaded",1);
? ? ? ? res.put("fileName",file.getOriginalFilename());
? ? ? ? res.put("url",savePath);
? ? ? ? return res;
? ? ? }catch (Exception e) {
e.printStackTrace();
? ? ? }
}
return null;
}
