下載ueditor-jsp版的資源包，解壓並放到webapp目錄下
在要引入的jsp頁面引入js檔案
注*：不用引入css檔案
<script src="<c:url value="/model/ueditor/ueditor.config.js"></script>
<script src="<c:url value="/model/ueditor/ueditor.all.min.js"></script>
<script src="<c:url value="/model/ueditor/lang/zh-cn/zh-cn.js"></script>
複製程式碼ueditor.config.js中要做些常用的配置
// ueditor目錄所在專案下的絕對路徑，不配置的話，jsp頁面會引入不到ueditor編輯器
var URL = window.UEDITOR_HOME_URL || "/model/ueditor/";
// 編輯器的寬高設定
initialFrameWidth:'80%' //初始化編輯器寬度,預設1000
initialFrameHeight:400 //初始化編輯器高度,預設320
複製程式碼在form表單中加入textarea標籤
<textarea type="text" name="reportContent" id="reportContent"></textarea>
<script type="text/javascript">
UE.getEditor('reportContent')
UE.Editor.prototype._bkGetActionUrl = UE.Editor.prototype.getActionUrl
UE.Editor.prototype.getActionUrl = function (action) {
if (action === 'uploadimage' || action === 'uploadscrawl'
|| action === 'catchimage' || action === 'uploadfile') {
// 非同步檔案上傳路徑
return '${pageContext.request.contextPath}/report/user/upload';
} else {
return this._bkGetActionUrl.call(this, action)
}
}
</script>
複製程式碼後臺檔案上傳的介面
@RequestMapping("/upload")
public void upload(HttpServletRequest request, HttpServletResponse response) throws Exception {
JSONObject jsonObject = new JSONObject();
jsonObject.put("code", 1);
String path = "";
String path1 = "";
String path2 = "";
CommonsMultipartResolver multipartResolver = new CommonsMultipartResolver(request.getSession().getServletContext());
// 從session中獲取當前使用者資訊
User user = (User) request.getSession().getAttribute("user");
if (multipartResolver.isMultipart(request)) {
// MultipartHttpServletRequest multiRequest = (MultipartHttpServletRequest) request;
// 以上方法出現型別轉換異常時用如下方法代替
MultipartResolver resolver = new CommonsMultipartResolver(request.getSession().getServletContext());
MultipartHttpServletRequest multiRequest = resolver.resolveMultipart(request);
/////////////////////////////////////////////////
Iterator<?> iter = multiRequest.getFileNames();
while (iter.hasNext()) {
MultipartFile file = multiRequest.getFile(iter.next().toString());
if (file != null) {
// 檔名
String fileName = file.getOriginalFilename();
// 使用者名稱
String userName = user.getName();
// 判斷字尾
if (!(fileName.endsWith(".jpg") || fileName.endsWith(".png") || fileName.endsWith(".gif") || fileName.endsWith(".bmp") || fileName.endsWith(".jpeg")
|| fileName.endsWith(".JPG") || fileName.endsWith(".PNG") || fileName.endsWith(".GIF") || fileName.endsWith(".BMP") || fileName.endsWith(".JPEG"))) {
String uuid = UUID.randomUUID().toString().replaceAll("-", "");
String fileType = "jpg";
if (fileName.indexOf(".") > -1) {
fileType = fileName.substring(fileName.lastIndexOf("."));
}
// 檔案上傳本地路徑
path = "D://shihe/ICMS/user/" + userName + "/notice/file/" + uuid + fileType;
// tomcat對映的虛擬路徑
path2 = "/ICMS/user/" + userName + "/notice/file/" + uuid + fileType;
File newFile = new File(path);
if (!newFile.getParentFile().exists()) {
// 如果目標檔案所在的目錄不存在，則建立父目錄
newFile.getParentFile().mkdirs();
}
file.transferTo(new File(path));
jsonObject.put("state", "SUCCESS");
jsonObject.put("title", " ");
jsonObject.put("original", uuid + fileType);
jsonObject.put("url", path2);
} else {
String uuid = UUID.randomUUID().toString().replaceAll("-", "");
String fileType = "jpg";
if (fileName.indexOf(".") > -1) {
fileType = fileName.substring(fileName.lastIndexOf("."));
}
// 檔案上傳本地路徑，原圖
path = "D://shihe/ICMS/user/" + userName + "/notice/image/" + fileName;
// 壓縮後的圖片，檔名為uuid，和原圖在同一目錄下
path1 = "D://shihe/ICMS/user/" + userName + "/notice/image/" + uuid + fileType;
// tomcat虛擬路徑，與本地圖片路徑對映
path2 = "/ICMS/user/" + userName + "/notice/image/" + uuid + fileType;
File newFile = new File(path);
if (!newFile.getParentFile().exists()) {
// 如果目標檔案所在的目錄不存在，則建立父目錄
newFile.getParentFile().mkdirs();
}
file.transferTo(new File(path));
ImageUtils.scale2(path, path1, 200, 300, true);
// 返回狀態
jsonObject.put("state", "SUCCESS");
jsonObject.put("title", " ");
jsonObject.put("original", uuid + fileType);
jsonObject.put("url", path2);
}
}
}
}
response.setContentType("text/html;charset=utf-8");//設定頁面的字元編碼，解決介面顯示中文亂碼的問題；
response.setHeader("Content-Type", "text/html");
response.getWriter().write(jsonObject.toString());
}
複製程式碼ImageUtils.java程式碼
package com.shihe.ImageCenter.dmc.util.commons;
import javax.imageio.ImageIO;
import java.awt.*;
import java.awt.color.ColorSpace;
import java.awt.geom.AffineTransform;
import java.awt.image.*;
import java.io.File;
import java.io.IOException;
public class ImageUtils {
public static String IMAGE_TYPE_GIF = "gif";// 圖形交換格式
public static String IMAGE_TYPE_JPG = "jpg";// 聯合照片專家組
public static String IMAGE_TYPE_JPEG = "jpeg";// 聯合照片專家組
public static String IMAGE_TYPE_BMP = "bmp";// 英文Bitmap（點陣圖）的簡寫，它是Windows作業系統中的標準影象檔案格式
public static String IMAGE_TYPE_PNG = "png";// 可移植網路圖形
public static String IMAGE_TYPE_PSD = "psd";// Photoshop的專用格式Photoshop
public static void main(String[] args) {
// 1-縮放影象：
// 方法一：按比例縮放
ImageUtils.scale("d:/file/醫院排班表/醫院排班表_1.png", "d:/file/醫院排班表/111.png", 5, false);//測試OK
// 方法二：按高度和寬度縮放
/* ImageUtils.scale2("d:/1.jpg", "d:/2_scale2.jpg", 200, 300, true);//測試OK
// 2-切割影象：
// 方法一：按指定起點座標和寬高切割
ImageUtils.cut("e:/abc.jpg", "e:/abc_cut.jpg", 0, 0, 400, 400 );//測試OK
// 方法二：指定切片的行數和列數
ImageUtils.cut2("e:/abc.jpg", "e:/", 2, 2 );//測試OK
// 方法三：指定切片的寬度和高度
ImageUtils.cut3("e:/abc.jpg", "e:/", 300, 300 );//測試OK
// 3-影象型別轉換：
ImageUtils.convert("e:/abc.jpg", "GIF", "e:/abc_convert.gif");//測試OK
// 4-彩色轉黑白：
ImageUtils.gray("e:/abc.jpg", "e:/abc_gray.jpg");//測試OK
// 5-給圖片新增文字水印：
// 方法一：
ImageUtils.pressText("我是水印文字","e:/abc.jpg","e:/abc_pressText.jpg","宋體",Font.BOLD,Color.white,80, 0, 0, 0.5f);//測試OK
// 方法二：
ImageUtils.pressText2("我也是水印文字", "e:/abc.jpg","e:/abc_pressText2.jpg", "黑體", 36, Color.white, 80, 0, 0, 0.5f);//測試OK
// 6-給圖片新增圖片水印：
ImageUtils.pressImage("e:/abc2.jpg", "e:/abc.jpg","e:/abc_pressImage.jpg", 0, 0, 0.5f);//測試OK
*/ }
public final static void scale(String srcImageFile, String result,
int scale, boolean flag) {
try {
BufferedImage src = ImageIO.read(new File(srcImageFile)); // 讀入檔案
int width = src.getWidth(); // 得到源圖寬
int height = src.getHeight(); // 得到源圖長
if (flag) {// 放大
width = width * scale;
height = height * scale;
} else {// 縮小
width = width / scale;
height = height / scale;
}
Image image = src.getScaledInstance(width, height,
Image.SCALE_DEFAULT);
BufferedImage tag = new BufferedImage(width, height,
BufferedImage.TYPE_INT_RGB);
Graphics g = tag.getGraphics();
g.drawImage(image, 0, 0, null); // 繪製縮小後的圖
g.dispose();
ImageIO.write(tag, "JPEG", new File(result));// 輸出到檔案流
} catch (IOException e) {
e.printStackTrace();
}
}
@SuppressWarnings("static-access")
public final static void scale2(String srcImageFile, String result, int height, int width, boolean bb) {
try {
double ratio = 0.0; // 縮放比例
File f = new File(srcImageFile);
BufferedImage bi = ImageIO.read(f);
Image itemp = bi.getScaledInstance(width, height, bi.SCALE_SMOOTH);
// 計算比例
if ((bi.getHeight() > height) || (bi.getWidth() > width)) {
if (bi.getHeight() > bi.getWidth()) {
ratio = (new Integer(height)).doubleValue()
/ bi.getHeight();
} else {
ratio = (new Integer(width)).doubleValue() / bi.getWidth();
}
AffineTransformOp op = new AffineTransformOp(AffineTransform
.getScaleInstance(ratio, ratio), null);
itemp = op.filter(bi, null);
}
if (bb) {//補白
BufferedImage image = new BufferedImage(width, height,
BufferedImage.TYPE_INT_RGB);
Graphics2D g = image.createGraphics();
g.setColor(Color.white);
g.fillRect(0, 0, width, height);
if (width == itemp.getWidth(null))
g.drawImage(itemp, 0, (height - itemp.getHeight(null)) / 2,
itemp.getWidth(null), itemp.getHeight(null),
Color.white, null);
else
g.drawImage(itemp, (width - itemp.getWidth(null)) / 2, 0,
itemp.getWidth(null), itemp.getHeight(null),
Color.white, null);
g.dispose();
itemp = image;
}
ImageIO.write((BufferedImage) itemp, "JPEG", new File(result));
} catch (IOException e) {
e.printStackTrace();
}
}
public final static void cut(String srcImageFile, String result,
int x, int y, int width, int height) {
try {
// 讀取源影象
BufferedImage bi = ImageIO.read(new File(srcImageFile));
int srcWidth = bi.getHeight(); // 源圖寬度
int srcHeight = bi.getWidth(); // 源圖高度
if (srcWidth > 0 && srcHeight > 0) {
Image image = bi.getScaledInstance(srcWidth, srcHeight,
Image.SCALE_DEFAULT);
// 四個引數分別為影象起點座標和寬高
// 即: CropImageFilter(int x,int y,int width,int height)
ImageFilter cropFilter = new CropImageFilter(x, y, width, height);
Image img = Toolkit.getDefaultToolkit().createImage(
new FilteredImageSource(image.getSource(),
cropFilter));
BufferedImage tag = new BufferedImage(width, height, BufferedImage.TYPE_INT_RGB);
Graphics g = tag.getGraphics();
g.drawImage(img, 0, 0, width, height, null); // 繪製切割後的圖
g.dispose();
// 輸出為檔案
ImageIO.write(tag, "JPEG", new File(result));
}
} catch (Exception e) {
e.printStackTrace();
}
}
public final static void cut2(String srcImageFile, String descDir,
int rows, int cols) {
try {
if(rows<=0||rows>20) rows = 2; // 切片行數
if(cols<=0||cols>20) cols = 2; // 切片列數
// 讀取源影象
BufferedImage bi = ImageIO.read(new File(srcImageFile));
int srcWidth = bi.getHeight(); // 源圖寬度
int srcHeight = bi.getWidth(); // 源圖高度
if (srcWidth > 0 && srcHeight > 0) {
Image img;
ImageFilter cropFilter;
Image image = bi.getScaledInstance(srcWidth, srcHeight, Image.SCALE_DEFAULT);
int destWidth = srcWidth; // 每張切片的寬度
int destHeight = srcHeight; // 每張切片的高度
// 計算切片的寬度和高度
if (srcWidth % cols == 0) {
destWidth = srcWidth / cols;
} else {
destWidth = (int) Math.floor(srcWidth / cols) + 1;
}
if (srcHeight % rows == 0) {
destHeight = srcHeight / rows;
} else {
destHeight = (int) Math.floor(srcWidth / rows) + 1;
}
// 迴圈建立切片
// 改進的想法:是否可用多執行緒加快切割速度
for (int i = 0; i < rows; i++) {
for (int j = 0; j < cols; j++) {
// 四個引數分別為影象起點座標和寬高
// 即: CropImageFilter(int x,int y,int width,int height)
cropFilter = new CropImageFilter(j * destWidth, i * destHeight,
destWidth, destHeight);
img = Toolkit.getDefaultToolkit().createImage(
new FilteredImageSource(image.getSource(),
cropFilter));
BufferedImage tag = new BufferedImage(destWidth,
destHeight, BufferedImage.TYPE_INT_RGB);
Graphics g = tag.getGraphics();
g.drawImage(img, 0, 0, null); // 繪製縮小後的圖
g.dispose();
// 輸出為檔案
ImageIO.write(tag, "JPEG", new File(descDir
+ "_r" + i + "_c" + j + ".jpg"));
}
}
}
} catch (Exception e) {
e.printStackTrace();
}
}
public final static void cut3(String srcImageFile, String descDir,
int destWidth, int destHeight) {
try {
if(destWidth<=0) destWidth = 200; // 切片寬度
if(destHeight<=0) destHeight = 150; // 切片高度
// 讀取源影象
BufferedImage bi = ImageIO.read(new File(srcImageFile));
int srcWidth = bi.getHeight(); // 源圖寬度
int srcHeight = bi.getWidth(); // 源圖高度
if (srcWidth > destWidth && srcHeight > destHeight) {
Image img;
ImageFilter cropFilter;
Image image = bi.getScaledInstance(srcWidth, srcHeight, Image.SCALE_DEFAULT);
int cols = 0; // 切片橫向數量
int rows = 0; // 切片縱向數量
// 計算切片的橫向和縱向數量
if (srcWidth % destWidth == 0) {
cols = srcWidth / destWidth;
} else {
cols = (int) Math.floor(srcWidth / destWidth) + 1;
}
if (srcHeight % destHeight == 0) {
rows = srcHeight / destHeight;
} else {
rows = (int) Math.floor(srcHeight / destHeight) + 1;
}
// 迴圈建立切片
// 改進的想法:是否可用多執行緒加快切割速度
for (int i = 0; i < rows; i++) {
for (int j = 0; j < cols; j++) {
// 四個引數分別為影象起點座標和寬高
// 即: CropImageFilter(int x,int y,int width,int height)
cropFilter = new CropImageFilter(j * destWidth, i * destHeight,
destWidth, destHeight);
img = Toolkit.getDefaultToolkit().createImage(
new FilteredImageSource(image.getSource(),
cropFilter));
BufferedImage tag = new BufferedImage(destWidth,
destHeight, BufferedImage.TYPE_INT_RGB);
Graphics g = tag.getGraphics();
g.drawImage(img, 0, 0, null); // 繪製縮小後的圖
g.dispose();
// 輸出為檔案
ImageIO.write(tag, "JPEG", new File(descDir
+ "_r" + i + "_c" + j + ".jpg"));
}
}
}
} catch (Exception e) {
e.printStackTrace();
}
}
public final static void convert(String srcImageFile, String formatName, String destImageFile) {
try {
File f = new File(srcImageFile);
f.canRead();
f.canWrite();
BufferedImage src = ImageIO.read(f);
ImageIO.write(src, formatName, new File(destImageFile));
} catch (Exception e) {
e.printStackTrace();
}
}
public final static void gray(String srcImageFile, String destImageFile) {
try {
BufferedImage src = ImageIO.read(new File(srcImageFile));
ColorSpace cs = ColorSpace.getInstance(ColorSpace.CS_GRAY);
ColorConvertOp op = new ColorConvertOp(cs, null);
src = op.filter(src, null);
ImageIO.write(src, "JPEG", new File(destImageFile));
} catch (IOException e) {
e.printStackTrace();
}
}
public final static void pressText(String pressText,
String srcImageFile, String destImageFile, String fontName,
int fontStyle, Color color, int fontSize,int x,
int y, float alpha) {
try {
File img = new File(srcImageFile);
Image src = ImageIO.read(img);
int width = src.getWidth(null);
int height = src.getHeight(null);
BufferedImage image = new BufferedImage(width, height,
BufferedImage.TYPE_INT_RGB);
Graphics2D g = image.createGraphics();
g.drawImage(src, 0, 0, width, height, null);
g.setColor(color);
g.setFont(new Font(fontName, fontStyle, fontSize));
g.setComposite(AlphaComposite.getInstance(AlphaComposite.SRC_ATOP,
alpha));
// 在指定座標繪製水印文字
g.drawString(pressText, (width - (getLength(pressText) * fontSize))
/ 2 + x, (height - fontSize) / 2 + y);
g.dispose();
ImageIO.write((BufferedImage) image, "JPEG", new File(destImageFile));// 輸出到檔案流
} catch (Exception e) {
e.printStackTrace();
}
}
public final static void pressText2(String pressText, String srcImageFile,String destImageFile,
String fontName, int fontStyle, Color color, int fontSize, int x,
int y, float alpha) {
try {
File img = new File(srcImageFile);
Image src = ImageIO.read(img);
int width = src.getWidth(null);
int height = src.getHeight(null);
BufferedImage image = new BufferedImage(width, height,
BufferedImage.TYPE_INT_RGB);
Graphics2D g = image.createGraphics();
g.drawImage(src, 0, 0, width, height, null);
g.setColor(color);
g.setFont(new Font(fontName, fontStyle, fontSize));
g.setComposite(AlphaComposite.getInstance(AlphaComposite.SRC_ATOP,
alpha));
// 在指定座標繪製水印文字
g.drawString(pressText, (width - (getLength(pressText) * fontSize))
/ 2 + x, (height - fontSize) / 2 + y);
g.dispose();
ImageIO.write((BufferedImage) image, "JPEG", new File(destImageFile));
} catch (Exception e) {
e.printStackTrace();
}
}
public final static void pressImage(String pressImg, String srcImageFile,String destImageFile,
int x, int y, float alpha) {
try {
File img = new File(srcImageFile);
Image src = ImageIO.read(img);
int wideth = src.getWidth(null);
int height = src.getHeight(null);
BufferedImage image = new BufferedImage(wideth, height,
BufferedImage.TYPE_INT_RGB);
Graphics2D g = image.createGraphics();
g.drawImage(src, 0, 0, wideth, height, null);
// 水印檔案
Image src_biao = ImageIO.read(new File(pressImg));
int wideth_biao = src_biao.getWidth(null);
int height_biao = src_biao.getHeight(null);
g.setComposite(AlphaComposite.getInstance(AlphaComposite.SRC_ATOP,
alpha));
g.drawImage(src_biao, (wideth - wideth_biao) / 2,
(height - height_biao) / 2, wideth_biao, height_biao, null);
// 水印檔案結束
g.dispose();
ImageIO.write((BufferedImage) image, "JPEG", new File(destImageFile));
} catch (Exception e) {
e.printStackTrace();
}
}
public final static int getLength(String text) {
int length = 0;
for (int i = 0; i < text.length(); i++) {
if (new String(text.charAt(i) + "").getBytes().length > 1) {
length += 2;
} else {
length += 1;
}
}
return length / 2;
}
}
複製程式碼
以上程式碼專門用於檔案上傳，表單提交和以前一樣，沒什麼變化
- tomcat執行配置 -> edit configurations.. -> Deployment -> 新增External Source -> 選擇本地資料夾 -> Application context(配置tomcat對映資料夾)
- 如果將專案部署到tomcat中去的話，就要配置server.xml了，在Host標籤下配置
<!-- path為專案訪問的虛擬路勁 : docBase為本地路徑 -->
<Context path="/ICMS" docBase="D:\upFiles" reloadable="true" />
複製程式碼富文字編譯器如果其中加入輸入法的表情符號，資料庫如果不是utf8mb4編碼則會報錯
解決辦法：
note.youdao.com/noteshare?i…
附上ueditor-jsp穩定版：
連結: pan.baidu.com/s/1jWZ3fY3N… 提取碼: rfix
如果出現錯誤：請求後臺配置項http錯誤，上傳功能將不能正常使用！
請將ueditor下lib資料夾的所有jar包新增到專案依賴中