springboot集成ueditor百度富文本编辑器及上传图片到oss服务器

1、下载ueditor编辑器

 

2、把下载的ueditor的文件springboot静态资源配置在resources下面

3、引入ueditor的js文件，及实例化

做完以上3点，就可以展示出来编辑器了 

4、上传图片到oss服务器

         1、先引入jsp/lib下的所有jar包，如果项目中已有的就不必重复添加了。

          下面是UEditor依赖的jar包，可以直接使用（1.4.3.3版本）

    commons-fileupload
    commons-fileupload
    1.3.1


    commons-codec
    commons-codec
    1.9


    com.blingblingbang
    ueditor
    1.1.2


    commons-io
    commons-io
    2.4

2、如果项目中你用的html页面    ueditor/jsp/controller.jsp这个文件报红，在加载ueditor/ueditor.config.js 时调用

      服务器统一请求接口路径    serverUrl: URL + "jsp/controller.jsp"  可能会导致

      后台配置项返回格式出错，上传功能将不能正常使用！这个错误。

3、所以我自己写了一个接口，让他重定向到 /ueditor/jsp/config.json 这个文件。

     把   ueditor/ueditor.config.js  中的服务器统一请求接口路径  更换为自己写的重定向接口（这个思路是来自于              https://blog.csdn.net/pengdandezhi/article/details/81253904    大家可以看一下）

 

4、上传到oss服务器

做一个判断，当他上传图片时让他直接访问自己写的上传接口   如下图：

后台接口（这个是上传oss服务器的接口，你们换成自己的就好）

注意的是，返回一定要是一个json格式，里面包含state  和 url  

执行完以上步骤，你的ueditor就可以上传成功了。

最后回显的时候注意一下  ueditor/ueditor.config.js  的图片访问路径前缀设置为"" 就行。

 

注意：上传的时候 ueditor/ueditor.config.js  里的提交图片的表单名称一定要和后台接口

@RequestParam(value = "upfile", required = false) MultipartFile upfile   名字要一致，不然会获取不到数据。

 

还有一种方法，不过需要修改源码（修改img.js文件把源码的上传接口换成自己后台的上传接口就好，这里就不展示了）。