①在ckeditor官網下載zip https://ckeditor.com/ 博主的版本是4.9.2的。
②修改ckeditor目錄下的config.js文件
/**
* @license Copyright (c) 2003-2018, CKSource - Frederico Knabben. All rights reserved.
* For licensing, see https://ckeditor.com/legal/ckeditor-oss-license
*/
CKEDITOR.editorConfig = function( config ) {
config.removePlugins = 'elementspath';
config.enterMode = CKEDITOR.ENTER_BR;
config.shiftEnterMode = CKEDITOR.ENTER_P;
/*將編輯器的語言設置爲中文*/
config.language = 'zh-cn';
/*隱藏超鏈接與高級選項*/
config.removeDialogTabs = 'image:advanced;image:Link';
/*開啓工具欄“圖像”中文件上傳功能,後面的url爲圖片上傳要指向的的action或servlet*/
config.filebrowserImageUploadUrl= "ckeditorUpload.action";
config.toolbar = 'MyToolbar';
config.toolbar_MyToolbar =
[
{ name: 'document', items : [ 'DocProps','Templates' ] },
{ name: 'clipboard', items : [ 'Cut','Copy','Paste','PasteText','PasteFromWord','-','Undo','Redo' ] },
{ name: 'editing', items : [ 'Find','Replace','-','SelectAll','-','SpellChecker', 'Scayt' ] },
'/',
{ name: 'basicstyles', items : [ 'Bold','Italic','Underline','Strike','-','RemoveFormat' ] },
{ name: 'paragraph', items : [ 'NumberedList','BulletedList','-','Outdent','Indent','-',
'-','JustifyLeft','JustifyCenter','JustifyRight','JustifyBlock','-','BidiLtr','BidiRtl' ] },
{ name: 'links', items : [ 'Link','Unlink','Anchor' ] },
{ name: 'insert', items : [ 'Image','Flash','Table','HorizontalRule','Smiley','SpecialChar' ] },
'/',
{ name: 'styles', items : [ 'Styles','Format','Font','FontSize' ] },
{ name: 'colors', items : [ 'TextColor','BGColor' ] },
{ name: 'tools', items : [ 'Maximize' ] }
];
config.font_names = '宋體/SimSun;新宋體/NSimSun;仿宋/FangSong;楷體/KaiTi;仿宋_GB2312/FangSong_GB2312;'+
'楷體_GB2312/KaiTi_GB2312;黑體/SimHei;華文細黑/STXihei;華文楷體/STKaiti;華文宋體/STSong;華文中宋/STZhongsong;'+
'華文仿宋/STFangsong;華文彩雲/STCaiyun;華文琥珀/STHupo;華文隸書/STLiti;華文行楷/STXingkai;華文新魏/STXinwei;'+
'方正舒體/FZShuTi;方正姚體/FZYaoti;細明體/MingLiU;新細明體/PMingLiU;微軟雅黑/Microsoft YaHei;微軟正黑/Microsoft JhengHei;'+
'Arial Black/Arial Black;'+ config.font_names;
};
③創建Strut2 圖片上傳處理action。注意ckeditor4.5以後圖片處理結果直接返回json數據了。成功的話需要返回uploaded=1,fileName,url三個信息。失敗的話返回:uploaded=0和錯誤信息提示message兩個字段。圖片上傳類參考了網上網友的代碼。json數據封裝用了阿里巴巴的fastjson
package com.fxzgy.ckeditor;
import java.io.File;
import java.io.FileInputStream;
import java.io.FileOutputStream;
import java.io.IOException;
import java.io.InputStream;
import java.io.OutputStream;
import java.io.PrintWriter;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import org.apache.struts2.ServletActionContext;
import com.alibaba.fastjson.JSONObject;
import com.fxzgy.util.DateUtil;
import com.opensymphony.xwork2.ActionSupport;
/**
*
* @ClassName: CkeditorUpload
* @Description: ckeditor圖片上傳
* @author YuJianyou
* @date 2018年8月4日 下午6:42:24
*
*/
public class CkeditorUpload extends ActionSupport {
/**
* @Fields serialVersionUID : TODO
*/
private static final long serialVersionUID = 1L;
// 文件
private File upload;
// 類型
private String uploadContentType;
// 文件名
private String uploadFileName;
@Override
public String execute() throws IOException {
// 獲取服務器根路徑
HttpServletRequest request = ServletActionContext.getRequest();
HttpServletResponse response = ServletActionContext.getResponse();
response.setCharacterEncoding("UTF-8");
String msg = "";
PrintWriter out = response.getWriter();
JSONObject result = new JSONObject();
String expandedName = ""; // 文件擴展名
if (uploadContentType.equals("image/pjpeg") || uploadContentType.equals("image/jpeg")) {
expandedName = ".jpg";
} else if (uploadContentType.equals("image/png") || uploadContentType.equals("image/x-png")) {
expandedName = ".png";
} else if (uploadContentType.equals("image/gif")) {
expandedName = ".gif";
} else if (uploadContentType.equals("image/bmp")) {
expandedName = ".bmp";
} else {
msg = "文件格式不正確(必須爲.jpg/.gif/.bmp/.png文件)!";
result.put("uploaded", 0);
JSONObject errorObj = new JSONObject();
errorObj.put("message", msg);
result.put("error", errorObj);
out.println(result.toJSONString());
return null;
}
if (upload.length() > 1024 * 1024 * 2) {
msg = "文件大小不得大於2M!";
result.put("uploaded", 0);
JSONObject errorObj = new JSONObject();
errorObj.put("message", msg);
result.put("error", errorObj);
out.println(result.toJSONString());
return null;
}
InputStream is = new FileInputStream(upload);
String uploadPath = request.getSession().getServletContext().getRealPath("ckeditorImg" + DateUtil.getDirDate());
File dirfile = new File(uploadPath);
if (!dirfile.exists()) {
dirfile.mkdirs();
}
String fileName = DateUtil.getDate() + expandedName; // 採用時間+UUID的方式隨即命名
File toFile = new File(uploadPath, fileName);
OutputStream os = new FileOutputStream(toFile);
byte[] buffer = new byte[1024];
int length = 0;
while ((length = is.read(buffer)) > 0) {
os.write(buffer, 0, length);
}
// 圖片Url
String imageUrl = request.getContextPath() + "/" + "ckeditorImg" + DateUtil.getDirDate() + "/" + fileName;
result.put("uploaded", 1);
result.put("fileName", fileName);
result.put("url", imageUrl);
out.println(result.toJSONString());
is.close();
os.close();
return null;
}
/* get-------set ------------------ */
public File getUpload() {
return upload;
}
public void setUpload(File upload) {
this.upload = upload;
}
public String getUploadContentType() {
return uploadContentType;
}
public void setUploadContentType(String uploadContentType) {
this.uploadContentType = uploadContentType;
}
public String getUploadFileName() {
return uploadFileName;
}
public void setUploadFileName(String uploadFileName) {
this.uploadFileName = uploadFileName;
}
}
DateUtil.java
package com.fxzgy.util;
import java.util.Calendar;
public class DateUtil {
public static String getDate() {
Calendar calendar = Calendar.getInstance();
int y = calendar.get(Calendar.YEAR);
int m = calendar.get(Calendar.MONTH);
int d = calendar.get(Calendar.DATE);
int h = calendar.get(Calendar.HOUR);
int mi = calendar.get(Calendar.MINUTE);
int s = calendar.get(Calendar.SECOND);
StringBuffer sb = new StringBuffer("");
sb.append(y);
sb.append(m + 1);
sb.append(d);
sb.append(h);
sb.append(mi);
sb.append(s);
String date = sb.toString();
return date;
}
public static String getDirDate() {
Calendar calendar = Calendar.getInstance();
int y = calendar.get(Calendar.YEAR);
int m = calendar.get(Calendar.MONTH);
int d = calendar.get(Calendar.DATE);
StringBuffer sb = new StringBuffer("");
sb.append(y);
sb.append(m + 1);
sb.append(d);
String date = sb.toString();
return date;
}
}
struts.xml
<action name="ckeditorUpload" class="com.fxzgy.ckeditor.CkeditorUpload" >
</action>
記錄一下困擾了已久的問題,希望能幫助你們。