UEditor以前在php專案中使用過，是一款非常強大的富文字編輯器,內部實現了各種上傳功能，我們甚至不用寫任何程式碼，只需要在所需的專案中正確引入ueditor即可。最近在學習java spring boot框架，專案中也選擇這款編輯器。但是配置卻出現了很多問題，是我沒有想到的。因為用thinkphp5來引用時基本不需要任何配置，引入幾個js檔案就行了。然而在spring boot 中卻沒有那麼簡單，出現了很多問題。於是百度一下：spring boot整合UEditor。發現還是有很多人遇到了和我一樣的問題，當然也百度出來很多所謂的正確解決方案。實踐下來發現都不太可行，要不是說的太複雜，改各種原始碼，要不就是亂寫一通，騙訪問量！這一過程讓我浪費了很多時間，最終決定，沉下心來，自己搞！好在順利完成配置。這裡和大家分享一下，希望能幫助到其他人，避免踩坑。

  首先建立一個新的spring boot專案，這裡我使用的是idea，完成的專案目錄結構如下：

下載UEditor(https://ueditor.baidu.com/website/download.html)1.4.3.3 Jsp 版本 UTF-8版，解壓並更名到resources/static/admin目錄下面。目錄結構如下，這裡你要在resources/static/建立一個admin目錄存放解壓好的ueditor檔案，目錄結構請務必保持一致。

好了現在我們來引入編輯器，首先需要在用到thymeleaf模板引擎和ueditor所需要的依賴包

pom檔案中引入的jar包如下（ueditor這個jar包看清楚groupid和版本號不要引錯了）

在resources/template目錄下建立admin目錄並新建test.html檔案，結構以及程式碼如下：

模板檔案建好了，我們來寫控制器，在com.exampel包下新建controller包，並建立UeditorController,結構及程式碼如下：

現在來訪問：http://localhost:8080/admin/test ，出現如下介面，說明ueditor引入成功。

但是問題出現了，我們點選上傳按鈕卻沒有任何反應，在瀏覽器中按F12開啟開發者工具發現如下提示：

那麼我們該如何配置呢？ueditor的配置主要用的以下幾個檔案：

當我們開啟http://localhost:8080/admin/test 會發現一個請求，可以判斷UEditor向後臺的請求要經過controller.jsp，這個請求地址是在ueditor.config.js中配置的，官方文件中也有說明。

再看看該請求的響應：

根據返回的內容，顯然，該請求沒有正確響應，那麼這就是問題的根源所在。為什麼會出現這種問題呢？因為這是jsp版本的，而我們使用的是spring boot，請求應該經過控制器，而不能直接去訪問這個jsp,你可以發現，當我們直接在瀏覽器輸入這個請求http://localhost:8080/admin/ueditor/jsp/controller.jsp?action=config&&noCache=1540282051992時你會發現，這成了一個下載連結，可以下載contoller.jsp。

我們來看看controller.jsp裡面到底有什麼：

首先你可以看到out.write()這個方法報錯了，該方法不存在，這是因為pom檔案中沒有引入jsp的api，springboot專案中我們使用了thymeleaf模板引擎也用不到jsp。所以這個我們暫時不管。再看看這個rootPath,查閱官方文件和相關資料，原來所有請求經過controller.jsp時都要先載入配置檔案config.json，而這個rootPath就是配置檔案所在的目錄。out.write()就是輸出（返回）這個json格式的配置資訊。

知道錯誤原因，那我們開始修改吧！

通過分析我們知道了，spring boot中不能直接將請求傳送到這個controller.jsp（請求地址變成了一個下載連結），我們應該新建一個控制器ServerController（一定是新建一個控制器，不能用UEditorController，否則請求路徑會加上http:127.0.0.1:8080/admin/config，這樣後面肯定會錯誤,只能是http:127.0.0.1:8080/config，原始碼中會根據請求url來獲取不同的配置），將controller.jsp中的程式碼copy過來，並做一些小小的修改，具體程式碼如下：

前面我們知道這個rootPath是指向的是config.json所在的目錄（resources/static/admin/ueditor/jsp），spring boot中應該這樣修改才能獲取的到，然後用PrintWriter來輸出json格式的配置資訊。那麼這個方法就作為了ueditor向伺服器傳送請求的控制器了，從而取代了controller.jsp的作用，我們就需要去修改ueditor.config.js中配置的伺服器統一請求介面路徑serverUrl的值來指向這個方法。具體修改如下：

server_url    協議://域名:埠   如 http:127.0.0.1:8080

那麼serverUrl  server_url+“/config”   http:127.0.0.1:8080/config  就指向了我們控制器中建立的方法，作為伺服器統一請求介面

重啟專案，再次開啟 http://localhost:8080/admin/test， 控制檯沒有報錯，圖片上傳的按鈕也可以點選了。

點選圖片上傳：發現圖片可以上傳，但是沒有正確顯示

瀏覽器中按F12檢視發現：

圖片的地址是/ueditor/jsp/upload/image/xxx/xxx.jpg,我們發現這個路徑是在在config.json中已經配置好了的：

那麼自動拼接出來的地址就是http://127.0.0.1:8080/ueditor/jsp/upload/image/xxx/xxx.jpg。我們看看實際上我們的圖片被上傳到哪裡去了：

顯然這個路徑少了前面的/admin/ueditor/jsp，檢視ueditor.config.js發現可以配置圖片顯示地址的字首，那麼這個問題就迎刃而解了，修改ueditor.config.js中imageUrlPrefix的值，同樣的多圖上傳，視訊上傳等等，也需要在配置中加上字首，才能正確訪問。

重啟專案，再次開啟 http://localhost:8080/admin/test 並上傳圖片：

完美解決！！！

至此，spring boot 配置UEditor就大功告成了，希望能對你有所幫助，如有問題，歡迎評論留言。

寫在最後：發博文的時候我真的反覆測試可以執行，但依然有小夥伴遇到問題，好吧，那就把原始碼貼出來吧，

https://coding.net/u/yewen456/p/ueditor/git 希望大家少複製貼上，能夠一步一步來，在遇到問題的時候，能夠沉下心來認真去思考。