ueditor 圖片外部存儲和回顯

一、先導入Ueditor解壓後的文件，導入的文件名最好就ueditor，否則有些東西它默認配置是Ueditor下面找，很容易形成有些東西用不了。固然有些東西用不到我沒有沒去篩選。

本人用的是1.4.3版本

2.maven項目須要將jar包引入，ueditor自己下載下來也有所依賴的jar ,在jsp/lib/下邊

關於ueditor的jar ,能夠用如下2個，我的比較推薦用下邊的，上邊的有部分電腦可能會出現下載不下來的狀況。

三、配置js，

 網上看了不少要改config.json 裏面的imageUrlPrefix 地址和imagePathFormat地址 ，本人沒有進行改動

在 ueditor.config.js 當中將  var URL = window.UEDITOR_HOME_URL || "/項目名/ueditor/"; 作了些許改動。也對一些用不到的toolbers 圖標給刪除了 ，別的基本沒作改動

4.界面邏輯和後臺處理

圖片的文件的上傳都會走這個方法，serviceImpl的代碼以下 ： 這個代碼忘了是從那位大神那邊借鑑的了 ，稍微改了一些東西，大致的思路仍是沒作改變

public Map<String, Object> fileupload(HttpServletRequest req) {
Map<String,Object> result = new HashMap<String, Object>();
MultipartHttpServletRequest mReq = null;
MultipartFile file = null;
InputStream is = null ;
String fileName = "";
// 原始文件名 UEDITOR建立頁面元素時的alt和title屬性
String originalFileName = "";
String filePath = "";
try {
mReq = (MultipartHttpServletRequest)req;
// 從config.json中取得上傳文件的ID
file = mReq.getFile("upfile");
// 取得文件的原始文件名稱
fileName = file.getOriginalFilename();
originalFileName = fileName;
if(!StringUtils.isEmpty(fileName)){
is = file.getInputStream();
fileName = FileUtils.reName(fileName);
filePath = FileUtils.saveFile(fileName, is, this.filePathConfig.getImagesPath());//imagePaht 就是文件的存儲路徑
} else {
throw new IOException("文件名爲空!");
}
result.put("state", "SUCCESS");// UEDITOR的規則:不爲SUCCESS則顯示state的內容
result.put("url",httpPath + filePath);//httpPath=http://IP:端口/映射名/
result.put("title", originalFileName);
result.put("original", originalFileName);
}
catch (Exception e) {
//System.out.println(e.getMessage());
result.put("state", "文件上傳失敗!");
result.put("url","");
result.put("title", "");
result.put("original", "");
// System.out.println("文件 "+fileName+" 上傳失敗!");
}

return result;
}

this.filePathConfig.getImagesPath() 關於imagesPath的存儲路徑就是/webApp/sentiment/的路徑

由於項目當中配置了nginx的動靜分離，因此我在nginx的配置文件裏面也配置了一個映射關係，將訪問地址中含/Image/xxx 的方法映射到我本地E:/webApp/sentiment/問見夾下

上文當中fileUtils當中的方法

/**
* 給文件重命名 防止覆蓋
* @param fileName
* @return 時間戳+原始文件的後綴
*/
public static String reName(String fileName){
return new StringBuffer().append(new Date().getTime()).append(fileName.substring(fileName.indexOf("."))).toString();
}

/**
* 文件保存
* @param fileName 
* @param content
* @param filePath 文件保存路徑
* @return
* @throws IOException
*/
public static String saveFile(String fileName,InputStream content,String filePath) throws IOException {
FileOutputStream fos = null;
StringBuffer contentPath = new StringBuffer("");; // 上下文地址
try {
contentPath.append("/");
contentPath.append(fileName); //

File pictureFile = new File(filePath + contentPath.toString());
File pf = pictureFile.getParentFile();
if(!pf.exists()){
pf.mkdirs();
}
pictureFile.createNewFile(); // 建立文件
fos = new FileOutputStream(pictureFile);
FileUtils.copy(content, fos);
} catch (Exception e) {
throw new IOException("文件保存失敗!");
} finally {
if (fos != null) {
try {
fos.close();
} catch (Exception e) {
throw new IOException("文件保存失敗!");
}
}
}
return contentPath.toString();
}

/**
* 文件copy方法
* @param src
* @param dest
*/
public static void copy(InputStream src, OutputStream dest) {
try {
byte[] tmp = new byte[1024];
int len = -1;
while ((len = src.read(tmp)) != -1)
dest.write(tmp, 0, len);
} catch (IOException e) {
throw new RuntimeException(e);
}
}

 固然必不可少的是對數據的保存入庫，那個就很簡單了，就不在這詳述了。

最後，若是哪位大牛對ueditor自帶的截圖工具備研究的話，能夠告訴我那個東西怎麼用，我研究了很久，電腦安裝上也用不了，只能把那個功能屏蔽了。

或者哪位對重寫那個截圖方法有研究的話也能夠告訴小弟，本人將不勝感激。

但願本人寫的東西能對和我同樣初次接觸ueditor的人有所幫助。