UEditor 1.36 版本 jsp版上傳圖片自定義路勁配置

因爲項目須要，最近使用了ueditor，並實現了圖片以及文件的上傳功能。走了很多彎路，花了點時間總結總結，記錄一下以防忘記！

      1.去官網http://ueditor.baidu.com/website/download.html下載ueditor,我下載的是

    ueditor1_3_6-utf8-jsp版本的。

   二、把解壓出來的包中的jsp文件夾下的commons-fileupload-1.2.2.jar和ueditor.jar兩個架包放在項目中（存放位置依據項目 

   而定，本次使用的是maven項目，因此放在maven的中央倉庫中），而後再把 Uploader.java這個 上傳輔助類拿出來放在 項目的    公共包裏，便於引用。

   ---------------------------------------開始配置路勁----------------------------------------------------------

      1.如圖把上傳圖片放在我想要的file/ueditor的路勁上，而不是ueditor自定義的jsp/upload中

2.配置ueditor.config.js 以下圖

其中imageUrl基本不用動。

而imagePath是指，你圖片上傳成功後，點確認時，在ueditor編輯器裏顯示圖片的地址（就是那個你點源碼後，顯示<img 

src="xxx"/>引用的圖片所在路勁。由於個人圖片地址是在項目下的file/ueditor路勁，直接引用的相對路勁，因此沒有配置，但必

需要給個空，不然上傳成功後圖片沒法顯示），如圖

savePath是圖片保存所在的文件夾的名稱（個人就是ueditor）,當你修改savePath的值，必須也要同時修改jsp文件夾下的

config.properties裏面的savePath的值，須要配置相同的值，不然 點上傳的時候後報「非法路勁錯誤」錯誤

3 接下來須要配置 imageUp.jsp實現自定義的路勁

找到imageUp.jsp中的up.setSavePath(dir );將其修改成你定義的路勁，如圖

由於我在ueditor.config.js和config.properties裏已經定義了保存圖片所在文件夾的名稱 ueditor ,因此此處只須要加個 file/就能夠了。

4.下面就是配置 Uploader.java上傳輔助類了

   ㈠。首先須要在 Uploader.java 找到 savePath，改成你的定義路勁，如圖

   ㈡。再接着修改Uploader.java下的 getPhysicalPath()方法，如圖

①. ueditor自帶的getPhysicalPath（）方法，返回的realPath路勁是

D:\MyEclipse3.5\WORKSPACE\您的項目名\src\main\webapp\ueditor\jsp\imageUp.jsp這樣的絕對路勁，

而最後 new File(realPath).getParent() + "/" + path;

返回的是D:\MyEclipse3.5\WORKSPACE\您的項目名\src\main\webapp\ueditor\jsp\file\ueditor,因此最後 建立的文件File是在ueditor/jsp下面

②.由於 我自定義的 文件路勁是項目下的 file/ueditor ,我須要

D:\MyEclipse3.5\WORKSPACE\您的項目名\src\main\webapp\file\ueditor樣的一個路勁 去建立File。

因此我重寫了getPhysicalPath（）方法直接得到 項目下的路勁。

㈢。最後就是修改 Uploader.java下的getFolder()方法（只是個人項目須要修改，若是項目中沒有須要能夠不用修改這個方法直接跳過就好），如圖

這一步是在你定義的路勁後面追加一個以當前日期爲名稱的子文件夾（例如：file/ueditor/2014-1-1）,由於我不須要因此直接註釋了追加 當前日期 的方法。

5.這樣就配置完成了，能夠上傳圖片了額

上傳成功時 ，在imageUp.jsp裏最後 up.getUrl() 返回的圖片路勁就是 咱們配置的file/ueditor/78751388636301772.png了。

最後一步 當你點確認的時候，就須要上面在 ueditor.config.js裏配置的imagePath的路勁把圖片顯示在編輯器裏了，

ueditor內部就把咱們配置 的imagePath追加在返回的up.getUrl()前面！

由於個人須要 因此這是上面imagePath給空的緣由了。。。。。。。。。下面就能夠顯示圖片啦

最後在追加個剛測出的問題 ，就是上面ueditor.config.js中imagePath我是給的空值，這樣會在你預覽的時候 圖片顯示路勁會不正確！會在你返回的路勁前面 追加上 ueditor/dialogs/preview，因此爲了解決這個問題，我仍是在imagePath加了項目名稱。

可是又擔憂之後項目名變動，因此 就是用了js 動態獲取項目名稱：

    var pathName=window.document.location.pathname;

    //獲取帶"/"的項目名，如：/uimcardprj

    var projectName=pathName.substring(0,pathName.substr(1).indexOf('/')+1);

修改以下圖：