springboot整合ueditor有源码

迷南。 2024-03-17 11:34 87阅读 0赞

在项目用到ueditor插件来编辑信息，初次接触，遇到各种问题，到目前为止，也只是基本实现了功能，简单记录一下过程，希望对初次使用ueditor的朋友们有所帮助。

ueditor就不介绍了，或对ueditor还不了解的朋友请先百度，看看资料…

整合过程不难，看明白思路大家都会做。

如果是vue项目的整合，去看这篇：[vue项目整合UEditor看这一篇就够了][vue_UEditor]

### 1、ueditor ###

[https://github.com/fex-team/ueditor][https_github.com_fex-team_ueditor]

ueditor的代码是jsp页面，这里我以springBoot+thymeleaf为例说明，把ueditor整合到我这个项目中，后面我会给出demo的github地址。

这是下载下来的内容  
![在这里插入图片描述][c6ff7251da4e492eb02a8cacea5d7d97.png]  
ueditor只提供了jsp的引用，并没有html的用法，都没有关系，jsp的内容可以用controller来替换。

`ueditor.config.js`是配置文件，我们最后要修改请求路径，就是在这个文件里

`config.json` 是配置文件，定义了图片的大小格式等相关信息

### 2、现在整理一下我们的需求？ ###

*  第一：要上传的图片在页面显示
 *  第二：将一切对图片的上传处理都交给我们自定义的controller来做
 *  第三：上传的图片我们可能会保存到阿里云或其他服务器，并给ueditor传回地址，怎么实现？

### 3、实现过程分析 ###

看代码会发现，ueditor插件有他自己的控制，图片保存的路径，图片请求的控制器，路径都需要修改；

修改完图片的请求路径以后会发现页面控制台报错，找不到映射。

原因就是官网的demo是jsp示例，修改了请求路径之后就找不到config.json；

解决： 我在这里将config.json放在了springboot的resource中，但是找不到；

通过路径都能获取到文件，但ueditor取不到，不知道为什么！

config.json最终也是要给ueditor.config.js中使用的，没有config.json的配置，图片提交出错；

所以就将config.json中的配置信息复制到ueditor.config.js中，就解决了问题。

上传图片，修改了配置文件以后，上传图片就可以请求到自定义的控制器， 最后图片要在页面显示需要回传地址，此时在controller中通过一个map封装信息，返回到页面即可。

**思路就是这样，希望可以帮助到你，如果还有问题，@我给你发demo源码**

> 不会，我可以学；落后，我可以追赶；跌倒，我可以站起来！我一定行！

[vue_UEditor]: https://blog.csdn.net/kh6417/article/details/119296951?spm=1001.2014.3001.5502
[https_github.com_fex-team_ueditor]: https://github.com/fex-team/ueditor
[c6ff7251da4e492eb02a8cacea5d7d97.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/17/b05e258ce6e34990830f54f199a123d0.png

发表评论取消回复

表情：

评论列表（有 0 条评论，87人围观）

还没有评论，来说两句吧...

相关阅读

相关 springboot整合ueditor有源码

在项目用到ueditor插件来编辑信息，初次接触，遇到各种问题，到目前为止，也只是基本实现了功能，简单记录一下过程，希望对初次使用ueditor的朋友们有所帮助。 uedit

迷南。/ 2024年03月17日 11:34/ 0 赞/ 88 阅读

相关 SpringBoot整合Redis附带视频源码

一、环境 > [Linux下安装Redis][Linux_Redis] 1-1、SpringBoot 2.2.0 1-2、JDK 11 1-3、sprin

悠悠/ 2022年12月23日 03:28/ 0 赞/ 150 阅读

相关 SpringBoot整合Ueditor和kityformula

本博客实现功能： ![在这里插入图片描述][20201011144632515.gif_pic_center] 代码下载地下：[https://download.csd

骑猪看日落/ 2022年12月13日 12:40/ 0 赞/ 211 阅读

相关 SpringBoot整合Ueditor

简介本博客实现SpringBoot整合Ueditor的功能，解决图片上传的问题：路径设置、图片大小设置等源代码下载地址：[https://download.csd

￡神魔★判官ぃ/ 2022年12月13日 09:55/ 0 赞/ 321 阅读

相关 SpringBoot 整合 UEditor 详细教程（一）| 整合教程

SpringBoot 整合 UEditor 详细教程（一）| 整合教程 -------------------- 官方文档：[http://fex.baidu.com

怼烎@/ 2022年12月03日 05:13/ 0 赞/ 321 阅读

相关 Rocketmq源码--3--整合springboot

`Rocketmq`源码–`3`–整合`springboot` 文章目录 \`Rocketmq\`源码--\`3\`--整合\`springboot\`

分手后的思念是犯贱/ 2022年10月16日 09:54/ 0 赞/ 102 阅读

相关 SpringBoot2.x 整合 Ueditor

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_Q1NETiBAZ2JsZnk_size_74_c

淩亂°似流年/ 2022年09月08日 11:54/ 0 赞/ 261 阅读

相关编辑器ueditor和springboot 的整合

1.先导入ueditor所有的包:在springboot static下 ![Center][] 2.导入需要的ueditor的js ![Center 1][]

╰半橙微兮°/ 2022年06月10日 14:13/ 0 赞/ 196 阅读

相关 SpringMVC整合UEditor

由于项目需要，前端需要在线编辑文档，那么就要提供丰富一点的编辑器。找了半天，前端跟我说只能用Ueditor。这还是个国产的，baidu的。那个API我反正是看不懂。整合了各方博

￡神魔★判官ぃ/ 2022年05月12日 10:22/ 0 赞/ 181 阅读

相关 SpringBoot整合SpringSecurity(附带源码)

SpringBoot整合SpringSecurity 配置环境配置idea 配置thymeleaf 配置JPA

妖狐艹你老母/ 2022年04月08日 10:11/ 0 赞/ 399 阅读