防调试手段

1.禁用开发者工具

监听是否打开开发者工具，若打开，则直接调用 JavaScript 的 window.close( )方法关闭网页

① 监听 F12 按键、监听 Ctrl+Shift+I（Windows 系统）组合键、监听右键菜单，监听 Ctrl+s 禁止保存至本地，避免被 Overrides。

<script>
  //监听F12、Ctrl+Shift+i、Ctrl+s
  document.onkeydown = function (event) {
    if (event.key === 'F12') {
      window.close()
      window.location = 'about:blank'
    } else if (event.ctrlKey && event.shiftKey && event.key === 'I') {
      //此处I必须大写
      window.close()
      window.location = 'about:blank'
    } else if (event.ctrlKey && event.key === 's') {
      //此处s必须小写
      event.preventDefault()
      window.close()
      window.location = 'about:blank'
    }
  }

  //监听右键菜单
  document.oncontextmenu = function () {
    window.close()
    window.location = 'about:blank'
  }
</script>

② 监听窗口大小变化

<script>
  var h = window.innerHeight,
    w = window.innerWidth
  window.onresize = function () {
    if (h !== window.innerHeight || w !== window.innerWidth) {
      window.close()
      window.location = 'about:blank'
    }
  }
</script>

③ 利用 Console.log

<script>
  //控制台打开的时候回调方法
  function consoleOpenCallback() {
    window.close()
    window.location = 'about:blank'
    return ''
  }

  //立即运行函数，用来检测控制台是否打开
  !(function () {
    // 创建一个对象
    let foo = /./
    // 将其打印到控制台上，实际上是一个指针
    console.log(foo)
    // 要在第一次打印完之后再重写toString方法
    foo.toString = consoleOpenCallback
  })()
</script>

2 无限 debugger 反调试

① constructor

<script>
  function consoleOpenCallback() {
    window.close()
    window.location = 'about:blank'
  }

  setInterval(function () {
    const before = new Date()
    ;(function () {}).constructor('debugger')()
    // debugger;
    const after = new Date()
    const cost = after.getTime() - before.getTime()
    if (cost > 100) {
      consoleOpenCallback()
    }
  }, 1000)
</script>

② Function

<script>
  setInterval(function () {
    const before = new Date()
    ;(function (a) {
      return (function (a) {
        return Function('Function(arguments[0]+"' + a + '")()')
      })(a)
    })('bugger')('de')

    // Function('debugger')();

    // debugger;
    const after = new Date()
    const cost = after.getTime() - before.getTime()
    if (cost > 100) {
      consoleOpenCallback2()
    }
  }, 1000)
</script>

3.反反调试手段

① 禁用开发者工具

针对判断是否打开开发者工具的破解方式很简单，只需两步就可以搞定。

① 将开发者工具以独立窗口形式打开

② 打开开发者工具后再打开网址

② 无限 debugger

针对无限 debugger 反调试，有以下破解方法

① 直接使用 dubbger 指令的，可以在 Chrome 找到对应行（格式化后），右键行号，选择 Never pause here 即可。

② 使用了 constructor 构造 debugger 的，只需在 console 中输入以下代码后，点击 F8（Resume script execution）回复 js 代码执行即可（直接点击小的蓝色放行按钮即可）。

Function.prototype.constructor = function () {}

③ 使用了 Function 构造 debugger 的，只需在 console 中输入以下代码。

Function = function () {}

4.总结

JavaScript 混淆加密使得代码更难以被反编译和分析，从而提高了代码的安全性，攻击者需要花费更多的时间和精力才能理解和分析代码，从而降低了攻击者入侵的成功率，但它并不能完全保护代码不被反编译和分析，如果攻击者有足够的时间和资源，他们仍然可以理解代码并找到其中的漏洞，道高一尺，魔高一丈，任何客户端加密混淆都会被破解，只要用心都能解决，我们能做的就是拖延被破解的时间，所以尽量避免在前端代码中嵌入敏感信息或业务逻辑。