ueditor jsp版 在SSH2專案中使用小結
阿新 • • 發佈：2019-01-07
最近專案涉及富文字框功能，一番調研後，決定使用ueditor。因其文件齊全，且出自百度，放心!
看了官方文件，也看了不少兄弟的部落格，踩了一些坑，在此記錄下。
主要關注幾個檔案：
1、jsp/config.json（上傳檔案、塗鴉、圖片、視訊等路徑配置）
2、controller.jsp（內部action統一轉發）
3、ueditor.config.js（預設配置）
4、ueditor.all.js/ueditor.all.min.js
一、簡介
下載開發版本jsp-utf8版本，下載的zip包解壓後，重新命名utf8-jsp為editor，
然後將其拷貝到專案中，我放的路徑為WebRoot/plugin/下 
四、修改檔案 jsp/config.json（主要是配置圖片、檔案、視訊上傳路徑等）
該配置檔案上傳路徑為/upload/notice/image/...
注意：各個配置的“*UrlPrefix”（回顯時自動新增url的字首）、“*PathFormat"（檔案上傳路徑）
config.json最後部分，配置檔案、圖片線上回顯路徑（只需要配置跟路徑，會自動回顯根路徑下所有路徑的檔案，此處路徑需對照前面檔案儲存路徑處理） 
五、修改jsp/controller.jsp 該檔案主要是實現所有請求入口，可在此檔案對請求Action進行過濾處理
三、修改檔案 ueditor.config.js 注意： var URL = window.UEDITOR_HOME_URL || "/abc/plugin/ueditor/"; , serverUrl: URL + "jsp/controller.jsp"（abc表示專案部署跟目錄）<head> …… <!--編輯器基本配置--> <script type="text/javascript" src="plugin/ueditor/ueditor.config.js"></ script> <!--編輯器完整程式碼--> <script type="text/javascript" src="plugin/ueditor/ueditor.all.js"> </script > …… </head> <body> <div> <script id="editor" type="text/plain"></ script> </div> <script type="text/javascript"> //例項化編輯器 var ue = UE.getEditor( 'editor', { autoHeightEnabled: true, autoFloatEnabled: true, initialFrameWidth: 690, initialFrameHeight:483 }); </script>
四、修改檔案 jsp/config.json（主要是配置圖片、檔案、視訊上傳路徑等）
該配置檔案上傳路徑為/upload/notice/image/...
注意：各個配置的“*UrlPrefix”（回顯時自動新增url的字首）、“*PathFormat"（檔案上傳路徑）
config.json最後部分，配置檔案、圖片線上回顯路徑（只需要配置跟路徑，會自動回顯根路徑下所有路徑的檔案，此處路徑需對照前面檔案儲存路徑處理）
五、修改jsp/controller.jsp 該檔案主要是實現所有請求入口，可在此檔案對請求Action進行過濾處理
<%
request.setCharacterEncoding( "utf-8" );
response.setHeader("Content-Type" , "text/html");
String rootPath = application.getRealPath( "/" );
// out.write( new ActionEnter( request, rootPath ).exec() );
String result = new ActionEnter( request, rootPath ).exec();
String action = request.getParameter("action");
//圖片、附件線上管理中回顯時，格式化回顯路徑，否則無法正常格式化
if( action!=null && (action.equals("listfile") || action.equals("listimage"))){
rootPath = rootPath.replace("\\", "/");
result = result.replaceAll(rootPath, "/");
}
out.write( result );
%>