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

目录
相关文章
|
19天前
|
API
【sgUpload】自定义组件:自定义上传组件,支持上传文件夹及其子文件夹文件、批量上传,批量上传会有右下角上传托盘出现,支持本地上传图片转换为Base64image。
【sgUpload】自定义组件:自定义上传组件,支持上传文件夹及其子文件夹文件、批量上传,批量上传会有右下角上传托盘出现,支持本地上传图片转换为Base64image。
|
8月前
phpcms之 如何修改后台上传文件或图片的大小限制
phpcms之 如何修改后台上传文件或图片的大小限制
103 1
|
4月前
UEditor上传图片成功但回显不出来
UEditor上传图片成功但回显不出来
59 1
|
4月前
|
前端开发 JavaScript
前端用原生js编辑文件内容→创建生成文件(格式可以自定义)→下载文件
前端用原生js编辑文件内容→创建生成文件(格式可以自定义)→下载文件
|
4月前
|
小程序 应用服务中间件 Shell
laravel8(三)文件上传提示 “The file deos not exits ” ,但确实已经上传了文件
Laravel 文件上传提示 “The file "" deos not exits ” ,但确实已经上传了文件
36 1
|
8月前
|
网络协议 前端开发 JavaScript
一个浏览器从加载URL到页面展示出来,经过了哪些步骤?
一个浏览器从加载URL到页面展示出来,经过了哪些步骤?
|
11月前
|
PHP
thinkphp修改图片路径
thinkphp修改图片路径
82 0
|
前端开发 JavaScript Java
关于富文本编辑器—UEditor(java版)的使用,以及如何将UEditor的文件/图片上传路径改成绝对路径
突然发现好久没写博客了,感觉变懒了,是要让自己养成经常写文章的习惯才行。既可以分享自己的所学,和所想,和大家一起讨论,发现自己的不足的问题。 大家可能经常会用到富文本编辑器,今天我要说的是UEditor的使用,这是一个简单易用的开源富文本编辑器。
3270 0