日期:2014-05-16  浏览次数:20607 次

xhEditor在线编辑器学习笔记(1)---用Struts2+ajax实现图片上传

       这段时间的业余时间一直忙于自己博客(http://www.dianfusoft.com/)的开发工作,特别是选择在线编辑器时不知道选择哪个好,因为第一次用这玩意儿。选择了那么多的编辑器,最后还是选择了xhEditor这款在线编辑器。我的理由主要是有以下几点:


1.      这是一个开源的编辑器,虽然是2009年开始发布的,可是功能一点都不逊色而且小巧,加载迅速;


2.      丰富的问题解决方案。虽然和老牌FCKEditor相比有一定差距,但是官方完善的文档应该可以解决遇到的问题;


3.      最主要的是自己一直使用的CSDN博客也是选择这个编辑器,用惯了这个编辑器没理由换别的。

 

        今晚就分享一个自己解决了的问题,那就是xhEditor上传图片的问题。网上的资料真是鱼龙混杂,可以说都是复制来复制去,基本上都没用。算了,不说这了,没意思。我就说说我的情况,由于我的项目采用的是Struts2,网上看到了一篇用servlet实现图片上传的文章,我相信那是可以实现的,但是太过于复杂,我一向都很反感用servlet,那是毕业生才干的事儿!经过自己的思考,终于实现了用Struts2+Ajax上传图片的模式,现贴出代码。


        首先在页面xhEditor需要设置以下参数:

 

upImgUrl:"uploadImg.action"   //上传服务器接口


,onUpload:callBackFunction   //服务器端返回信息,是json格式

 

上述配置完成后就开始写Struts2上传代码,如下所示:

packagecom.dianfusoft.action;
 
public classEditAction extends ActionSupport {
        
         private File filedata;  //编辑器接口中提供的文件名为此名,所以不可更改
         private StringfiledataContentType;  //文件类型
         private String filedataFileName;  //文件名
         private String saveDir="你的服务器文件路径";  //服务器图片保存路径(此处本人隐藏)
         private String message;  //文件上传信息,以json格式返回到客户端
 
         //xheditor上传图片功能
         public String uploadImg() throwsIOException{
                   ActionContextac=ActionContext.getContext();
                   HttpServletResponseresponse=(HttpServletResponse) ac.get(ServletActionContext.HTTP_RESPONSE);
                   Filefile=this.getFiledata();  //获取编辑器中传递的文件
                   File basePath=newFile(ServletActionContext.getServletContext().getRealPath(saveDir));
                   PrintWriter out =response.getWriter();
                   if(!basePath.exists()){
                            basePath.mkdirs();
                   }
                   if(file.length()==0){
                            //不允许上传空文件
                            message="{err:'不允许上传空文件,请重新选择!',msg:''}";
                   }elseif(file.length()>1024*1024*2){
                            //限制文件上传大小
                            message="{err:'图片大小不能超过2M,请重新选择!',msg:''}";
                   }else{
                            try {
                                     BufferedInputStreambis=new BufferedInputStream(new FileInputStream(filedata));
                                     BufferedOutputStreambos=new BufferedOutputStream(new FileOutputStream(newFile(basePath+file.separator+filedataFileName)));
                                     byte[]b=new byte[10*1024];
                                     for(intcount=-1;(count=bis.read(b))!=-1;){
                                               bos.write(b,0,count);
                                               bos.flush();
                                     }
                                     if(bis!=null){