看了很多文章其實也有很多辦法，實現跨域上傳。現在講我目前所用的方法。只實現的多圖上傳。單圖上傳失敗。
接下來必須認真的看完文章。
當前我用的 版本爲UEditor1.4.3。
這裏主要是實現重寫接收文件的action（controller）.
建議查看官方文檔瞭解頁面上請求時傳的是那些參數（數據）以及返回格式
http://fex.baidu.com/ueditor/#dev-request_specification
瞭解差不多了。現在開始配置。
現有項目A，B. 其中，A爲前端需要選擇文件上的富文本框。B 項目爲接受文件且返回數據。
首先 A ，B，項目必須引入百度富文本包
<dependency>
<groupId>cn.songxinqiang</groupId>
<artifactId>com.baidu.ueditor</artifactId>
<version>1.4.3</version>
</dependency>
第二步，A項目中 下載百度富文本組件ueditor。B項目中在webapp 引入 ueditor富文本的 config.json 文件做用於配置返回正確的文件路徑
第三步，在A項目中富文本組件的 ueditor.config.js 文件中的,
serverUrl: URL + "jsp/controller.jsp" 改爲項目B的請求action 比如 serverUrl:"http://127.0.0.1:8080/fileserver/ueditorUpload.action" ,這樣你發現。A項目的百度富文本只要有任何操作都會經過此鏈接。
第四步。只管寫B項目中ueditorUpload()接受方法以及配置 config.json 裏面的參數
項目B的框架中用到了struts2版本 2.3.37。所以action這樣寫
private File upfile; // upfile 爲百度富文本圖片上傳對象
/**
* 百度富文本上傳url
*/
public void ueditorUpload() throws Exception{
String json = null;
request.setCharacterEncoding( "utf-8" );
response.setHeader("Content-Type" , "text/html");
response.setHeader("Access-Control-Allow-Methods", "*");
//必須指定那個服務器上傳的ip或域名
response.setHeader("Access-Control-Allow-Origin", "*");
//支持跨域上傳
response.setHeader("Access-Control-Allow-Headers", "X-Requested-With,X_Requested_With");
// String rootPath = application.getRealPath( "/" );
// String rootPath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+request.getContextPath();
// String rootPath = getClasspath();
String rootPath = request.getSession().getServletContext().getRealPath("")+File.separator;
System.out.println("-------------------請求參數--------------------");
Enumeration paramNames = request.getParameterNames();
while (paramNames.hasMoreElements()) {
String name =(String) paramNames.nextElement();
String value = request.getParameter(name);
System.out.println(name+"="+value);
}
Map<String, String> map = new HashMap<String, String>();
String action_name = request.getParameter("action") ==null?"": request.getParameter("action");
switch (action_name.trim().toLowerCase()) {
case "uploadimage"://上傳圖片
if(upfile!=null ) {
String fileName = request.getParameter("name") ==null?"": request.getParameter("name");
//判斷非空
if(!Handle.isNull(fileName)) {
String suffix = fileName.substring(fileName.lastIndexOf("."),fileName.length()).replace(".","");//後綴名
if("jpeg".equals(suffix.toLowerCase()) || "jpg".equals(suffix.toLowerCase())|| "png".equals(suffix.toLowerCase()) || "gif".equals(suffix.toLowerCase())) {
//獲取要保存文件夾的物理路徑(絕對路徑)
String path = "/uploadFiles/uploadImgs"+File.separator + new SimpleDateFormat("yyyyMMdd").format(new Date());
String realPath = ServletActionContext.getServletContext().getRealPath(path);
File files = new File(realPath);
//測試此抽象路徑名錶示的文件或目錄是否存在。若不存在，創建此抽象路徑名指定的目錄，包括所有必需但不存在的父目錄。
if(!files.exists()) {files.mkdirs();}
try {
String name = UUID.randomUUID().toString().trim().replaceAll("-", "");
//保存文件
FileUtils.copyFile(upfile, new File(files,name+"."+suffix));
if(!new File(realPath+File.separator+name+"."+suffix).exists()) {
map.put("ErrorMsg", "上傳失敗，文件未上傳成功");
}else {
String basePath = path+File.separator+name+"."+suffix;
map.put("url", basePath);
map.put("state", "SUCCESS");
map.put("title", name+"."+suffix);
map.put("original", name+"."+suffix);
//返回json 格式
// {
// "state": "SUCCESS",
// "url": "upload/demo.jpg",
// "title": "demo.jpg",
// "original": "demo.jpg"
// }
json = JSONArray.fromObject(map).toString();
json = json.substring(1,json.length()-1);
}
} catch (IOException e) {
e.printStackTrace();
}
}else {
json = new ActionEnter(request, rootPath).exec();
}
}else{
json = new ActionEnter(request, rootPath).exec();
}
}else {
json = new ActionEnter(request, rootPath).exec();
}
break;
default:
json = new ActionEnter(request, rootPath).exec();
break;
}
// System.out.println("---"+json);
PrintWriter out = null;
response.setCharacterEncoding("utf-8");
try {
out = response.getWriter();
} catch (IOException e) {
// TODO Auto-generated catch block
e.printStackTrace();
}finally {
out.write(json);
}
}
public File getUpfile() {
return upfile;
}
public void setUpfile(File upfile) {
this.upfile = upfile;
}
如果你是springmvc的方式上傳可參考
@RequestMapping(value ="upload")
public String uploadImage(HttpServletRequest request,HttpServletResponse response)throws IllegalStateException, IOException{
response.setContentType("text/html;charset=UTF-8");
request.setCharacterEncoding( "utf-8" );
response.setHeader("Content-Type" , "text/html");
response.setHeader("Access-Control-Allow-Methods", "*");
//必須指定那個服務器上傳的ip或域名
response.setHeader("Access-Control-Allow-Origin", "*");
//支持跨域上傳
response.setHeader("Access-Control-Allow-Headers", "X-Requested-With,X_Requested_With");
// 轉型爲MultipartHttpRequest：
MultipartHttpServletRequest multipartRequest=(MultipartHttpServletRequest) request;
// 獲得文件：
MultipartFile file = multipartRequest.getFile("upfile");
/***剩下的是你保存文件以及返回什麼格式的json***/
}
以上不知道改返回什麼格式的請看文章開頭的官方文檔地址
最後配置B項目中的 config.json
/* 前後端通信相關的配置,註釋只允許使用多行方式 */
{
/* 上傳圖片配置項 */
"imageActionName": "uploadimage", /* 執行上傳圖片的action名稱 */
"imageFieldName": "upfile", /* 提交的圖片表單名稱 */
"imageMaxSize": 2048000, /* 上傳大小限制，單位B */
"imageAllowFiles": [".png", ".jpg", ".jpeg", ".gif", ".bmp"], /* 上傳圖片格式顯示 */
"imageCompressEnable": true, /* 是否壓縮圖片,默認是true */
"imageCompressBorder": 1600, /* 圖片壓縮最長邊限制 */
"imageInsertAlign": "none", /* 插入的圖片浮動方式 */
"imageUrlPrefix": "http://127.0.0.1:8080/fileserver", /* 圖片訪問路徑前綴 */
"imagePathFormat": "/uploadFiles/uplouploadImgsdImgs/{yyyy}{mm}{dd}/{time}{rand:6}", /* 上傳保存路徑,可以自定義保存路徑和文件名格式 */
/* {filename} 會替換成原文件名,配置這項需要注意中文亂碼問題 */
/* {rand:6} 會替換成隨機數,後面的數字是隨機數的位數 */
/* {time} 會替換成時間戳 */
/* {yyyy} 會替換成四位年份 */
/* {yy} 會替換成兩位年份 */
/* {mm} 會替換成兩位月份 */
/* {dd} 會替換成兩位日期 */
/* {hh} 會替換成兩位小時 */
/* {ii} 會替換成兩位分鐘 */
/* {ss} 會替換成兩位秒 */
/* 非法字符 \ : * ? " < > | */
/* 具請體看線上文檔: fex.baidu.com/ueditor/#use-format_upload_filename */
/* 塗鴉圖片上傳配置項 */
"scrawlActionName": "uploadscrawl", /* 執行上傳塗鴉的action名稱 */
"scrawlFieldName": "upfile", /* 提交的圖片表單名稱 */
"scrawlPathFormat": "/ueditor/jsp/upload/image/{yyyy}{mm}{dd}/{time}{rand:6}", /* 上傳保存路徑,可以自定義保存路徑和文件名格式 */
"scrawlMaxSize": 2048000, /* 上傳大小限制，單位B */
"scrawlUrlPrefix": "http://127.0.0.1:8080/fileserver", /* 圖片訪問路徑前綴 */
"scrawlInsertAlign": "none",
/* 截圖工具上傳 */
"snapscreenActionName": "uploadimage", /* 執行上傳截圖的action名稱 */
"snapscreenPathFormat": "/ueditor/jsp/upload/image/{yyyy}{mm}{dd}/{time}{rand:6}", /* 上傳保存路徑,可以自定義保存路徑和文件名格式 */
"snapscreenUrlPrefix": "http://127.0.0.1:8080/fileserver", /* 圖片訪問路徑前綴 */
"snapscreenInsertAlign": "none", /* 插入的圖片浮動方式 */
/* 抓取遠程圖片配置 */
"catcherLocalDomain": ["127.0.0.1", "localhost", "img.baidu.com"],
"catcherActionName": "catchimage", /* 執行抓取遠程圖片的action名稱 */
"catcherFieldName": "source", /* 提交的圖片列表表單名稱 */
"catcherPathFormat": "/ueditor/jsp/upload/image/{yyyy}{mm}{dd}/{time}{rand:6}", /* 上傳保存路徑,可以自定義保存路徑和文件名格式 */
"catcherUrlPrefix": "http://127.0.0.1:8080/fileserver", /* 圖片訪問路徑前綴 */
"catcherMaxSize": 2048000, /* 上傳大小限制，單位B */
"catcherAllowFiles": [".png", ".jpg", ".jpeg", ".gif", ".bmp"], /* 抓取圖片格式顯示 */
/* 上傳視頻配置 */
"videoActionName": "uploadvideo", /* 執行上傳視頻的action名稱 */
"videoFieldName": "upfile", /* 提交的視頻表單名稱 */
"videoPathFormat": "/ueditor/jsp/upload/video/{yyyy}{mm}{dd}/{time}{rand:6}", /* 上傳保存路徑,可以自定義保存路徑和文件名格式 */
"videoUrlPrefix": "http://127.0.0.1:8080/fileserver", /* 視頻訪問路徑前綴 */
"videoMaxSize": 102400000, /* 上傳大小限制，單位B，默認100MB */
"videoAllowFiles": [
".flv", ".swf", ".mkv", ".avi", ".rm", ".rmvb", ".mpeg", ".mpg",
".ogg", ".ogv", ".mov", ".wmv", ".mp4", ".webm", ".mp3", ".wav", ".mid"], /* 上傳視頻格式顯示 */
/* 上傳文件配置 */
"fileActionName": "uploadfile", /* controller裏,執行上傳視頻的action名稱 */
"fileFieldName": "upfile", /* 提交的文件表單名稱 */
"filePathFormat": "/ueditor/jsp/upload/file/{yyyy}{mm}{dd}/{time}{rand:6}", /* 上傳保存路徑,可以自定義保存路徑和文件名格式 */
"fileUrlPrefix": "http://127.0.0.1:8080/fileserver", /* 文件訪問路徑前綴 */
"fileMaxSize": 51200000, /* 上傳大小限制，單位B，默認50MB */
"fileAllowFiles": [
".png", ".jpg", ".jpeg", ".gif", ".bmp",
".flv", ".swf", ".mkv", ".avi", ".rm", ".rmvb", ".mpeg", ".mpg",
".ogg", ".ogv", ".mov", ".wmv", ".mp4", ".webm", ".mp3", ".wav", ".mid",
".rar", ".zip", ".tar", ".gz", ".7z", ".bz2", ".cab", ".iso",
".doc", ".docx", ".xls", ".xlsx", ".ppt", ".pptx", ".pdf", ".txt", ".md", ".xml"
], /* 上傳文件格式顯示 */
/* 列出指定目錄下的圖片 */
"imageManagerActionName": "listimage", /* 執行圖片管理的action名稱 */
"imageManagerListPath": "/ueditor/jsp/upload/image/", /* 指定要列出圖片的目錄 */
"imageManagerListSize": 20, /* 每次列出文件數量 */
"imageManagerUrlPrefix": "", /* 圖片訪問路徑前綴 */
"imageManagerInsertAlign": "none", /* 插入的圖片浮動方式 */
"imageManagerAllowFiles": [".png", ".jpg", ".jpeg", ".gif", ".bmp"], /* 列出的文件類型 */
/* 列出指定目錄下的文件 */
"fileManagerActionName": "listfile", /* 執行文件管理的action名稱 */
"fileManagerListPath": "/ueditor/jsp/upload/file/", /* 指定要列出文件的目錄 */
"fileManagerUrlPrefix": "", /* 文件訪問路徑前綴 */
"fileManagerListSize": 20, /* 每次列出文件數量 */
"fileManagerAllowFiles": [
".png", ".jpg", ".jpeg", ".gif", ".bmp",
".flv", ".swf", ".mkv", ".avi", ".rm", ".rmvb", ".mpeg", ".mpg",
".ogg", ".ogv", ".mov", ".wmv", ".mp4", ".webm", ".mp3", ".wav", ".mid",
".rar", ".zip", ".tar", ".gz", ".7z", ".bz2", ".cab", ".iso",
".doc", ".docx", ".xls", ".xlsx", ".ppt", ".pptx", ".pdf", ".txt", ".md", ".xml"
] /* 列出的文件類型 */
}
其中 "imageActionName": "uploadimage", /* 執行上傳圖片的action名稱 */
"imageUrlPrefix": "http://127.0.0.1:8080/fileserver", /* 圖片訪問路徑前綴 */ 項目B的訪問路徑
到這裏基本可以允許上傳了。在A項目中使用多圖上傳
另外推薦另一大牛寫的文章 ， 總能找到你想要的
https://blog.csdn.net/zzq900503/article/details/77540331