关键词:
项目中使用UEditor发现设置图片自定义保存路径会出现《请求后台配置项http错误,上传功能将不能正常使用!错误》
/* 上传图片配置项 */ "imageActionName": "uploadimage", /* 执行上传图片的action名称 */ "imageFieldName": "inputForm", /* 提交的图片表单名称 */ "imageMaxSize": 1024000, /* 上传大小限制,单位B */ "imageAllowFiles": [".png", ".jpg", ".jpeg", ".gif", ".bmp"], /* 上传图片格式显示 */ "imageCompressEnable": true, /* 是否压缩图片,默认是true */ "imageCompressBorder": 1600, /* 图片压缩最长边限制 */ "imageInsertAlign": "none", /* 插入的图片浮动方式 */ "imageUrlPrefix": "/cms/static/userfiles/", /* 图片访问路径前缀 */ "imagePathFormat": "/yyyymmdd/timerand:6", /* 上传保存路径,可以自定义保存路径和文件名格式 */
原因在于UEditor提供的 ueditor-1.1.2.jar 之中的 ConfigManager 类获取不到 config.json 文件
上传图片会获取controller.jsp地址
//ueditor.config.js
var URL = window.UEDITOR_HOME_URL || getUEBasePath(); /** * 配置项主体。注意,此处所有涉及到路径的配置别遗漏URL变量。 */ window.UEDITOR_CONFIG = //为编辑器实例添加一个路径,这个不能被注释 UEDITOR_HOME_URL: URL // 服务器统一请求接口路径 , serverUrl: URL + "jsp/controller.jsp"
执行controller.jsp,rootPath 是要保存图片的路径
//controller.jsp <% request.setCharacterEncoding( "utf-8" ); response.setHeader("Content-Type" , "text/html"); String rootPath = application.getRealPath( "/" ); out.write( new ActionEnter( request, rootPath ).exec() ); %>
修改后
<% request.setCharacterEncoding("utf-8"); response.setHeader("Content-Type", "text/html"); // String rootPath = application.getRealPath( "/" ); String rootPath = Global.getConfig("userfiles.basedir");//图片保存目录,会与imagePathFormat拼接起来,此为主要保存路径,imagePathFormat可以只设置图片名称 String jsonPath = Global.getConfig("userfiles.jsonPash"); //config.json 目录 out.write(new ActionEnter(request, rootPath, jsonPath).exec()); %>
ActionEnter执行了 ConfigManager.getInstance 传入了 request.getRequestURI()
request.getRequestURI()获取的是 controller.jsp文件的相对路径
//ActionEnter类
public ActionEnter(HttpServletRequest request, String rootPath) this.request = request; this.rootPath = rootPath; this.actionType = request.getParameter("action"); this.contextPath = request.getContextPath(); this.configManager = ConfigManager.getInstance(this.rootPath, this.contextPath, request.getRequestURI());
修改后
public ActionEnter(HttpServletRequest request, String rootPath, String jsonPath) this.request = request; this.rootPath = rootPath; this.actionType = request.getParameter("action"); this.contextPath = request.getContextPath(); this.configManager = ConfigManager.getInstance(this.rootPath, this.contextPath, jsonPath);
此时 ConfigManager 方法用你的图片保存路径加上 controller.jsp 的相对路径去找 config.json,就出现找不到的情况,可以修改jar包,把 request.getRequestURI()更改为变量,以传参方式把地址传进来,再把if去掉,直接使用传 uri 给 File
//ConfigManager类
public final class ConfigManager private final String rootPath; private final String originalPath; private final String contextPath; private static final String configFileName = "config.json"; private String parentPath = null; private JSONObject jsonConfig = null; private static final String SCRAWL_FILE_NAME = "scrawl"; private static final String REMOTE_FILE_NAME = "remote"; private ConfigManager(String rootPath, String contextPath, String uri) throws FileNotFoundException, IOException rootPath = rootPath.replace("\\\\", "/"); this.rootPath = rootPath; this.contextPath = contextPath; if (contextPath.length() > 0) this.originalPath = this.rootPath + uri.substring(contextPath.length()); else this.originalPath = this.rootPath + uri; this.initEnv(); public static ConfigManager getInstance(String rootPath, String contextPath, String uri) try return new ConfigManager(rootPath, contextPath, uri); catch (Exception var4) return null; //获取 config.json private void initEnv() throws FileNotFoundException, IOException File file = new File(this.originalPath); if (!file.isAbsolute()) file = new File(file.getAbsolutePath()); this.parentPath = file.getParent(); String configContent = this.readFile(this.getConfigPath()); try JSONObject jsonConfig = new JSONObject(configContent); this.jsonConfig = jsonConfig; catch (Exception var4) this.jsonConfig = null; //获取 config.json 路径 private String getConfigPath() return this.parentPath + File.separator + "config.json";
修改后
private ConfigManager(String rootPath, String contextPath, String jsonPath) throws FileNotFoundException, IOException rootPath = rootPath.replace("\\\\", "/"); this.rootPath = rootPath; this.contextPath = contextPath; this.originalPath = jsonPath; this.initEnv();
图片上传成功
百度富文本编辑器ueditor自定义上传图片接口
如下图: 然后修改ueditor.all.js 查看详情
django之百度ueditor富文本编辑器后台集成(代码片段)
Python3+Django2.0百度Ueditor富文本编辑器的集成百度富文本编辑器官网地址:http://fex.baidu.com/ueditor/ 疑问:为什么要二次集成?答案:因为百度富文本编辑器Ueditor没有对python的支持 步骤1: 在官网下载Ueditor的任意版本代... 查看详情
百度富文本ueditor编辑器的使用(代码片段)
...富文本编辑器,这里我们来使用百度提供的富文本编辑器UEditor,以提高我们的开发效率UEditor官网下载地址:https://ueditor.baidu.com/website/download.html 这里我下载的是jsp版本中的UTF-8版,然后将压缩包解压之后是这个样子解压内容... 查看详情
springboot整合百度ueditor富文本
百度的富文本没有提供Java版本的,只给提供了jsp版本,但是呢springboot如果是使用内置tomcat启动的话整合jsp是非常困难得,今天小编给大家带来springboot整合百度富文本需要做哪些 1.先将百度提供的demo和js导入项目中 2.编... 查看详情
百度富文本(ueditor)选择图片慢
ueditor.all.js/ueditor.all.min.js中修改如下信息将:accept="image/*"修改为:accept="image/jpg,image/jpeg,image/png,image/bmp,image/gif" 查看详情
springmvc--对接ueditor(富文本编辑器)(代码片段)
工作中需要用到UEditor编辑文本,在与springMVC进行整合时,出现了一些问题,结果导致,在进行图片上传时出现如下提示: 上网查询了很多相关资料,此处简要记录下,防止以后遇到类似问题。 一种方式是直接修改源码... 查看详情
在vue2.0中集成ueditor富文本编辑器(代码片段)
...片上传和视频上传的支持并不是很好,最终还是决定使用UEditor。这类的文章网上有很多,我进行了摸索、手写代码、汇总、排版,形成了这篇文章。下载对应的UEditor源码首先,去官网上下载UEditor的源码,根据你后台语言的不同... 查看详情
百度富文本编辑器ueditor添加到pom(代码片段)
...lt;dependency><groupId>com.baidu</groupId><artifactId>ueditor</artifactId><version>1.1.2</version><scope>system</scope><systemPath>$project.basedir/src/main/webapp/WEB-INF/lib/ueditor-1.1.2.jar</systemPath></dependency>由于富文... 查看详情
百度富文本编辑器的使用(代码片段)
...肯定不够用,现在看看功能强大的富文本编辑框吧1.ueditor官方地址:http://ueditor.baidu.com/website/index.html 开发文档地址: http://ueditor.baidu.com/website/document.ht 查看详情
百度富文本框ueditor(代码片段)
官网http://ueditor.baidu.com/website/index.html下载官网下载JSP版本,1.4.3.3的UTF-8版本使用解压后重命名为ueditor,放入WEB-INF/plugin文件夹下面。把jsp中的两个lib包放入项目lib中。 因为在WEB-INF不可以直接访问,所以要在springmvc.xml中配置... 查看详情
新手如何在vue项目中优雅的使用ueditor(百度富文本编辑器)(代码片段)
1、去官网,下载ueditor,解压,重命名,放在vue项目中的static文件夹下。 ps:新手会觉得在官网上有几种不同版本的文件,俺到底要下载哪一个,如果你仅仅是一个前端,那么好,只要是最新版本的UEditor,随便下,如果你比... 查看详情
使用百度umeditor富文本编辑器,修改自定义图片上传,修改源码
...,现在改名了,比较流行的一个插件,国外很多公司在用UEDITOR:百度开发的插件,lite版是UMEasyUI编辑器:用easyUI的都懂,基本上肯定用到其他的富文本编辑器就不说了,前两个小编我用的比较多本来我是比较倾向于CKEditor,但是... 查看详情
vuequilleditor自定义图片/视频上传(elementui+oss)字体字体大小段落等(代码片段)
...用富文本编辑器,开始想到的富文本编辑器是百度的UEditor,UEditor功能齐全、插件多,但是图片只能上传到本地服务器,如果需要上传到其他服务器需要改动源码,而且是PHP、JSP、ASP、.Net版本,同时UEditor... 查看详情
ueditor编辑器怎么调用
ueditor编辑器的调用方法:1、官方下载最新ASP版本,解压后文件夹自行修改,建议放在根目录下。2、用记事本打开\\bdu123\\asp\\config.json文件,修改里面图片、音乐、附件等的上传地址,../../upload代表上传的图片将自动放在网站根... 查看详情
类百度富文本编辑器文件上传。(代码片段)
在项目安开发中,有一个需求是用户需上传特定的text文件,根据此文件判断设备的状态。以上是需求,此时需要在页面上用到文件上传的功能,原始的文件上传样式不好看,自己此段时间一直都在用layui前端框架写页面,本想用... 查看详情
ueditor富文本编辑器时,插入图片没有任何反应(代码片段)
1、信息:Unabletofind‘struts.multipart.saveDir‘propertysetting.Defaultingtojavax.servlet.context.tempdir这是struts需要在struts.xml配置临时文件夹。只需要在struts.xml的<struts></struts>中添加一下语句即可。<constantname= 查看详情
百度ueditor富文本编辑器上传视频设置封面和禁止视频全屏下载功能
最近在工作中用到了ueditor,这个最开始不是我接入到后台管理系统的,我半路接手,百度官方给的文档又写的很一般,不易理解,所以有很多问题解决的很麻烦。在使用ueditor过程中,目前遇到的一些问题:我们公司运营需要用u... 查看详情
djangoxadmin集成djangoueditor富文本编辑器(代码片段)
本文档记录自己的学习历程!介绍UeditorHTML编辑器是百度开源的在线HTML编辑器,功能非常强大额外功能解决图片视频等无法上传显示问题Ueditor下载地址https://github.com/wsqy/DjangoUeditor.git解压后将DjangoUeditor文件夹复制到django项目目录... 查看详情