当前课程知识点:软件开发实训--动态网站开发 > 13 网站配置管理实现 > 13.3网站配置调试 > 13.3.1网站配置调试
同学你好
欢迎回到软件开发实训课堂
上节课我们已经实现了网站配置的相关模板
以及类接口
那么这节课我们来看一下
他是否能够使用我们对它进行一个调试
打开控制台
我们进入数据库
我们来看一下
网站中有什么
还没有任何消息
我们可以插入一些数据
skey,stype,svalue,title,webvisible
skey第一个我们输入logo
第二个类型
logo是image
值我们可以空着
标题
前端网站可见
所以我们用一第二个ICP的备案
我们把备案信息放在这里
类型它是纯文本的
这里我们先空
标题呢
我们用拼音
也是前端可见
这样我们插入了两条数据
看一下
登录后台
然后输入editorsite
可以看到配置已经出来了
它的标题它的相应的值
我们来看一下
这里边logo出来是一个
文本框
不应该logo它是image类型
stype等于text才会出现是文本框
而我们目前出现的是一个文本框
这是不应该的
我们来看一下
他是文本框
很明显
这是不对的
它是一个图片
是图片应该出现浏览按钮
我们来输出一下他的信息
刷新页面
我们看一下
logo也是text
查询一下数据库
好
logo的类型
stype也是零
那么这是因为我们刚才直接用大写的image
和text输入了
我们把它改一下
它需要的是数字
而不是字符串
我们说image我们看一下
在我们的image类型里面
他排了第几012image是2
所以我们要把它设为2
设好后我们来看一下
这里出现了错误
那就是说我们的转换出现问题
svalue这个值是不存在的
哪里出现了svalue
如果是image
所以他image这块应该是出现了错误
看这里
svalue
刷新
好
这样我们就得到了图片浏览的按钮
那么我们可以让他打开图片对话框
在这里一样的可以加一个脚本
把他的ID设为
我们自己的ID值
svalue
这里边加上一个editor
再加上
S ID值
这样我们会得到一个隐藏的编辑框的模式
然后我们写上script
这个脚本
注意上面的我们用plain
纯文本内容就可以了
然后下面我们定一个UE
get editor
那么它的ID可以通过这样的方式来获取
svalue下划线editor
下划线
单引号加上我们的S点SID
最后把SID给它
并且让编辑器隐藏
给编辑器
增加一个监听
你可以把这个代码写成一个共享代码
这个下去以后自己研究一下
before
ExecCommand在执行命令之前
我们拦截它执行一个函数
这个函数会得到三个参数
其中第二个
b是insertimage
如果是他的话
那么我们让ID
需要把它加上
在这里我们也要重新获取一下它的ID值
svalue
下划线加上就可以了
同样是这个图片也有一个ID
我们也得给它加上
相关的
ID因为这样的话
我们可以独立它
否则的话我们有多个图片的话
这ID是一样的
就会发生混乱
加上一个数字
注意下划线带上
同样在这里也把它拿过来
动态的生成
一定要和上面对应
那么SID就有了
有了以后
我们需要把SID都给他带上
带到我们的ue对象上去
把这三个对象全部给它带上
然后我们在这里面就容易找了
我们就能够得到ID
从而设置它的src值为
C的
第一个元素的第零个元素
src
得到这个图片
同样的
我们要把
隐藏的值框也给它改掉
也就是svalue这个框给它改掉
那么它是SID它的值为
最后我们调用这个按钮
点击这个按钮来执行我们对应的对话框
弹出窗
一样的
把upimage也给它加上我们的ID也让他的ID
唯一化
要不然发生冲突
加上下划线
那么在这里怎么用
我们只需要这样去用它就可以了
同样的先把这个动态的拿到
up image下划线
加上S点
SID
upSID注意前面加个井号
click
点击始键
打开对话框
注意在这里
把ue存一下
因为它是循环
ue会被覆盖
所以我们需要存在当前按钮上
所以我们会得到
按钮的数据ue
得到后我们getDialog
insert
image
最后带了个点open
把对话框打开
这样我们的代码就写完了
我们来测试一下
那么我们打开在线管理的时候
发现这个图片根本没有显示出来
我们看一下他出了什么问题
在这里我们看到它加载的路径完全就是本地
磁盘
所以它的路径一定出了问题
我们打开我们的开发环境
进入到这里边
我们看到他实际上把root传递给了ConfigManager
我们找到ConfigManager
关于图片列表
在这儿列出图片来
把它跟踪一下
进来后
我们看到执行的过程
这个路径再给过来
我们进入到文件
这里边就是我们生成的数据就在这里
也就是说在list文件里面
它生成了相关的内容
看一下listFile
在list File里边
这里是读取文件
我们在这里拦截一下
好
到达这里时我们读到了一个文件
读到一个文件后
我们看一下
他到这里来
把所有的文件转换成了一个对象
进入到 getState这里来处理文件
我们再拦截它
执行进来后
这些文件都进行了转换
看一下在这里
在这里来存储他的url
你看到
好
这有个getPath
我们来看在这下面
get path的作用是把
这个路径给它替换掉
我们来看一下替换的内容
好
看一下
在这里替换的时候
我们看一下
这前面是这样子的
而我们的root path是这样子的
看一下有没有发现什么不同
它两个的路径分隔斜杠是不一样的
看一下这个是反斜杠
这个是斜杠
所以很明显它根本就没有替换成功
那么我们到这里来看一下
state里边你看它这个路径依然是存在的
这个路径是错误的
那么问题出在了哪里
我们来看一下
谁把这个路径给换了
我们让它运行完成到这里来
我们重新进入
来看一下rootpath
它的斜杠是这样子的
并不是是反斜杠
而不是那样的斜杠
我们肯定有地方把它换掉了
来看一下这几个类
谁把它换
好
到这里是
好到这里已经被换掉了
也就是说我们这里有换掉他的地方
那么进入到类的时候
我们看一下
这里有一个替换看一下
他进来的时候把它换掉
马上注释掉
不允许它替换
现在我们再次运行
把这都去掉
断点去掉
我们设的断点去掉
然后我们再来看
好
重新登录一下
上传文件
把断点去掉
直接执行
去掉所有的断点
这个时候你看一下图片的浏览出现了
并且能够选中它
然后确定
这样我们就完成了站点设置中关于内容提交的
表单
当然这个文本框也是没有问题的
这里图片消失了
是因为我们并没有去保存
它刚才没有保存
我们来保存一下
好
这样就好了
好
这是有关网站的配置的设置
对于html的值下去以后
你自己把它加上
它和文本框是一样的
无非是加了一个父文本编辑器
好
有关网站的配置管理我们就讲到这里
下节课我们再见
-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随堂测试