SSM框架 Jsp整合富文本編輯器ueditor 圖片上傳

一直以來都沒有成功過 這次又要用到了 就重新去配置整合 終於成功了 也對項目已經整合配置步驟熟悉了 記錄下來以後需要能看看 可以先看一遍在去配置 後面兩步可能遇到也可能遇不到 所以就放到最後了

工具/原料

Java web開發環境
ssm+maven框架項目的哦
ueditor1_4_3_3-utf8-jsp壓縮包

方法/步驟

首先我們將壓縮包解壓縮 然後打開重命名(自定義簡明一點就好)

然後將其複製到webapps文件夾下 (放在其他地方也可以,個人感覺這個路徑簡單)

然後在pom配置文件中加入如圖所示的包引入代碼(這裡是maven項目,如果不是可以直接Build Path引入)

這裡ueditor.config.js 22行修改為你的項目瀏覽器訪問路徑直到剛剛拷貝進來的文件夾哦 如圖所示

然後在config.json文件中將imageUrlPrefix的值修改為你的項目瀏覽器訪問路逕到項目名稱結束(和上一步不一樣哦,我這裡是少一級)

此時運行控制台會出現找不到文件夾,頁面無法顯示等錯誤 只需要在web配置文件中加入這些即可(原因是過濾器將靜態文件過濾了,當然可以在spring-mvc中加入一些代碼,建議這裡加哦)

然後在你項目中需要用到的地方加入紅框中的代碼 TEXTAREA的name屬性的值就是你的欄位的值哦

然後我在後台的獲取代碼如圖所示 如果成功就會寫入到資料庫中了

如圖所示 這裡是我們運行後頁面的效果  輸入數據自己修改格式 點擊圖片上傳(多圖上傳也可以) 然後圖片就顯示到編輯框中了 點擊提交

這裡是提交後寫入到資料庫 然後讀取出來的哦 (就不詳細貼代碼了)

最後如果你的上傳單個圖片按鈕不能點擊  將編輯器文件夾下的包複製到項目的lib文件夾中就可以了 紅框中的就可以了 其他的應該已經存在了 配置到此結束 希望你能夠成功哦

如圖所示 如果你複製到項目中後出現紅叉 別慌直接右鍵單擊該文件多個也可以然後依次選擇如圖所示的選項 即可

注意事項

說實話我對這個配置還不能說很精通 算是誤打誤撞配置好了 就改了這些地方其他的沒動
如果幫到你了 點個讚哦 有什麼疑問可以提出來 共勉

本文內容整理自網絡, 文中所有觀點看法不代表淘大白的立場