Springboot中集成百度ueditor插件

   近期，手上的一个项目，用到了文本编辑，现在的后台开源框架中大都默认集成了Summernote编辑器，这个编辑器中基本的文本编辑、文本上传等功能也都有，但是在使用中发现不是很好用，特别是在编辑器中输入的内容特别多的时候，全选对文本内容进行修改时，有时出现内容不能正常修改，一次只能修改一部分，因此想要找个替换一下，然后就找到了百度的UEditor。
   在springboot项目中集成UEditor富文本编辑器的步骤：
   1、下载 UEditor JSP版本
   官网自主下载。链接：http://ueditor.baidu.com/website/
   2、将下载的插件包，放在webapp下的目录即可。我的是放在了static/ajax/libs文件夹下。
   3、将 UEditor -> jsp -> lib 文件夹下的 jar 拷出放在 WEB-INF -> lib 中，亦或 maven 在 pom.xml 中引入对应的依赖也可。
   ☉ commons-codec-1.9.jar
   ☉ commons-fileupload-1.3.1.jar
   ☉ commons-io-2.4.jar
   ☉ json.jar
   ☉ ueditor-1.1.2.jar
我的是在pox。xml中引入对应的依赖。
   4、新建Controller控制器，
  

@Controller
@RequestMapping("/ajax/libs/ueditor")
public class UeditorController extends BaseController
{
    private final String METHOD_HEAD = "ueditor";
    private final String IMGE_PATH = "/ueditor/images/";
    private final String VIDEO_PATH = "/ueditor/videos/";
    private final String FILE_PATH = "/ueditor/files/";

    @Autowired
    private ServerConfig serverConfig;

    /**
     * ueditor
     */
    @ResponseBody
    @RequestMapping(value = "/ueditor/controller")
    public Object ueditor(HttpServletRequest request, @RequestParam(value = "action", required = true) String action,
            MultipartFile upfile) throws Exception
    {
        List<Object> param = new ArrayList<Object>()
        {
            {
                add(action);
                add(upfile);
            }
        };


        Method method = this.getClass().getMethod(METHOD_HEAD + action, List.class, String.class);

        return method.invoke(this.getClass().newInstance(), param, serverConfig.getUrl());

    }

  
   5、对编辑器进行配置。
   ueditor.config.js中修改请求后台控制器url
  

    var URL = window.UEDITOR_HOME_URL || getUEBasePath();
    /**
     * 配置项主体。注意，此处所有涉及到路径的配置别遗漏URL变量。
     */
    window.UEDITOR_CONFIG = {

        //为编辑器实例添加一个路径，这个不能被注释
        UEDITOR_HOME_URL: URL

        [color=red]// 这里为请求后端控制器url，服务器统一请求接口路径
        , serverUrl: URL + "ueditor/controller"[/color]
   

   6、新建html页面，在页面中引入ueditor的js文件
  

   <script type="text/javascript" charset="utf-8" src="ueditor.config.js"></script>
    <script type="text/javascript" charset="utf-8" src="ueditor.all.min.js"> </script>
    <!--建议手动加在语言，避免在ie下有时因为加载语言失败导致编辑器加载失败-->
    <!--这里加载的语言文件会覆盖你在配置项目里添加的语言类型，比如你在配置项目里配置的是英文，这里加载的中文，那最后就是中文-->
    <script type="text/javascript" charset="utf-8" src="lang/zh-cn/zh-cn.js"></script>

   
   

   页面中调用ueditor插件

<div>
    <h1>完整demo</h1>
    <script id="editor" type="text/plain" style="width:1024px;height:500px;"></script>
</div>

  
   7、到这里就基本上配置完成了，其他的配置都默认就可以了。启动项目后，访问编辑器配置项，http://localhost:8088/ajax/libs/ueditor/ueditor/controller?action=config，当看到这个配置文件时，说明配置成功了。

  "videoMaxSize": 102400000,
  "videoActionName": "uploadvideo",
  "fileActionName": "uploadfile",
  "fileManagerListPath": "/ueditor/jsp/upload/file/",
  "imageCompressBorder": 1600,
  "imageManagerAllowFiles": [
    ".png",
    ".jpg",
    ".jpeg",
    ".gif",
    ".bmp"
  ],
  "imageManagerListPath": "/ueditor/jsp/upload/image/",
  "fileMaxSize": 51200000,
  "fileManagerAllowFiles": [
    ".png",
    ".jpg",
    ".jpeg",
    ".gif",
    ".bmp",
    ".flv",
    ".swf",
    ".mkv",
    ".avi",
    ".rm",
    ".rmvb",
    ".mpeg",
    ".mpg",
    ".ogg",
    ".ogv",
    ".mov",
    ".wmv",
    ".mp4",
    ".webm",
    ".mp3",
    ".wav",
    ".mid",
    ".rar",
    ".zip",
    ".tar",
    ".gz",
    ".7z",
    ".bz2",
    ".cab",
    ".iso",
    ".doc",
    ".docx",
    ".xls",
    ".xlsx",
    ".ppt",
    ".pptx",
    ".pdf",
    ".txt",
    ".md",
    ".xml"
  ],
  "fileManagerActionName": "listfile",
  "snapscreenInsertAlign": "none",
  "scrawlActionName": "uploadscrawl",
  "videoFieldName": "upfile",
  "imageCompressEnable": true,
  "videoUrlPrefix": "",
  "fileManagerUrlPrefix": "",
  "catcherAllowFiles": [
    ".png",
    ".jpg",
    ".jpeg",
    ".gif",
    ".bmp"
  ],
  "imageManagerActionName": "listimage",
  "snapscreenPathFormat": "/ueditor/jsp/upload/image/{yyyy}{mm}{dd}/{time}{rand:6}",
  "scrawlPathFormat": "/ueditor/jsp/upload/image/{yyyy}{mm}{dd}/{time}{rand:6}",
  "scrawlMaxSize": 2048000,
  "imageInsertAlign": "none",
  "catcherPathFormat": "/ueditor/jsp/upload/image/{yyyy}{mm}{dd}/{time}{rand:6}",
  "catcherMaxSize": 2048000,
  "snapscreenUrlPrefix": "",
  "imagePathFormat": "/ueditor/jsp/upload/image/{yyyy}{mm}{dd}/{time}{rand:6}",
  "imageManagerUrlPrefix": "",
  "scrawlUrlPrefix": "",
  "scrawlFieldName": "upfile",
  "imageMaxSize": 2048000,
  "imageAllowFiles": [
    ".png",
    ".jpg",
    ".jpeg",
    ".gif",
    ".bmp"
  ],
  "snapscreenActionName": "uploadimage",
  "catcherActionName": "catchimage",
  "fileFieldName": "upfile",
  "fileUrlPrefix": "",
  "imageManagerInsertAlign": "none",
  "catcherLocalDomain": [
    "127.0.0.1",
    "localhost",
    "img.baidu.com"
  ],
  "filePathFormat": "/ueditor/jsp/upload/file/{yyyy}{mm}{dd}/{time}{rand:6}",
  "videoPathFormat": "/ueditor/jsp/upload/video/{yyyy}{mm}{dd}/{time}{rand:6}",
  "fileManagerListSize": 20,
  "imageActionName": "uploadimage",
  "imageFieldName": "upfile",
  "imageUrlPrefix": "",
  "scrawlInsertAlign": "none",
  "fileAllowFiles": [
    ".png",
    ".jpg",
    ".jpeg",
    ".gif",
    ".bmp",
    ".flv",
    ".swf",
    ".mkv",
    ".avi",
    ".rm",
    ".rmvb",
    ".mpeg",
    ".mpg",
    ".ogg",
    ".ogv",
    ".mov",
    ".wmv",
    ".mp4",
    ".webm",
    ".mp3",
    ".wav",
    ".mid",
    ".rar",
    ".zip",
    ".tar",
    ".gz",
    ".7z",
    ".bz2",
    ".cab",
    ".iso",
    ".doc",
    ".docx",
    ".xls",
    ".xlsx",
    ".ppt",
    ".pptx",
    ".pdf",
    ".txt",
    ".md",
    ".xml"
  ],
  "catcherUrlPrefix": "",
  "imageManagerListSize": 20,
  "catcherFieldName": "source",
  "videoAllowFiles": [
    ".flv",
    ".swf",
    ".mkv",
    ".avi",
    ".rm",
    ".rmvb",
    ".mpeg",
    ".mpg",
    ".ogg",
    ".ogv",
    ".mov",
    ".wmv",
    ".mp4",
    ".webm",
    ".mp3",
    ".wav",
    ".mid"
  ]
}

   8、访问ueditor下的index.html文件。
http://localhost:8088/ajax/libs/ueditor/index.html
当看到ueditor编辑器说明集成成功，但是在使用中发现文件上传灰显，多文件上传显示”后台配置项没有正常加载，上传不可用“，然后网上找了各种解决方案：1）有的是修改控制器中的

引用

原来设置的是：
date_default_timezone_set("Asia/chongqing");
把重庆的首字母改成大写，就可以了：
date_default_timezone_set("Asia/Chongqing");

找了半天也没找见这个配置。2）在ueditor.config.json配置中"imageUrlPrefix": "添加项目路径".  我本地的通过以上几种方式修改后都没有恢复，最后访问了ueditor下的demo，发现是js的引入问题导致的。
      demo中的js引入是这样的：

   <script type="text/javascript" charset="utf-8" src="ueditor.config.js"></script>
    <script type="text/javascript" charset="utf-8" src="ueditor.all.min.js"> </script>
    <!--建议手动加在语言，避免在ie下有时因为加载语言失败导致编辑器加载失败-->
    <!--这里加载的语言文件会覆盖你在配置项目里添加的语言类型，比如你在配置项目里配置的是英文，这里加载的中文，那最后就是中文-->
    <script type="text/javascript" charset="utf-8" src="lang/zh-cn/zh-cn.js"></script>

   
   

我本地的是js放到include。html中，

<!-- ueditor富文本编辑器插件 -->
<div th:fragment="ueditor-js">
	<script th:src="@{/ajax/libs/ueditor/ueditor.config.js}"></script>
	<script th:src="@{/ajax/libs/ueditor/ueditor.all.min.js}"></script>
	<script th:src="@{/ajax/libs/ueditor/lang/zh-cn/zh-cn.js}"></script>
</div>


页面中引入ueditor-js：
<th:block th:include="include :: ueditor-js" />

最后将js引入提到最前面后，文件上传功能正常了。这个问题困扰了我整整一天，总算是解决了。