04 另一款常用的富文本插件kindeditor

本文将阐述又一个常用的富文本插件kindeditor，我们将从零开始构建此富文本插件。

1、环境约束

• idea2018.1.5
• maven-3.0.5
• jdk-8u162-windows-x64

2、源代码下载

官网【KindEditor 4.1.11】：
http://kindeditor.net/down.php
百度网盘：
链接：https://pan.baidu.com/s/1ihjBY3S7OvjEsYWZE1G4ng
提取码：9dsm

3、新建和拷贝工程

• 解压kindeditor-4.1.11-zh-CN.zip
• 在idea中创建一个web工程，并将tomcat之jar包设置到环境变量
• 按以下方式将解压好的文件夹拷贝到新建工程的web以及src，将web/jsp/lib中的jar包添加到环境变量：
  
  千万不要忘记点击File->Project Structure->Artifacts中的fix
  

4、修改

• 修改web/jsp/demo.jsp中的第13行
  由原来的
  变为
  
• 修改web/jsp/upload_json.jsp中的41~45行，确保文件夹不存在时会被创建
  由原来的

File uploadDir = new File(savePath);
if(!uploadDir.isDirectory()){
	out.println(getError("上传目录不存在，正在创建"));
	return;
}

变为

File uploadDir = new File(savePath);
if(!uploadDir.isDirectory()){
	uploadDir.mkdirs();
}

4、测试

• 以web/jsp/demo.jsp为启动页，开启tomcat
  启动之后按以下方式进行上传操作：
  
• 文件上传到哪里去了，我们通过查看浏览器的F12调试功能就能找到文件位置
  

至此，我们完成了从零开始对kindeditor的使用。