百度富文本编辑器UEditor1.3上传图片附件等

我会带着你远行 2022-08-23 11:50 274阅读 0赞

今天一直在整我的一个项目的编辑器上传图片，我用的是百度UEditor 1.3版本的；现在已经有了1.4的了，不过还算比较新吧，但是官网上面没有上传图片这些的教程，而网上对于这方面的资料很少啊，折腾了我半天，看了一些以前版本的上传图片的问题，最后终于搞定了。

先说说我的这个项目的配置情况吧

用的是SSH框架：struts2.3.16 spring3.2.5 hibernate3.3.2

ueditor 1.3-utf-8-jsp版

jdk 1.7

开发工具用的是myeclipse10.7

直接把项目结构图贴上吧，图片稍微p了一下，但是主要的东西都在

![SouthEast][]

这个是ueditor文件夹里面的文件

![SouthEast 1][]

需要将commons-fileupload-1.2.2.jar和ueditor.jar两个jar包放入lib文件夹下；注意commons-fileupload-1.2.2.jar在struts2里面也有，不要冲突了

这里在myeclipse里面会有js报错，不用管，看不惯可以直接delete掉所有js错误，不过要注意不要把真正的错误给delete掉了哦，比如jsp的错误，可能是类引用路径错了，这个要好好改改

这里如何在jsp页面里面引用编辑器就不说了，自己去UEditor官网去找，说的比较详细，主要就说说怎么上传图片，附件这些都是类似的，这些在官网没怎么说明。

![SouthEast 2][]

一般部署好后上传到一部分就会显示路径错误，未知路径，找不到上传文件之类的，这是因为使用struts2，被struts2的默认拦截器StrutsPrepareAndExecuteFilter给拦截掉了。所以我们要自己写一个拦截器，将其对图片、附件上传等不要进行拦截。

下面贴一下我的拦截器的代码吧

package com.phn.interceptor;
    
    import java.io.IOException;
    import javax.servlet.FilterChain;
    import javax.servlet.ServletException;
    import javax.servlet.ServletRequest;
    import javax.servlet.ServletResponse;
    import javax.servlet.http.HttpServletRequest;
    import org.apache.struts2.dispatcher.ng.filter.StrutsPrepareAndExecuteFilter;
    
    public class UEditorFilter extends StrutsPrepareAndExecuteFilter {
    	public void doFilter(ServletRequest req, ServletResponse res,
    			FilterChain chain) throws IOException, ServletException {
    		HttpServletRequest request = (HttpServletRequest) req;
    		// 获取url
    		String url = request.getRequestURI();
    		if ("/XXX/ueditor/jsp/imageUp.jsp".equals(url)) {
    			// 这里用XXX表示项目名,imageUp.jsp是上ueditor里面传图片的jsp，表示这个jsp不要被过滤，同理附件等上传也是一样配置
    			// 使用对编辑器的拦截器
    			chain.doFilter(req, res);
    		} else {// 前往使用默认的拦截器
    			super.doFilter(req, res, chain);
    
    		}
    	}
    }

上面代码比较简单，我就不详细说明了，相信大家应该可以看懂大致的意思

下面是web.xml的修改，原来的web.xml

<filter>
    		<filter-name>struts2</filter-name>
    		<filter-class>org.apache.struts2.dispatcher.ng.filter.StrutsPrepareAndExecuteFilter</filter-class>
    	</filter>
    	<filter-mapping>
    		<filter-name>struts2</filter-name>
    		<url-pattern>/*</url-pattern>
    	</filter-mapping>

修改后的web.xml

<filter>
    		<filter-name>struts2</filter-name>
    		<filter-class>com.phn.interceptor.UEditorFilter</filter-class>//这里配置的就是我自己定义的拦截器
    	</filter>
    	<filter-mapping>
    		<filter-name>struts2</filter-name>
    		<url-pattern>/*</url-pattern>
    	</filter-mapping>

最后在tomcat里面部署好，运行测试一下，如下成功

![SouthEast 3][]

这里我主要参考了

[http://bbs.csdn.net/topics/390678241?page=1\#post-397864644][http_bbs.csdn.net_topics_390678241_page_1_post-397864644]

[http://download.csdn.net/detail/xiangyangsanren/4849558][http_download.csdn.net_detail_xiangyangsanren_4849558]

[SouthEast]: /images/20220823/83d9551ab5da4e058beddd92f561c7fd.png
[SouthEast 1]: /images/20220823/bcbfedc5b5c745b98ff8cab9e9c03095.png
[SouthEast 2]: /images/20220823/7a11bdd6db824a81b4ac70ecf7aa0467.png
[SouthEast 3]: /images/20220823/c6b6bbb0361149ad8af4b428237968ea.png
[http_bbs.csdn.net_topics_390678241_page_1_post-397864644]: http://bbs.csdn.net/topics/390678241?page=1#post-397864644
[http_download.csdn.net_detail_xiangyangsanren_4849558]: http://download.csdn.net/detail/xiangyangsanren/4849558