ueditor jsp版上傳圖片到阿里雲
之前專案中用到了阿里雲OSS儲存圖片，但是在ueditor富文字編輯器中的自帶上傳圖片方法卻是上傳到本地的，改的時候絞盡腦汁，改完之後卻又發現簡單至極~
圖片中畫紅框的地方是我改過的檔案，只有這兩個檔案進行了修改，再新增一個阿里雲的上傳方法類就沒了
下面這個是我的Uploader.java檔案裡的內容，我在網上看到有別人的這個檔案裡的方法和我的不太一樣，這裡貼出來我的類，我只改了裡面upload方法的上傳部分。
package com.fh.util;
import java.io.BufferedReader;
import java.io.File;
import java.io.FileOutputStream;
import java.io.IOException;
import java.io.InputStream;
import java.io.InputStreamReader;
import java.io.OutputStream;
import java.text.SimpleDateFormat;
import java.util.Arrays;
import java.util.Date;
import java.util.HashMap;
import java.util.Iterator;
import java.util.Map;
import java.util.Random;
import javax.servlet.http.HttpServletRequest;
import org.apache.commons.fileupload.FileItemIterator;
import org.apache.commons.fileupload.FileItemStream;
import org.apache.commons.fileupload.disk.DiskFileItemFactory;
import org.apache.commons.fileupload.servlet.ServletFileUpload;
import org.apache.commons.io.IOUtils;
import com.fh.util.aliyun.AliyunOSSClientUtil;
import Decoder.BASE64Decoder;
/**
* UEditor(百度編輯器)檔案上傳輔助類
*
*/
public class Uploader {
// 檔案大小常量, 單位kb
private static final int MAX_SIZE = 500 * 1024;
// 輸出檔案地址
private String url = "";
// 上傳檔名
private String fileName = "";
// 狀態
private String state = "";
// 檔案型別
private String type = "";
// 原始檔名
private String originalName = "";
// 檔案大小
private String size = "";
private HttpServletRequest request = null;
private String title = "";
// 儲存路徑
private String savePath = "upload";
// 檔案允許格式
private String[] allowFiles = {".rar", ".doc", ".docx", ".zip", ".pdf",
".txt", ".swf", ".wmv", ".gif", ".png", ".jpg", ".jpeg", ".bmp"};
// 檔案大小限制，單位Byte
private long maxSize = 0;
private HashMap<String, String> errorInfo = new HashMap<String, String>();
private Map<String, String> params = null;
// 上傳的檔案資料
private InputStream inputStream = null;
public static final String ENCODEING = System.getProperties()
.getProperty("file.encoding");
public Uploader(HttpServletRequest request) {
this.request = request;
this.params = new HashMap<String, String>();
this.setMaxSize(Uploader.MAX_SIZE);
HashMap<String, String> tmp = this.errorInfo;
tmp.put("SUCCESS", "SUCCESS"); // 預設成功
// 未包含檔案上傳域
tmp.put("NOFILE",
"\\u672a\\u5305\\u542b\\u6587\\u4ef6\\u4e0a\\u4f20\\u57df");
// 不允許的檔案格式
tmp.put("TYPE",
"\\u4e0d\\u5141\\u8bb8\\u7684\\u6587\\u4ef6\\u683c\\u5f0f");
// 檔案大小超出限制
tmp.put("SIZE",
"\\u6587\\u4ef6\\u5927\\u5c0f\\u8d85\\u51fa\\u9650\\u5236");
// 請求型別錯誤
tmp.put("ENTYPE", "\\u8bf7\\u6c42\\u7c7b\\u578b\\u9519\\u8bef");
// 上傳請求異常
tmp.put("REQUEST", "\\u4e0a\\u4f20\\u8bf7\\u6c42\\u5f02\\u5e38");
// 未找到上傳檔案
tmp.put("FILE", "\\u672a\\u627e\\u5230\\u4e0a\\u4f20\\u6587\\u4ef6");
// IO異常
tmp.put("IO", "IO\\u5f02\\u5e38");
// 目錄建立失敗
tmp.put("DIR", "\\u76ee\\u5f55\\u521b\\u5efa\\u5931\\u8d25");
// 未知錯誤
tmp.put("UNKNOWN", "\\u672a\\u77e5\\u9519\\u8bef");
this.parseParams();
}
public void upload() throws Exception {
boolean isMultipart = ServletFileUpload
.isMultipartContent(this.request);
if (!isMultipart) {
this.state = this.errorInfo.get("NOFILE");
return;
}
if (this.inputStream == null) {
this.state = this.errorInfo.get("FILE");
return;
}
// 儲存title
this.title = this.getParameter("pictitle");
try {
String savePath = this.getFolder(this.savePath);
if (!this.checkFileType(this.originalName)) {
this.state = this.errorInfo.get("TYPE");
return;
}
this.fileName = this.getName(this.originalName);
this.type = this.getFileExt(this.fileName);
this.url = savePath + "/" + this.fileName;
// 上傳圖片
AliyunOSSClientUtil.uploadImgAliyun(this.inputStream,savePath + "/"+ this.fileName,"gainianpublicimg");
// 原本的上傳方法
// FileOutputStream fos = new FileOutputStream(
// this.getPhysicalPath(this.url));
// BufferedInputStream bis = new BufferedInputStream(this.inputStream);
// byte[] buff = new byte[128];
// int count = -1;
//
// while ((count = bis.read(buff)) != -1) {
//
// fos.write(buff, 0, count);
//
// }
//
// bis.close();
// fos.close();
this.state = this.errorInfo.get("SUCCESS");
} catch (Exception e) {
e.printStackTrace();
this.state = this.errorInfo.get("IO");
}
}
/**
* 接受並儲存以base64格式上傳的檔案
*
* @param fieldName
*/
public void uploadBase64(String fieldName) {
String savePath = this.getFolder(this.savePath);
String base64Data = this.request.getParameter(fieldName);
this.fileName = this.getName("test.png");
this.url = savePath + "/" + this.fileName;
BASE64Decoder decoder = new BASE64Decoder();
try {
File outFile = new File(this.getPhysicalPath(this.url));
OutputStream ro = new FileOutputStream(outFile);
byte[] b = decoder.decodeBuffer(base64Data);
for (int i = 0; i < b.length; ++i) {
if (b[i] < 0) {
b[i] += 256;
}
}
ro.write(b);
ro.flush();
ro.close();
this.state = this.errorInfo.get("SUCCESS");
} catch (Exception e) {
this.state = this.errorInfo.get("IO");
}
}
public String getParameter(String name) {
return this.params.get(name);
}
/**
* 檔案型別判斷
*
* @param fileName
* @return
*/
private boolean checkFileType(String fileName) {
Iterator<String> type = Arrays.asList(this.allowFiles).iterator();
while (type.hasNext()) {
String ext = type.next();
if (fileName.toLowerCase().endsWith(ext)) {
return true;
}
}
return false;
}
/**
* 獲取副檔名
*
* @return string
*/
private String getFileExt(String fileName) {
return fileName.substring(fileName.lastIndexOf("."));
}
private void parseParams() {
DiskFileItemFactory dff = new DiskFileItemFactory();
try {
ServletFileUpload sfu = new ServletFileUpload(dff);
sfu.setSizeMax(this.maxSize);
sfu.setHeaderEncoding(Uploader.ENCODEING);
FileItemIterator fii = sfu.getItemIterator(this.request);
while (fii.hasNext()) {
FileItemStream item = fii.next();
// 普通引數儲存
if (item.isFormField()) {
this.params.put(item.getFieldName(),
this.getParameterValue(item.openStream()));
} else {
// 只保留一個
if (this.inputStream == null) {
this.inputStream = item.openStream();
this.originalName = item.getName();
return;
}
}
}
} catch (Exception e) {
this.state = this.errorInfo.get("UNKNOWN");
}
}
/**
* 依據原始檔名生成新檔名
*
* @return
*/
private String getName(String fileName) {
Random random = new Random();
return this.fileName = "" + random.nextInt(10000)
+ System.currentTimeMillis() + this.getFileExt(fileName);
}
/**
* 根據字串建立本地目錄 並按照日期建立子目錄返回
*
* @param path
* @return
*/
private String getFolder(String path) {
SimpleDateFormat formater = new SimpleDateFormat("yyyyMMdd");
path += "/" + formater.format(new Date());
File dir = new File(this.getPhysicalPath(path));
if (!dir.exists()) {
try {
dir.mkdirs();
} catch (Exception e) {
this.state = this.errorInfo.get("DIR");
return "";
}
}
return path;
}
/**
* 根據傳入的虛擬路徑獲取物理路徑
*
* @param path
* @return
*/
private String getPhysicalPath(String path) {
String servletPath = this.request.getServletPath();
String realPath = this.request.getSession().getServletContext()
.getRealPath(servletPath);
return new File(realPath).getParent() + "/" + path;
}
/**
* 從輸入流中獲取字串資料
*
* @param in
* 給定的輸入流， 結果字串將從該流中讀取
* @return 從流中讀取到的字串
*/
private String getParameterValue(InputStream in) {
BufferedReader reader = new BufferedReader(new InputStreamReader(in));
String result = "";
String tmpString = null;
try {
while ((tmpString = reader.readLine()) != null) {
result += tmpString;
}
} catch (Exception e) {
// do nothing
}
return result;
}
private byte[] getFileOutputStream(InputStream in) {
try {
return IOUtils.toByteArray(in);
} catch (IOException e) {
return null;
}
}
public void setSavePath(String savePath) {
this.savePath = savePath;
}
public void setAllowFiles(String[] allowFiles) {
this.allowFiles = allowFiles;
}
public void setMaxSize(long size) {
this.maxSize = size * 1024;
}
public String getSize() {
return this.size;
}
public String getUrl() {
return this.url;
}
public String getFileName() {
return this.fileName;
}
public String getState() {
return this.state;
}
public String getTitle() {
return this.title;
}
public String getType() {
return this.type;
}
public String getOriginalName() {
return this.originalName;
}
}ueditor.config.js檔案裡的只是把imagePath改成了OSS讀取圖片的字首
除了這兩處別的都沒有改動，另有阿里雲的上傳方法類一個在下面粘出來
package com.fh.util.aliyun;
import java.io.ByteArrayInputStream;
import java.io.File;
import java.io.FileInputStream;
import java.io.FileNotFoundException;
import java.io.InputStream;
import java.net.URL;
import java.util.Date;
import org.apache.log4j.Logger;
import com.alibaba.druid.util.StringUtils;
import com.aliyun.oss.OSSClient;
import com.aliyun.oss.model.Bucket;
import com.aliyun.oss.model.OSSObject;
import com.aliyun.oss.model.ObjectMetadata;
import com.aliyun.oss.model.PutObjectResult;
/**
* @class:AliyunOSSClientUtil
* @descript:java使用阿里雲OSS儲存物件上傳圖片
* @date:2017年3月16日 下午5:58:08
* @author sang
*/
public class AliyunOSSClientUtil {
//log日誌
private static Logger logger = Logger.getLogger(AliyunOSSClientUtil.class);
//阿里雲API的內或外網域名
private static String ENDPOINT;
//阿里雲API的金鑰Access Key ID
private static String ACCESS_KEY_ID;
//阿里雲API的金鑰Access Key Secret
private static String ACCESS_KEY_SECRET;
//阿里雲API的bucket名稱
private static String BACKET_NAME;
//阿里雲API的資料夾名稱
private static String FOLDER;
//private static OSSClient ossClient;
//初始化屬性
static{
ENDPOINT = allocation.ENDPOINT;
ACCESS_KEY_ID = allocation.ACCESS_KEY_ID;
ACCESS_KEY_SECRET = allocation.ACCESS_KEY_SECRET;
BACKET_NAME = allocation.BACKET_NAME;
FOLDER = allocation.FOLDER;
}
/**
* 獲取阿里雲OSS客戶端物件
* @return ossClient
*/
public static OSSClient test(){
System.out.println("test");
return null;
}
/**
* 建立儲存空間
* @param ossClient OSS連線
* @param bucketName 儲存空間
* @return
*/
public static String createBucketName(OSSClient ossClient,String bucketName){
//儲存空間
final String bucketNames=bucketName;
if(!ossClient.doesBucketExist(bucketName)){
//建立儲存空間
Bucket bucket=ossClient.createBucket(bucketName);
logger.info("建立儲存空間成功");
return bucket.getName();
}
return bucketNames;
}
/**
* 刪除儲存空間buckName
* @param ossClient oss物件
* @param bucketName 儲存空間
*/
public static void deleteBucket(OSSClient ossClient, String bucketName){
ossClient.deleteBucket(bucketName);
logger.info("刪除" + bucketName + "Bucket成功");
}
/**
* 建立模擬資料夾
* @param ossClient oss連線
* @param bucketName 儲存空間
* @param folder 模擬資料夾名如"qj_nanjing/"
* @return 資料夾名
*/
public static String createFolder(OSSClient ossClient,String bucketName,String folder){
//資料夾名
final String keySuffixWithSlash =folder;
//判斷資料夾是否存在，不存在則建立
if(!ossClient.doesObjectExist(bucketName, keySuffixWithSlash)){
//建立資料夾
ossClient.putObject(bucketName, keySuffixWithSlash, new ByteArrayInputStream(new byte[0]));
logger.info("建立資料夾成功");
//得到資料夾名
OSSObject object = ossClient.getObject(bucketName, keySuffixWithSlash);
String fileDir=object.getKey();
return fileDir;
}
return keySuffixWithSlash;
}
/**
* 根據key刪除OSS伺服器上的檔案
* @param ossClient oss連線
* @param bucketName 儲存空間
* @param folder 模擬資料夾名 如"qj_nanjing/"
* @param key Bucket下的檔案的路徑名+檔名 如："upload/cake.jpg"
*/
public static void deleteFile(OSSClient ossClient, String bucketName, String folder, String key){
ossClient.deleteObject(BACKET_NAME, FOLDER + key);
logger.info("刪除" + BACKET_NAME + "下的檔案" + FOLDER + key + "成功");
}
public static void uploadImgAliyun(InputStream inputStream ,String fileName, String bucketName)
throws FileNotFoundException{
OSSClient client = new OSSClient(ENDPOINT,ACCESS_KEY_ID, ACCESS_KEY_SECRET);
//此處"images/companyNewsImages/"+fileName,表示上傳至阿里雲中images資料夾下的companyNewsImages資料夾中，請修改為自己的路徑即可
client.putObject(bucketName, fileName, inputStream);
client.shutdown();
}
/**
* 上傳圖片至OSS
* @param ossClient oss連線
* @param file 上傳檔案（檔案全路徑如：D:\\image\\cake.jpg）
* @param bucketName 儲存空間
* @param folder 模擬資料夾名 如"qj_nanjing/"
* @return String 返回的唯一MD5數字簽名
* */
public static String uploadObject2OSS(OSSClient ossClient, File file, String bucketName, String folder) {
String resultStr = null;
try {
//以輸入流的形式上傳檔案
InputStream is = new FileInputStream(file);
//檔名
String fileName = file.getName();
System.out.println(fileName);
//檔案大小
Long fileSize = file.length();
//建立上傳Object的Metadata
ObjectMetadata metadata = new ObjectMetadata();
//上傳的檔案的長度
metadata.setContentLength(is.available());
//指定該Object被下載時的網頁的快取行為
metadata.setCacheControl("no-cache");
//指定該Object下設定Header
metadata.setHeader("Pragma", "no-cache");
//指定該Object被下載時的內容編碼格式
metadata.setContentEncoding("utf-8");
//檔案的MIME，定義檔案的型別及網頁編碼，決定瀏覽器將以什麼形式、什麼編碼讀取檔案。如果使用者沒有指定則根據Key或檔名的副檔名生成，
//如果沒有副檔名則填預設值application/octet-stream
metadata.setContentType(getContentType(fileName));
//指定該Object被下載時的名稱（指示MINME使用者代理如何顯示附加的檔案，開啟或下載，及檔名稱）
metadata.setContentDisposition("filename/filesize=" + fileName + "/" + fileSize + "Byte.");
//上傳檔案 (上傳檔案流的形式)
PutObjectResult putResult =
ossClient.putObject(bucketName, folder + fileName, is, metadata);
//解析結果
resultStr = folder+fileName;
System.out.println(putResult.getETag());
System.out.println(resultStr);
} catch (Exception e) {
e.printStackTrace();
logger.error("上傳阿里雲OSS伺服器異常." + e.getMessage(), e);
}
return resultStr;
}
/**
* 通過檔名判斷並獲取OSS服務檔案上傳時檔案的contentType
* @param fileName 檔名
* @return 檔案的contentType
*/
public static String getContentType(String fileName){
//檔案的字尾名
String fileExtension = fileName.substring(fileName.lastIndexOf("."));
if(".bmp".equalsIgnoreCase(fileExtension)) {
return "image/bmp";
}
if(".gif".equalsIgnoreCase(fileExtension)) {
return "image/gif";
}
if(".jpeg".equalsIgnoreCase(fileExtension) || ".jpg".equalsIgnoreCase(fileExtension) || ".png".equalsIgnoreCase(fileExtension) ) {
return "image/jpeg";
}
if(".html".equalsIgnoreCase(fileExtension)) {
return "text/html";
}
if(".txt".equalsIgnoreCase(fileExtension)) {
return "text/plain";
}
if(".vsd".equalsIgnoreCase(fileExtension)) {
return "application/vnd.visio";
}
if(".ppt".equalsIgnoreCase(fileExtension) || "pptx".equalsIgnoreCase(fileExtension)) {
return "application/vnd.ms-powerpoint";
}
if(".doc".equalsIgnoreCase(fileExtension) || "docx".equalsIgnoreCase(fileExtension)) {
return "application/msword";
}
if(".xml".equalsIgnoreCase(fileExtension)) {
return "text/xml";
}
//預設返回型別
return "image/jpeg";
}
/**
* 獲得圖片路徑
*
* @param fileUrl
* @return
*/
public static String getImgUrl(String fileUrl,OSSClient ossClient,String bucketName) {
if (!StringUtils.isEmpty(fileUrl)) {
String[] split = fileUrl.split("/");
return getUrl(FOLDER + split[split.length - 1],ossClient,bucketName);
}
return null;
}
/**
* 獲得url連結
*
* @param key
* @return
*/
public static String getUrl(String key,OSSClient ossClient,String bucketName) {
// 設定URL過期時間為10年 3600l* 1000*24*365*10
Date expiration = new Date(new Date().getTime() + 3600 * 1000);
// 生成URL
URL url = ossClient.generatePresignedUrl(bucketName, key, expiration);
if (url != null) {
return url.toString();
}
return null;
}
} 之前用的uploadObject2OSS方法上傳只能上傳上去一點點，大概有2kb多點，上傳不完整，猜測大概是metadata引數傳的不對吧，具體原因仍舊不太明白，如有大神知道可以在留言處告知，不勝感激。
相關文章
- vue 圖片上傳到阿里雲ossVue阿里
- Flutter 上傳圖片到阿里雲OSSFlutter阿里
- 百度編輯器 ueditor 上傳圖片影片到阿里 Oss 或其他雲 PHP阿里PHP
- 小程式上傳圖片到阿里雲oss阿里
- 圖片裁剪並上傳到阿里雲oss阿里
- 百度編輯器 ueditor 上傳圖片視訊到阿里 Oss 或其他雲 PHP阿里PHP
- Android圖片上傳到阿里雲OSS小案例Android阿里
- Ueditor 上傳圖片自動新增水印(只能上傳圖片，上傳檔案報錯)
- Ueditor上傳圖片自動新增水印（通用圖片檔案）
- Laravel 上傳圖片到七牛雲Laravel
- ionic3 上傳圖片、壓縮圖片到阿里雲 服務端簽名後直傳阿里服務端
- 微信小程式開發：上傳網路圖片到阿里雲oss微信小程式阿里
- uniapp小程式上傳圖片到騰訊雲APP
- golang對接阿里雲私有Bucket上傳圖片、授權訪問圖片Golang阿里
- 【故障公告】阿里雲OSS故障造成圖片無法上傳阿里
- 前端使用 JS 上傳圖片至阿里雲 ali-oss前端JS阿里
- 易優CMS阿里雲OSS上傳圖片報錯-eyoucms阿里
- java，springboot + thymeleaf 上傳圖片、刪除圖片到伺服器、本地，壓縮圖片上傳(有些圖片會失真)，原圖上傳JavaSpring Boot伺服器
- Vue專案中最簡單的使用整合UEditor方式，含圖片上傳Vue
- 微信小程式裡如何用阿里雲上傳視訊圖片微信小程式阿里
- angular上傳圖片到.netcore後端AngularNetCore後端
- UEditor實現單張圖片上傳至騰訊雲（物件儲存服務）功能（html5物件HTML
- 關於 Nuxt 整合ueditor的一些坑（包括圖片上傳）前端部分UX前端
- Laravel——圖片上傳之七牛雲Laravel
- springboot整合百度富文字編輯器ueditor實現圖片上傳和檔案上傳功能Spring Boot
- 上傳圖片
- Laravel 圖片上傳到本地和七牛雲類封裝整合Laravel封裝
- 圖片等檔案上傳到阿里雲的STS臨時授權訪問的配置詳解阿里
- Java實現圖片上傳到伺服器，並把上傳的圖片讀取出來Java伺服器
- Spring webflux 整合 Mendmix 上傳元件上傳檔案到阿里雲騰訊雲SpringWebUX元件阿里
- springboot專案上傳儲存圖片到七牛雲伺服器Spring Boot伺服器
- electron上傳圖片
- 上傳圖片jsJS
- 裁剪上傳圖片
- 圖片上傳及圖片處理
- 有道雲筆記非會員上傳圖片筆記
- Alfred Workflow 一鍵上傳圖片到 GitHub 返回 MarkdownAlfredGithub
- 火狐使用阿里雲OOS上傳圖片報錯：“XML 解析錯誤：找不到根元素”阿里XML