线上环境有时候也需要启用vconsole来调试程序,来回部署又有些不方便
想了一个好玩的办法来隐藏vconsole
想要设置一个debug开关,在开启之后呢,我就一直处于debug模式可以使用vconsole
保持状态可以使用localstorage
开关我用的是触摸事件输入摩尔斯码开启的
大改是这个逻辑
1.设置个存放正确密码在success数组,和存放输入密码的action数组
2.监听触摸的时间长短来判断是tap还是press
3.输入的这位对应success对应位置的密码正确,就放进action数组,错误就清空action数组
4.当success数组等于action数组时,就开启开关啦
(function () {
var _YK_VC_OPEN_ = '_YK_VC_OPEN_'
var shouldOpen = localStorage.getItem(_YK_VC_OPEN_) === _YK_VC_OPEN_
if (shouldOpen) {
open()
} else {
lock()
}
function open() {
var vConsole = new VConsole();
}
function lock() {
/*
打开条件
V ...━
C ━ .━ .
*/
var TYPES = {
tap: 'tap',
press: 'press'
}
// 开启条件
var success = [
TYPES.tap,
TYPES.tap,
TYPES.tap,
TYPES.press,
TYPES.press,
TYPES.tap,
TYPES.press,
TYPES.tap
]
// action策略
var Strategy = {
[TYPES.tap]: function onTap() {
actionList.push(TYPES.tap)
},
[TYPES.press]: function onPress() {
actionList.push(TYPES.press)
}
}
// action记录
var actionList = []
var tapDuration = [0, 500]
var pressDuration = [3000, 10000]
var lastDownTime = 0
function onAction(currType) {
try {
const action = Strategy[currType]
if (typeof action !== 'function') {
throw new Error('不正确的点击')
}
if (!check(currType)) {
throw new Error('输入错误')
}
action()
// console.log('键入', currType)
if (actionList.length === success.length) {
unlock()
}
} catch (e) {
// console.log(e.message)
actionList = []
}
}
function check(currType) {
const curIndex = actionList.length
return currType === success[curIndex]
}
function onDown() {
// console.log('down')
lastDownTime = Date.now()
}
function onUp(e) {
var duration = Date.now() - lastDownTime
// console.log('up', duration)
if (duration < tapDuration[1]) {
onAction(TYPES.tap)
} else if (duration > pressDuration[0] && duration < pressDuration[1]) {
onAction(TYPES.press)
} else {
onAction('other')
}
}
function unlock() {
alert('行,你破解了密码,进入debug模式吧')
window.removeEventListener('touchstart', onDown)
window.removeEventListener('touchend', onUp)
// 存localstorage
localStorage.setItem(_YK_VC_OPEN_, _YK_VC_OPEN_)
open()
}
window.addEventListener('touchstart', onDown)
window.addEventListener('touchend', onUp)
}
})()