您的位置:首页 > 产品设计 > UI/UE

关于百度ueditor图片上传到OSS问题解决

2017-11-22 22:19 771 查看
本人java菜鸡一枚。最近公司项目用到百度富文本,由于之前用过百度ueditor所以就选择了ueditor,然后被图片上传深深的坑到了。话不多说现在说一下我碰到的问题 :

1:就是如何上传到别的服务器,比如OSS服务器。

2:就是如何回显(这个就很坑),看了很多博客最后也没解决。

下面贴解决办法(附代码):

最基本的ueditor怎么初始化就不说了。

首先我们要让图片上传的时候调用我们自己写的接口。

UE.Editor.prototype._bkGetActionUrl=UE.Editor.prototype.getActionUrl;
UE.Editor.prototype.getActionUrl=function(action){
if (action == 'uploadimage' ||action== 'uploadscrawl' || action == 'uploadimage') {
return '<%=request.getContextPath()%>/totalmsg/upload';
} else if(action == 'listimage'){
return this._bkGetActionUrl.call(this, action);
} else{
return this._bkGetActionUrl.call(this, action);
}
}
这样就可以直接调用我们的接口了
下面是获取到图片上传到oss然后回显了

@RequestMapping(value = "/upload")
@ResponseBody
public Object picUpload( @RequestParam("upfile")MultipartFile file, HttpServletRequest request,HttpServletResponse response) throws IOException{
Map<String,Object> parm = new HashMap<>();
CommonsMultipartFile cf=(CommonsMultipartFile)file;
DiskFileItem fi = (DiskFileItem) cf.getFileItem();
InputStream fileContent = fi.getInputStream();
String fileName=fi.getName();
String suffix=fileName.substring(fileName.lastIndexOf("."));
String objName= OssUtil.makeObjName1("pic", DateUtil.date2str(new Date(),"yyyyMMdd"),suffix);
String newUrl= OssUtil.addPicPObj(objName,fileContent);
if (newUrl == null) {
logger.error("pic上传文件失败");
} else {
newUrl = OssUtil.IMG_DOMAIN+"/"+objName;
parm.put("state","SUCCESS");
parm.put("url",newUrl);
return parm;
}
return parm;
}
这个参数key就是你config.json里配置
返回参数一定要返回 state = SUCCESS 和 url = 返回的url路径

下面是OSS上传用到的封装方法
public static String makeObjName1(String prefix, String date, String suffix) {
return prefix + "/" + date + "/" + UUIDFactory.getUUIDStr() + "." + suffix;
}
/**
* @添加图片
*/
public static
4000
String addPicPObj(String objName,InputStream is){
OSSClient ossClient = new OSSClient(IMG_END_POINT, accessKeyId, accessKeySecret);
try {
try {
ossClient.putObject(IMG_BUCKET_NAME, objName, is);
try {
is.close();
} catch (IOException e) {
logger.error("",e);
}
} catch (OSSException | com.aliyun.oss.ClientException e) {
logger.error("",e);
System.out.println("添加object\t" + objName + "\t异常。");
return null;
}
return "http://" + IMG_BUCKET_NAME + "." + IMG_END_POINT + "/" + objName;

} catch (com.aliyun.oss.ClientException e) {
logger.error("",e);
} finally {
ossClient.shutdown();
}
return null;
}
下面是效果展示

借鉴文章 :
http://blog.csdn.net/eadela/article/details/76169660
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: 
相关文章推荐