解决Ueditor编辑器图片保存路径问题


解决Ueditor编辑器上传图片的路径问题



之前发表过一篇Ueditor编辑器的配置以及使用的教程:

http://blog.csdn.net/gfd54gd5f46/article/details/60887313


这篇文章是对Ueditor编辑器图片上传保存的优化。



遇到的问题:


  • 用Eclipse开发WEB项目的时候,使用到了Ueditor上传图片的功能,插件会自动将上传的图片保存在Eclipse工作目录下,这种保存的方式非常不利于后续对图片的操作(管理),这时我们就要修改Ueditor的源码,解决上传图片时的路径问题。


官方文档:http://fex.baidu.com/ueditor/


在线API文档:http://ueditor.baidu.com/doc/


GitHub地址:https://github.com/fex-team/ueditor


1、下载ueditor源码并引用到工程

解决Ueditor编辑器图片保存路径问题_第1张图片



将jsp/src/目录下的所有文件拷贝到你的工程下

解决Ueditor编辑器图片保存路径问题_第2张图片



目录视图

解决Ueditor编辑器图片保存路径问题_第3张图片



将ueditor-1.1.2.jar删除,只引用前四个jar包

解决Ueditor编辑器图片保存路径问题_第4张图片



2、修改Tomcat服务器配置,添加图片映射路径

解决Ueditor编辑器图片保存路径问题_第5张图片



在tomcat中添加图片的绝对路径和图片访问虚拟路径

解决Ueditor编辑器图片保存路径问题_第6张图片


解决Ueditor编辑器图片保存路径问题_第7张图片



修改config.json配置文件,访问路径填写刚配置的虚拟目录

解决Ueditor编辑器图片保存路径问题_第8张图片



3、创建配置文件(可省略)



在src目录下创建config.properties ,存放图片路径


读配置文件的目的是为了动态修改保存路径,可以更方便的管理图片

解决Ueditor编辑器图片保存路径问题_第9张图片



创建ConfigUtil.java类,用于读取配置文件

import java.io.IOException;
import java.io.InputStream;
import java.io.InputStreamReader;
import java.util.Properties;

/**
 * 用于读取配置文件
 * @author LingDu
 */
public class ConfigUtil {
    private static Properties pro;

    static{
        pro=new Properties();
        //默认从类的所在包目录开始查找资源文件
        //如果要classpath的根目录开始找,必须加上/
        /*InputStream input=PropertiesUtil.class.
                getResourceAsStream("/config.properties");*/
        //默认从classspath的根目录开始查找资源文件
        InputStream input=ConfigUtil.class
                .getClassLoader()
                .getResourceAsStream("config.properties");


        try {
            pro.load(new InputStreamReader(input,
                    "UTF-8"));
        } catch (IOException e) {
            e.printStackTrace();
        }finally{
            if(input!=null){
                try {
                    input.close();
                } catch (IOException e) {
                    e.printStackTrace();
                }
            }
        }
    }
    public static String get(String key){
        return pro.getProperty(key);
    }

    public static int getInt(String key){
        return Integer.parseInt(pro.getProperty(key));
    }

}

解决Ueditor编辑器图片保存路径问题_第10张图片



4、修改源码(修改图片保存路径)


选中项目,使用Eclipse文件搜索功能

解决Ueditor编辑器图片保存路径问题_第11张图片



搜索 physicalPath

解决Ueditor编辑器图片保存路径问题_第12张图片


找到在3个类中使用到了 physicalPath

解决Ueditor编辑器图片保存路径问题_第13张图片



这里有3个类的是要修改源码的

//注释掉原来的路径代码
//String physicalPath = this.rootPath + savePath;


  • 使用自定义的路径(这个路径是通过配置文件读取的,相当于取代源码中的this.savePath


注意:ConfigUtil.get("savepath") ,字段名必须一样,否则读取不了




ImageHunter.java

解决Ueditor编辑器图片保存路径问题_第14张图片





Base64Uploader.java

解决Ueditor编辑器图片保存路径问题_第15张图片





BinaryUploader.java

解决Ueditor编辑器图片保存路径问题_第16张图片



5、测试:



往编辑器添加一张图片

解决Ueditor编辑器图片保存路径问题_第17张图片



再来看看图片保存目录

解决Ueditor编辑器图片保存路径问题_第18张图片


通过改源码的方式就能成功对图片进行统一管理了。


6、在strtus中使用Ueditor编辑器需要注意


如果配置文件中配置了过滤所有的请求,需要将其设置成只过滤.action的请求,否则导致文件保存不成功的情况。

解决Ueditor编辑器图片保存路径问题_第19张图片

你可能感兴趣的:(javaEE)