UEditor自定义图片/文件上传路径与回显

简介: UEditor自定义图片/文件上传路径与回显

本文是基于Windows下Java解决UEditor自定义图片/文件上传路径问题,文件保存在本地磁盘,Tomcat做了虚拟路径映射。本文并未采用官网所示方法:


UEditor官网:https://ueditor.baidu.com/website/index.html

下载地址:https://ueditor.baidu.com/website/download.html

UEditor入门:http://fex.baidu.com/ueditor/


关于如何部署、运行起来等参考官网即可,本文主要解决如何自定义图片上传路径并回显。


【1】下载文件并部署运行


为什么还要下载源码?因为要自定义MyActionEnter类。这个类干什么?解决自定义路径的关键!

当第一次创建完项目后,可能如下图所示,此时图片是保存在部署在Tomcat路径下的:

图片根路径可能如下所示(eclipse默认部署项目路径):

C:\Users\jianggc\workspace\.metadata\.plugins\
org.eclipse.wst.server.core\tmp1\wtpwebapps\UeditorWeb\


【2】继承ActionEnter实现自己的MyActionEnter

先把下载的源码中的src/com放入项目中,如下所示:

主要就是重写invoke方法,如下所示:

PS: 文章末尾会有完整项目下载地址,不要着急!

为什么这么做?

看下面两个图片:

如下所示修改controller.jsp:

如果不明白,建议官方文档先看一下。时间所限,回头再补充细节。


【3】修改配置文件

① 修改config.json配置文件


下图注释是真的很清楚了!记住这里配置的图片访问路径前缀“/uefile/”

② Tomcat做虚拟路径映射

如下所示,当页面访问/uefile前缀的请求时,就会自动去E:\img寻找。


【4】Struts2下UEditor出现上传数据找不到的错误

Struts2这个已经被淘汰的玩意在某些程序中还仍然可见。如果核心过滤器url-pattern设置为/*,那么你很可能就会遇到上传图片的时候出现上传数据找不到的错误。


解决办法

① 自定义过滤器继承核心过滤器,放过UEditor的请求;

//或者是StrutsPrepareAndExecuteFilter
public class MyStrutsFilter extends FilterDispatcher {
    public void doFilter(ServletRequest req, ServletResponse res,FilterChain chain) throws IOException, ServletException {
        HttpServletRequest request = (HttpServletRequest) req;
        //不过滤的url
        String url = request.getRequestURI();
        System.out.println(url);
        if ((url.indexOf("ueditor")>-1||url.indexOf("utf8-jsp")>-1||
            url.indexOf("controller.jsp")>-1)) {
            System.out.println("使用自定义的过滤器");
            chain.doFilter(req, res);
        }else{
            System.out.println("使用默认的过滤器");
            super.doFilter(req, res, chain);
        }
    }
}

② 修改Struts2的url-pattern,比如为.action

目录
相关文章
|
6月前
|
API
【sgUpload】自定义组件:自定义上传组件,支持上传文件夹及其子文件夹文件、批量上传,批量上传会有右下角上传托盘出现,支持本地上传图片转换为Base64image。
【sgUpload】自定义组件:自定义上传组件,支持上传文件夹及其子文件夹文件、批量上传,批量上传会有右下角上传托盘出现,支持本地上传图片转换为Base64image。
|
2月前
|
XML JSON Java
springboot文件上传,单文件上传和多文件上传,以及数据遍历和回显
本文介绍了在Spring Boot中如何实现文件上传,包括单文件和多文件上传的实现,文件上传的表单页面创建,接收上传文件的Controller层代码编写,以及上传成功后如何在页面上遍历并显示上传的文件。同时,还涉及了`MultipartFile`类的使用和`@RequestPart`注解,以及在`application.properties`中配置文件上传的相关参数。
springboot文件上传,单文件上传和多文件上传,以及数据遍历和回显
|
6月前
|
移动开发 前端开发
VForm3的文件上传后的一种文件回显方式
VForm3的文件上传后的一种文件回显方式
117 0
phpcms之 如何修改后台上传文件或图片的大小限制
phpcms之 如何修改后台上传文件或图片的大小限制
159 1
|
6月前
UEditor上传图片成功但回显不出来
UEditor上传图片成功但回显不出来
157 1
|
存储 前端开发 Java
Element el-upload 文件上传/图片上传/拖拽上传/附带参数/附带请求头部详解
文目录 1. 前言 2. 基本用法 2.1 前端部分 2.2 后端部分 2.3 获取后端返回信息 3. 外观功能介绍 3.1 拖拽上传 3.2 显示图片 3.3 设置文件列表样式 3.4 显示提示信息 4. 事件功能介绍 4.1 限制上传文件数量 4.2 限制上传文件类型和大小 4.3 移除文件处理 4.4 手动上传 5. 附带参数 6. 附带请求头部 7. 小结
5943 0
|
6月前
|
前端开发 JavaScript
前端用原生js编辑文件内容→创建生成文件(格式可以自定义)→下载文件
前端用原生js编辑文件内容→创建生成文件(格式可以自定义)→下载文件
|
PHP
thinkphp修改图片路径
thinkphp修改图片路径
130 0
|
JavaScript 前端开发 应用服务中间件
SpringMVC的单文件上传,多文件上传和下载文件(十二)下
SpringMVC的单文件上传,多文件上传和下载文件(十二)下
295 0
SpringMVC的单文件上传,多文件上传和下载文件(十二)下
|
前端开发 Java 应用服务中间件
SpringMVC的单文件上传,多文件上传和下载文件(十二)上
SpringMVC的单文件上传,多文件上传和下载文件(十二)上
221 0
SpringMVC的单文件上传,多文件上传和下载文件(十二)上