springboot整合UEditor

最新推荐文章于 2024-04-10 01:35:37 发布

「已注销」

最新推荐文章于 2024-04-10 01:35:37 发布

阅读量558

点赞数

分类专栏： UEditor富文本编辑器 springboot 文章标签： UEditor springboot

本文链接：https://blog.youkuaiyun.com/weixin_44122500/article/details/92839418

版权

UEditor富文本编辑器同时被 2 个专栏收录

2 篇文章

订阅专栏

springboot

1 篇文章

订阅专栏

本文介绍了在SpringBoot项目中整合UEditor需要注意的配置要点。包括：配置config.json中的basePath以匹配静态资源路径，调整SpringBoot文件上传大小限制，以及解决UEditor动态地图插入和图片样式异常的问题。并提供了相关配置参数和代码示例。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

几个需要注意的点：

1.对config.json的配置处，配置basePath，用于作为文件上传的基本路径，这个基本路径需要与application.properties中静态资源的路径对应上，否则回显时候可能会出现图片回显失败的情况，其原因在于UEditor上传图片等文件后返回的参数资源路径是根据其.json文件配置的。而在项目获取资源的时候需本地资源映射，路径不一致时候会导致找寻不到资源
在这里插入图片描述
添加application.properties中参数：

spring.resources.static-locations=classpath:/META-INF/resources/,classpath:/resources/,classpath:/static/,classpath:/public/,file:uploadResourse/

2.springboot对于文件上传的大小有着限制，单文件最多1M，多文件最多10M。需要修改的时候，需要在配置文件之中加入额外的参数：
添加application.properties中参数：

springboot1.3版本：

multipart.maxFileSize
multipart.maxRequestSize

springboot1.4版本

spring.http.multipart.maxFileSize
spring.http.multipart.maxRequestSize

springboot2.0版本

spring.servlet.multipart.max-file-size=1000MB
spring.servlet.multipart.max-request-size=1000MB

3.百度UEditor自身存在bug，对于动态地图的插入与图片样式变更时候会存在异常。需要修改其配置文件

ueditor.config.js。
找到 whitList修改为如下：

whitList: {
			iframe: ['align','height','longdesc','marginheight','marginwidth','name','sandbox','scrolling', 'seamless', 'src', 'srcdoc', 'width'],
			a:      ['target', 'href', 'title', 'class', 'style'],
			abbr:   ['title', 'class', 'style'],
			address: ['class', 'style'],
			area:   ['shape', 'coords', 'href', 'alt'],
			article: [],
			aside:  [],
			audio:  ['autoplay', 'controls', 'loop', 'preload', 'src', 'class', 'style'],
			b:      ['class', 'style'],
			bdi:    ['dir'],
			bdo:    ['dir'],
			big:    [],
			blockquote: ['cite', 'class', 'style'],
			br:     [],
			caption: ['class', 'style'],
			center: [],
			cite:   [],
			code:   ['class', 'style'],
			col:    ['align', 'valign', 'span', 'width', 'class', 'style'],
			colgroup: ['align', 'valign', 'span', 'width', 'class', 'style'],
			dd:     ['class', 'style'],
			del:    ['datetime'],
			details: ['open'],
			div:    ['class', 'style'],
			dl:     ['class', 'style'],
			dt:     ['class', 'style'],
			em:     ['class', 'style'],
			font:   ['color', 'size', 'face'],
			footer: [],
			h1:     ['class', 'style'],
			h2:     ['class', 'style'],
			h3:     ['class', 'style'],
			h4:     ['class', 'style'],
			h5:     ['class', 'style'],
			h6:     ['class', 'style'],
			header: [],
			hr:     [],
			i:      ['class', 'style'],
			img : [ 'src', 'alt', 'title', 'width', 'height', 'id', '_src','loadingclass', 'class', 'data-latex', 'style' ],
			// img:    ['src', 'alt', 'title', 'width', 'height', 'id', '_src', 'loadingclass', 'class', 'data-latex'],
			ins:    ['datetime'],
			li:     ['class', 'style'],
			mark:   [],
			nav:    [],
			ol:     ['class', 'style'],
			p:      ['class', 'style'],
			pre:    ['class', 'style'],
			s:      [],
			section:[],
			small:  [],
			span:   ['class', 'style'],
			sub:    ['class', 'style'],
			sup:    ['class', 'style'],
			strong: ['class', 'style'],
			table:  ['width', 'border', 'align', 'valign', 'class', 'style'],
			tbody:  ['align', 'valign', 'class', 'style'],
			td:     ['width', 'rowspan', 'colspan', 'align', 'valign', 'class', 'style'],
			tfoot:  ['align', 'valign', 'class', 'style'],
			th:     ['width', 'rowspan', 'colspan', 'align', 'valign', 'class', 'style'],
			thead:  ['align', 'valign', 'class', 'style'],
			tr:     ['rowspan', 'align', 'valign', 'class', 'style'],
			tt:     [],
			u:      [],
			ul:     ['class', 'style'],
			video:  ['autoplay', 'controls', 'loop', 'preload', 'src', 'height', 'width', 'class', 'style']
		}

参考：
springboot整合UEditor
springboot上传文件大小设置

代码：
代码下载