当前课程知识点:软件开发实训--动态网站开发 > 12 UEditor富文本编辑器 > 12.1修改UEditor相关问题 > 12.1.1修改UEditor相关问题
同学你好
欢迎回到软件开发实训课堂
上节课咱们把内容表单中的分类进行了实现
那么我们前面也说了
在内容的编辑里边
必须要有一个父文本来编辑它的内容
这节课我们就来看一下
如何将UEditor引入到我们的内容编辑中来
首先我们要去下载UEditor
为了能够在项目中使用UEditor
我们需要下载它的完整的源码包
对它的源码进行修改
下载后我们先解压
解压完成后
我们将文件夹修改为UE
进入到UE文件夹
将所有下划线以及不相关的内容删掉
这样就留下一个JSP的相关内容
但是我们用的是spring框架
因此我们需要把它的SrC目录下的内容复制
到我们的项目中去
在源包上把他粘进来
这样将百度中他的Java相关的源代码就
复制进来了
下一步
将SrClib可以删掉
然后将UE文件夹复制到我们项目中去
复制到哪里
放在我们的static这个目录下
把它粘上
这样我们就多出来一个UE相关的文件夹
内容比较多
那么这里边我们展开时并看不到什么东西
为了能够看到
我们点击右键选择打开项目文件夹
因为这个UE它本身就是一个项目
打开后
我们的项目文件夹里多了一个项目
在这里我们可以去掉有关JSP的内容
在去掉之前
我们需要对它进行修改
第一部看这个controller.jsp
我们把controller.jsp
的这些内容给它复制下来
在我们的代码里去新建一个控制器
那么我们就把它放在UE下面
在UE文件夹上
我们来点击右键
选择新建java类
在这里我们加一个UEditor的控制器
然后我们用注解注明这是一个控制器
添加相关的方法
这个编辑器它所请求的路径
是get模式
所以我们用getMapping就可以了
然后我们要返回的是一个对象
叫做ActionEnter
把我们复制的代码粘进来
这里你发现他需要一个request
我们需要把它注入进来
对于响应也可以注入进来
关于路径的获取
我们可以用request获得我们的上下文对象
然后获取它的路径
最后我们只需要返回这个对象就可以了
现在我们导入需要的注解以及相关的类
我们可以把这句话注释掉
不需要它导入
错误是返回的对象
我们需要把它ResponseBody
把它转换一下
它返回的是一个字符串
我们必须用字符串来处理这个对象
看一下这个方法
好
把所有的内容返回去
这样我们就有了编辑器与后台交互的入口
我们把配置写到编辑器中去
找到UEditor项目下面的uid的config.js
打开后
找到它的服务地址给他改过来
我们用的是UEditor
斜杠可以不需要
因为url它得到的就是一个以斜杠结尾的
路径
所以我们只需要加上UE斜杠editor就可以了
这样我们把前后台就关联好了
有了这个以后
我们来解决相关类中出现的问题
第一个是它actionint
可以看一下
它是一个JSON对象
这里我们来看一下叫做configManager
我们找到configManager
因为configManager有错
所以他也就爆出了错误
首先是这个包找不着
因为我们用的是阿里巴巴的JSON
所以我们把这个可以去掉
去掉以后这里必然会有错
我们导入阿里巴巴的相关JSON对象
导进来
然后改掉他的方法
求元素个数
用的是
用的是静态的方法
所以我们直接调用静态方法就可以了
给过来
关于货的整型值
它用的方法叫get IntValue
方法名有区别
好
经过这样修改后
看一下ConfigManager
他的错误消失了
然后紧跟着ActionEnter也消失了错误
现在回过头来再看一下
file manager的错误
很显然他用的是apache commons
文件流
我们来看一下
我们可以把这个包给他导进来
为了导入这个包
我们去搜索一下他的maven
在百度里边打开maven库的链接
我们搜索commons-oi
这样我们会得到IO的链接
进入后我们点击最新的链接
然后取得他的maven依赖
放到我们的项目中去
打开项目文件common.X mail
将我们复制的依赖给它粘上
保存
我们来看一下这个问题是否还存在
打开依赖
看看他是否已经下载了common-io
已经下来了
错误也消失了
现在我们再来看Base64
在这里他用到了commons.codec
解码编码的包
我们来看一下common
code SR codec
codec我们可以把它下下来
一样的点击进去
找到它最新的复制它的依赖
打开泡common.X mail
粘上
好
Base64这个包就好了
我们再来看BinaryUploader
这是一个二进制上传
它用到的是fileupload
我们把fileupload导入进来
common
fileupload
找到后依然是把它最新版的
maven
复制过来
粘到我们的文件里
好
这就是有关UEditor修改
这节课就讲到这里
下节课我们再见
-1.1课程介绍
--1.1.3随堂测试
-1.2网站需求分析
--1.2.4随堂测试
-1.3网站首页分析
--1.3.3随堂测试
-1.4导航菜单分析
--1.4.3随堂测试
-1.5内容区域分析
--1.5.3随堂测试
-1.6内容副页面分析
-1.7编写需求文档
-2.1后端页面总体分析
--2.1.3随堂测试
-2.2用户管理功能设计
--2.2.3随堂测试
-2.3内容与分类功能分析
--2.3.3随堂测试
-2.4网站配置功能设计
--2.4.4随堂测试
-2.5数据库及表结构分析
-总体设计文档
-3.1前台模板约定
--3.1.3随堂测试
-3.2网站配置接口设计
--3.2.3随堂测试
-3.3菜单接口设计
--3.3.3随堂测试
-3.4内容接口设计
--3.4.3随堂测试
-3.5幻灯片接口设计
--3.5.3随堂测试
-补充设计文档
-4.1用户管理功能设计
--4.1.3随堂测试
-4.2菜单管理功能设计
--4.2.3随堂测试
-4.3内容管理功能设计
--4.3.3随堂测试
-4.4网站配置信息设计
--4.4.3随堂测试
-完成设计文档
-4.6随堂测试
-5.1开发环境搭建
--5.1.2随堂测试
-5.2Web前端环境搭建
-5.3创建用户实体
--5.3.2随堂测试
-5.4用户实体表创建与初始化
--5.4.2随堂测试
-5.5用户数据访问接口实现
--5.5.2随堂测试
-5.6环境搭建问题
-6.1用户服务层接口实现
--6.1.2随堂测试
-6.2用户列表和编辑控制器实现
--6.2.2随堂测试
-6.3用户存储和删除控制器实现
-6.4用户添加、编辑界面实现
-6.5用户管理添加用户调试
-7.1用户查询模板实现
--7.1.2随堂测试
-7.2用户信息编辑的实现
-7.3单个用户删除实现
-7.4多个用户删除实现
-8.1用户列表分页基本实现
-8.2用户列表查询结果分页实现
-8.3通用日期处理
-8.4整型日期处理
--8.4.2随堂测试
-8.5枚举数据的应用
-9.1登录逻辑实现
--9.1.2随堂测试
-9.2登录界面及流程调试
--9.2.2随堂测试
-9.3管理主界面实现
--9.3.2随堂测试
-9.4授权验证拦截器实现
--9.4.2随堂测试
-9.5拦截器调试
-10.1分类接口实现
-10.2分类添加、编辑实现
-10.3分类树结构实现
-10.4分类删除实现
--10.4.2随堂测试
-11.1内容实体定义
-11.2相关接口定义
-11.3服务接口实现
-11.4内容添加、编辑模板实现
-11.5内容添加、编辑控制器实现
-11.6内容检索页面实现
-11.7内容分类树实现
-12.1修改UEditor相关问题
-12.2整合UEditor到内容编辑界面
-12.3UEditor图片对话框应用
-12.4文件上传问题处理
-13.1网站配置相关类实现
-13.2网站配置界面模板实现
-13.3网站配置调试
-14.1网站首页布局实现
-14.2菜单Vue组件实现
--14.2.2随堂测试
-14.3幻灯片Vue组件实现
-14.4滚动Vue组件实现
--14.4.2随堂测试
-14.5滚动接口实现
-14.6滚动接口调试
-14.7幻灯片接口实现
-15.1首页区域实现
-15.2首页内容脚本实现
-15.3首页完善
-15.4Vue组件放入单文件
-15.5详细页面实现
-16.1网站测试介绍
-16.2功能测试
-16.3打包发布
-16.4部署运行
--16.4.2随堂测试