ueditor前后端分离下的图片上传解决方法

一个小项目,简称(A项目),因为是做的前后端分离,后端用spring boot打的jar包,前端需要用到ueditor保存图片,搞了好久没搞出来,网上查到的大部分都是对源码进行修改的,对于一个新手来说太过高级,根据公司一位前辈的方法,可以先在服务器上增加一个ueditor项目,放到服务器中的tomcat的webapps文件夹下,然后A项目中ueditor.config.js中的serverUrl改成新增的ueditor的接口,讲的很笼统,具体如下

IDE:Eclipse

Server:Tomcat

一:根据官方文档(http://fex.baidu.com/ueditor/#server-jsp?qq-pf-to=pcqq.c2c)创建一个ueditor项目并配置到服务器tomcat上

JSP 使用说明

1 背景

UEditor 1.4.0 版本对之前的配置方式进行了简化，具体请参见：后端请求规范，为了适应这次升级，JAVA 后台也进行了重写，跟之前的版本差别较大，升级的用户注意阅读本文档。

本文档介绍 UEditor JAVA 后台的部署和配置说明。

注意：本文档仅适用于1.4.0之后的Java版UEditor。

2 先决条件

1. JDK 1.6+
2. Apache Tomcat 6.0+
3. UEditor 1.4.0+

3 示例环境

3.1 软件版本信息

1. JDK 6u45
2. Tomcat 6.0.41
3. UEditor 1.4.3 UTF-8 Java版
4. OS: Windows7 Ultimate SP1 X64
5. Eclipse 4.4.0

3.2 软件路径信息

1. Tomcat 安装路径：

   D:\apache-tomcat-6.0.41\

4 部署

4.1 手动部署

1. 解压对应的UEditor压缩包至Tomcat的webapps目录下，最终，UEditor的安装路径为：

   D:\apache-tomcat-6.0.41\webapps\ueditor1_4_3-utf8-jsp\

2. 进入目录：

   D:\apache-tomcat-6.0.41\webapps\ueditor1_4_3-utf8-jsp\

   创建如下两个文件夹（注意区分大小写）：

   WEB-INF\lib\

3. 拷贝目录：

   D:\apache-tomcat-6.0.41\webapps\ueditor1_4_3-utf8-jsp\jsp\lib\

   下的所有jar包到第2步创建的lib目录下，结果如图所示：

4. 部署完成，双击以下脚本文件，启动Tomcat（需要正确配置JAVA_HOME环境变量）。

   D:\apache-tomcat-6.0.41\bin\startup.bat

   出现如下所示界面，则表示服务器启动成功。

5. 进入5 验证安装步骤，验证部署是否成功。

4.2 Eclipse部署

1. 在Eclipse中配置Tomcat 6.0。

2. 在Eclipse中创建一个名为

   ueditor1_4_3-utf8-jsp

   的“Dynamic Web Project”项目。如下图所示：

3. 解压下载的UEditor包到D盘根目录。

4. 在Eclipse中的项目

   ueditor1_4_3-utf8-jsp

   下的“WebContent”目录上右击，在弹出的菜单中选择：Import->Import...，弹出如下图所示对话框：

5. 在弹出的对话框中展开General项，双击“File System”后弹出对话框，如下图所示：

6. 点击“Browse...”按钮，在弹出的文件选择对话框中选中第3步中解压出来的ueditor文件夹，并勾选全部文件，结果如下图所示：

7. 点击“Finish”按钮，完成导入。

8. 拷贝目录jsp/lib/下的所有jar包到WEB-INF/lib/目录下， 部署至此完成，最终项目的结构如下图所示：

9. 添加该项目到Tomcat中，并启动Tomcat，在Eclipse的“Console”面板中出现如下图所示的界面时，启动成功。

10. 进入5 验证安装步骤，验证部署是否成功。

5 验证安装

在浏览器地址栏中输入如下URL：

http://localhost:8080/ueditor1_4_3-utf8-jsp/jsp/controller.jsp?action=config

出现类似下图所示内容，则配置成功，否则，即为失败。

6 移动项目

在Eclipse的tomcat中,项目中右键,Browse Deployment Location,复制整个项目,再找到服务器的tomcat,将项目复制到webapps下,在URL输入: 

域名(或ip:端口号)/ueditor1_4_3-utf8-jsp/jsp/controller.jsp?action=config

如果出现跟上一步一样的结果,则表示已经配置好了

二:A项目中的ueditor配置

找到A项目中的ueditor.config.js,将第33行, serverUrl: URL + "jsp/controller.jsp"  改成    serverUrl: 域名(或ip:端口号)/ueditor1_4_3-utf8-jsp/jsp/controller.jsp

以上就完成了前端服务器上的ueditor配置,具体图片保存路径配置,可以参考一下文章

注:图片保存路径和图片的访问路径前缀是在 ueditor1_4_3-utf8-jsp/jsp/config.json 中修改的

http://blog.csdn.net/shaochong047/article/details/52673648?locationNum=13