关于百度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;
}
借鉴文章 :
http://blog.csdn.net/eadela/article/details/76169660
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
相关文章推荐
- [置顶] 百度ueditor图片上传到OSS问题解决(付下载源码下载地址)
- 关于 百度 Ueditor (在chrome浏览器) 上传图片时 打开文件夹的延迟问题
- 关于 百度 Ueditor 上传图片时 打开文件夹的延迟问题
- 关于ueditor 在struts2 中 上传图片 ,未找到上传文件 问题的解决方法
- 关于百度富文本编辑器ueditor的.NET版本地图片上传提示uploader类同时存在于两个dll中的解决方法
- Django后台开发笔记①:关于DjangoUeditor与python3存在兼容性问题的解决方案(即解决图片无法上传问题)
- 关于jsp版ueditor1.2.5的部分问题解决(上传图片失败)
- 关于百度富文本编辑器ueditor的.NET版本地图片上传提示uploader类同时存在于两个dll中的解决方法
- 百度ueditor struts2图片上传问题解决方案
- 【ASP.NET】10.解决百度富文本编辑器UEditor本地上传图片正常,放到服务器上以后图片上传按钮变灰不能点击的问题
- Ueditor图片上传设置(1.4.3 JSP版本) - 解决图片不能显示问题
- 解决:百度编辑器UEditor,怎么将图片保存到图片服务器,或者上传到ftp服务器的问题(如果你正在用UE,这篇文章值得你看下)
- 百度编辑器不能上传图片的问题解决方法
- 解决关于Wordpress在SAE平台上无法上传图片的问题
- 关于百度world 编辑器改变上传图片的保存路径图片不显示的问题
- 百度ueditor 拖文件或world 里面复制粘贴图片到编辑中 上传到第三方问题
- 关于百度Ueditor的图片配置问题以及初步体验
- ueditor编辑器不能上传图片问题的解决方法
- ueditor1_2_6_1-utf8-net传解决本地图片上传失败问题
- 调用UEditor的图片上传组件进行图片上传,并解决多编辑器共存的取值问题