springboot ueditor 整合篇

本文主要是介绍springboot ueditor 整合篇，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

一、上传文件到本地版本

项目地址：GitHub - weiangongsi/ueditor-spring-boot-starter: 百度编辑器上传文件到本地，支持自定义上传

文件导入
- 新建springboot项目
- 不需要下载本项目，jar包已经上传到maven仓库
- pom文件引入
```
     <dependency><groupId>com.dcssn</groupId><artifactId>ueditor-spring-boot-starter</artifactId><version>0.1.0</version></dependency>
```
- 下载百度编辑器源码链接：最新版本1.4.3.3 Jsp UTF-8版本
- 创建ueditor目录 resources > static > ueditor ，将源码拷贝到目录中
- jsp目录只保留 config.json 文件即可
项目配置
- application.yml
```
ue:config-file: static/ueditor/jsp/config.json #resources目录下配置文件的位置server-url: /ueditor.do #服务器统一请求接口路径url-prefix: /file/ #"/"结尾physical-path: C:/upload/ #存储文件的绝对路径 必须使用标准路径"/"作为分隔符
```
- static/ueditor/ueditor.config.js
  将serverUrl 改为application.yml 中ue.server-url 的值
- config.json
  图片访问路径前缀（imageUrlPrefix）、视频访问路径前缀、文件访问路径前缀不要赋值，会影响回显，其余参数可以按照百度文档修改
- 上传文件大小
  spring上传文件默认最大1MB，上传文件大小会先被spring限制，config.json文件大小限制要小于spring的设置，我们可以将spring的限制设大点
```
  spring:servlet:multipart:max-file-size: 100MB
```

测试

新建Controller 添加mapping

   @GetMapping("/ue")public String index() {return "ue";}

在templates下新建页面ue.html

   <!DOCTYPE html><html lang="UTF-8" xmlns:th="http://www.springframework.org/schema/jdbc"><head><meta charset="UTF-8"/><title>ueditor</title><style>#editor {width: 1024px;height: 500px;}</style></head><body><div id="editor" type="text/plain"></div><script th:src="@{/ueditor/ueditor.config.js}"></script><script th:src="@{/ueditor/ueditor.all.min.js}"></script><script th:src="@{/ueditor/lang/zh-cn/zh-cn.js}"></script><script>UE.getEditor('editor');</script></body></html>

如有问题可以加群：806893930 ，我第一次建群，里面就几个人，欢迎你的加入

参考百度文档
代码只修改了上传和获取文件列表的方法，添加了服务器统一请求接口路径的拦截器，没有别的改动，百度文档
项目案例
GitHub - weiangongsi/ueditor-spring-boot-starter-example: ueditor整合springboot 上传文件到本地

二、上传文件到七牛云版本

项目地址：https://github.com/weiangongsi/ueditor-qiniu-spring-boot-starter

文件导入
- 新建springboot项目
- 不需要下载本项目，jar包已经上传到maven仓库
- pom文件引入
```
     <dependency><groupId>com.dcssn</groupId><artifactId>ueditor-qiniu-spring-boot-starter</artifactId><version>0.0.1</version></dependency>
```
- 下载百度编辑器源码链接：最新版本1.4.3.3 Jsp UTF-8版本
- 创建ueditor目录 resources > static > ueditor ，将源码拷贝到目录中
- jsp目录只保留 config.json 文件即可
项目配置
- application.yml
```
   ue:config-file: static/ueditor/jsp/config.json #resources目录下配置文件的位置server-url: /ueditor.do #服务器统一请求接口路径和ueditor.config.js中的serverUrl要一致qiniu:accessKey: 8Dw03nJLiST7RvsWtPca1JHDgeu8O0BA******secretKey: LHkGDHPZCyrUk5BxG7vC5sLY9LmDxf******cdn: http://image.xxx.com/ #CDN 加速域名 最后面的斜杠（/）不能少bucket: image #存储空间zone: zone0 #zone代表机房的位置
```
  其中关于Zone对象和机房的关系如下：
  
  机房 Zone对象
  华东 zone0
  华北 zone1
  华南 zone2
  北美 zoneNa0
  东南亚 zoneAs0
- static/ueditor/ueditor.config.js
  将serverUrl 改为application.yml 中ue.server-url 的值
- config.json
  图片访问路径前缀（imageUrlPrefix）、视频访问路径前缀、文件访问路径前缀不要赋值，会影响回显，其余参数可以按照百度文档修改
- 上传文件大小
  spring上传文件默认最大1MB，上传文件大小会先被spring限制，config.json文件大小限制要小于spring的设置，我们可以将spring的限制设大点
```
  spring:servlet:multipart:max-file-size: 100MB
```

机房	Zone对象
华东	zone0
华北	zone1
华南	zone2
北美	zoneNa0
东南亚	zoneAs0

测试

新建Controller 添加mapping

   @GetMapping("/ue")public String index() {return "ue";}

在templates下新建页面ue.html

   <!DOCTYPE html><html lang="UTF-8" xmlns:th="http://www.springframework.org/schema/jdbc"><head><meta charset="UTF-8"/><title>ueditor</title><style>#editor {width: 1024px;height: 500px;}</style></head><body><div id="editor" type="text/plain"></div><script th:src="@{/ueditor/ueditor.config.js}"></script><script th:src="@{/ueditor/ueditor.all.min.js}"></script><script th:src="@{/ueditor/lang/zh-cn/zh-cn.js}"></script><script>UE.getEditor('editor');</script></body></html>

如有问题可以加群：806893930 ，我第一次建群，里面就几个人，欢迎你的加入