html5編輯器本地保存圖片不顯示怎么解決

這篇文章主要介紹“html5編輯器本地保存圖片不顯示怎么解決”，在日常操作中，相信很多人在html5編輯器本地保存圖片不顯示怎么解決問題上存在疑惑，小編查閱了各式資料，整理出簡單好用的操作方法，希望對大家解答”html5編輯器本地保存圖片不顯示怎么解決”的疑惑有所幫助！接下來，請跟著小編一起來學習吧！

　　用Eclipse開發WEB項目的時候，使用到了Ueditor上傳圖片的功能，插件會自動將上傳的圖片保存在Eclipse工作目錄下，這種保存的方式非常不利于后續對圖片的操作(管理)，這時我們就要修改Ueditor的源碼，解決上傳圖片時的路徑問題。

　　1、下載ueditor源碼并引用到工程

　　將jsp/src/目錄下的所有文件拷貝到你的工程下

　　目錄視圖

　　將ueditor-1.1.2.jar刪除，只引用前四個jar包

　　2、修改Tomcat服務器配置，添加圖片映射路徑

　　在tomcat中添加圖片的絕對路徑和圖片訪問虛擬路徑

　　修改config.json配置文件，訪問路徑填寫剛配置的虛擬目錄

　　3、創建配置文件(可省略)

　　在src目錄下創建config.properties ，存放圖片路徑

　　讀配置文件的目的是為了動態修改保存路徑，可以更方便的管理圖片

　　創建ConfigUtil.java類，用于讀取配置文件

　　import java.io.IOException;

　　import java.io.InputStream;

　　import java.io.InputStreamReader;

　　import java.util.Properties;

　　public class ConfigUtil {

　　private static Properties pro;

　　static{

　　pro=new Properties();

　　//默認從類的所在包目錄開始查找資源文件

　　//如果要classpath的根目錄開始找，必須加上/

　　//默認從classspath的根目錄開始查找資源文件

　　InputStream input=ConfigUtil.class

　　.getClassLoader()

　　.getResourceAsStream("config.properties");

　　try {

　　pro.load(new InputStreamReader(input,

　　"UTF-8"));

　　} catch (IOException e) {

　　e.printStackTrace();

　　}finally{

　　if(input!=null){

　　try {

　　input.close();

　　} catch (IOException e) {

　　e.printStackTrace();

　　}

　　}

　　}

　　}

　　public static String get(String key){

　　return pro.getProperty(key);

　　}

　　public static int getInt(String key){

　　return Integer.parseInt(pro.getProperty(key));

　　}

　　}

　　4、修改源碼(修改圖片保存路徑)

　　選中項目，使用Eclipse文件搜索功能

　　搜索 physicalPath

　　找到在3個類中使用到了 physicalPath

　　這里有3個類的是要修改源碼的

　　//注釋掉原來的路徑代碼

　　//String physicalPath = this.rootPath + savePath;

　　使用自定義的路徑(這個路徑是通過配置文件讀取的,相當于取代源碼中的this.savePath)

　　注意：ConfigUtil.get("savepath") ，字段名必須一樣，否則讀取不了

　　ImageHunter.java

　　Base64Uploader.java

　　BinaryUploader.java

　　5、測試：

　　往編輯器添加一張圖片

　　再來看看圖片保存目錄

　　通過改源碼的方式就能成功對圖片進行統一管理了。

　　6、在strtus中使用Ueditor編輯器需要注意

　　如果配置文件中配置了過濾所有的請求，需要將其設置成只過濾.action的請求，否則導致文件保存不成功的情況。

到此，關于“html5編輯器本地保存圖片不顯示怎么解決”的學習就結束了，希望能夠解決大家的疑惑。理論與實踐的搭配能更好的幫助大家學習，快去試試吧！若想繼續學習更多相關知識，請繼續關注億速云網站，小編會繼續努力為大家帶來更多實用的文章！