概述
IPTV机顶盒开发有很多的坑,爬不完的坑,当然其他开发也是一样……哈哈哈。今天我来说一下IPTV-B/S
模式开发中调试的坑。如果你开发过机顶盒项目(以下都特指B/S
模式)[没开发过的肯定也不会看这篇文章],那你肯定经历过这种时候……写完一堆代码,然后浏览器上初步看一遍,哇,完美!赶紧上传服务器,使用机顶盒跑一下,免得代码自动消失了,哈哈哈。一顿 cd
ll
cp
rm -rf /
操作后,启动机顶盒,咦~黑屏,肯定是缓存原因,代码还未更新到,肯定不是我代码的错……等等再重启下,还是黑屏???what??难道真的代码出错???怎么办?断点调试下吧(这种方式心里想想就好了)机顶盒上根本打不开控制台好吧!!!此处建议尽早放弃,不过为了工作,毕竟工作使我快乐,还是不放弃吧……继续爬坑。打不开控制台,无法调试,那就console.log呗,多加一些,看看哪些打印了,哪些没打印呗,这不就一样能定位嘛!但……无法打开控制台!!!泪崩……怎么办,那就只能用最另一种宇宙最强的JS API
document.getElementById
我打印到页面上总行吧,好吧,遇到比较正常的问题的话,用这种方式也就完美解决了!哎,送了口气……终于解决了!页面总算是打开了,但是……居然焦点不能移动……啊,要崩溃,坑定代码哪里又报错,机顶盒的浏览器真是小气啊,啥高级属性都不能用,又怎么办?
TVConsole
来了,来了,它来了。TVConsole是一个js组件,将其引入页面中,可以显示出一个面板,也就是一个简易的浏览器控制台,就像这样。
这看起来是不是很像一个东西?对,没错,就是VConsole腾讯开发的一款移动端的控制台调试器,最初是用于微信公众号、小程序开发这方便调试用,后来,当程序员都发现了这个东西后,You Know,好东西总是会被用于很多地方,也就普及了。我也就基于这套东西,再包装了一层,用于机顶盒。
为什么再封装?
其实不止是封装,我还修改了一点源代码,这也造成了源码的污染,不利于升级。未来准备采用插件开发,不污染源码,也可以随着主框架的升级而伴随升级。
回归主题,为什么要封装?因为机顶盒开发不同于其他移动端和PC,移动端和PC都可以很容易触发 touch
click
等事件,但是机顶盒不吃你这套,所有操作都是 遥控器
,对,就是这东西!要想点击,那就得重新监听 document.onkeydown
事件,然后触发逻辑。所以咯,再封装了一层。
不讲代码,只讲使用
这里不讲代码,但是你可以在这里TVConsole https://gitee.com/underline/TVConsole
查看代码啊!已经上传码云。
使用:
- 下载
dist/tvconsole.min.js
- 引入到页面
<script src="path/to/tvconsole.min.js"></script>
建议在head中引入 - 初始化一个实例
var tvconsole = new TVConsole()
- 此后可以触发
tvconsole.show()
显示界面 - 更多方法,请看这里https://gitee.com/underline/TVConsole
进入界面后都是一些按键操作,按键后面板右上角会显示你的按键,目前支持的按键有(并持续更新):
-
1
: 显示Log
面板 -
11
: 显示Log
下的All
面板,12
: 显示Log
下的Log
面板,以此类推 -
2
: 显示System
面板 -
21
:显示System
下的All
面板,以此类推 -
#
: 隐藏控制台面板 -
*
:展开控制台打印的Object
信息 -
**
:收起控制台打印的Object
信息
暂时完了……在开发的路上越走越远