百度ueditor富文本编辑器上传文件的配置

最新推荐文章于 2024-04-07 20:42:57 发布

置顶 weixin_43106858

最新推荐文章于 2024-04-07 20:42:57 发布

阅读量2.7k

点赞数

分类专栏：插件使用文章标签： ueditor 上传图片配置 springMvc整合ueditor

本文链接：https://blog.csdn.net/weixin_43106858/article/details/88547764

版权

插件使用专栏收录该内容

1 篇文章 0 订阅

订阅专栏

有人说要改editor的源码，我感觉是不用的。人家既然是开源，肯定是已经做得很完善了。

第一步：百度ueditor官网下载ueditor demo
在这里插入图片描述
第二步：导入项目

第三步：
把架包放进web-info 下面的lib 目录下，add build path
(maven项目pom文件里引用应该也行，没试过)

第四步：
新建HTML文件，例如：我的是index.html 一个简单的demo
人家百度的这个很全面
在这里插入图片描述
自己的index.html

<!DOCTYPE HTML>
<html lang="en-US">
<head>
	<meta charset="UTF-8">
	<title>ueditor demo</title>
</head>
<body>
	<!-- 加载编辑器的容器 -->
	<script id="container" name="content" type="text/plain">这里写你的初始化内容</script>
	<!-- 配置文件 -->
	<script type="text/javascript" src="/YZYO2O/ueditor/ueditor.config.js"></script>
	<!-- 编辑器源码文件 -->
	<script type="text/javascript" src="/YZYO2O//ueditor/ueditor.all.js"></script>
	<!-- 实例化编辑器 -->
	<script type="text/javascript">
	    var ue = UE.getEditor('xx');
	</script>
</body>
<form action="/YZYO2O/upload/test">
<textarea id="xx" name="ll">
</textarea>
<input type="submit" value="提交"/>
</form>
</html>

第五步：文件上传的配置，其实没那么难
在这里插入图片描述
config.json里

 "imageUrlPrefix": "http://localhost:8018/YZYO2O", /* 项目路径 */
 "imagePathFormat": "/upload/{yyyy}{mm}{dd}/{time}{rand:6}", /* 上传到项目服务器哪个文件夹下 */

ueditor.config.js

window.UEDITOR_HOME_URL = "http://localhost:8018/YZYO2O/ueditor/";  (ueditor在项目的位置，加这一句就行)

    var URL = window.UEDITOR_HOME_URL || getUEBasePath();

    /**
     * 配置项主体。注意，此处所有涉及到路径的配置别遗漏URL变量。
     */
    window.UEDITOR_CONFIG = {

        //为编辑器实例添加一个路径，这个不能被注释
        UEDITOR_HOME_URL: URL

        // 服务器统一请求接口路径
        , serverUrl: URL + "jsp/controller.jsp"

第六步，成功！
在这里插入图片描述

weixin_43106858

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
百度ueditor富文本编辑器上传文件的配置

有人说要改editor的源码，我感觉是不用的。人家既然是开源，肯定是已经做得很完善了。第一步：百度ueditor官网下载ueditor demo第二步：导入项目第三步：把架包放进web-info 下面的lib 目录下，add build path(maven项目pom文件里引用应该也行，没试过)第四步：新建HTML文件，例如：我的是index.html 一个简单的demo...
复制链接

扫一扫