【问题标题】:Detect when "Inspect Element" is open检测“检查元素”何时打开
【发布时间】:2017-06-30 19:51:18
【问题描述】:

Samy Kamkar 的网站 http://samy.pl 知道控制台何时打开,并在打开时擦除源/控制台。

这是如何工作的?

【问题讨论】:

  • 在 Opera 中不适合我。必须是特定于浏览器的东西。你在 Chrome 上吗?
  • 是的,Windows 10 上的 Chrome 56
  • 适用于我的 Opera (44)、Firefox 甚至 IE
  • IE?圣烟。编辑:也可以在 Edge 上工作
  • 代码是right there。呃,如果你用正确的引用加载那个 url 并解码空白。

标签: javascript


【解决方案1】:

这需要一些挖掘。 samy.pl 在此代码之上具有多个级别的间接和混淆。它使用与 JohanP 发现的 the GitHub repository 不同版本的检测代码。 samy.pl 中的代码,与 GitHub 仓库不同,devtools 未停靠时可以检测到。

它通过使用一个简短的脚本来实现这一点,该脚本根据 devtools 是打开还是关闭而执行不同的操作。

示例脚本

这是一个独立的示例;在浏览器中打开它,并注意在打开和关闭开发工具时输出如何变化(无论是否停靠):

<!DOCTYPE html>
<html>
    <body>
        <pre id="output"></pre>
        <script type="text/javascript">
            var element = new Image;
            var devtoolsOpen = false;
            element.__defineGetter__("id", function() {
                devtoolsOpen = true; // This only executes when devtools is open.
            });
            setInterval(function() {
                devtoolsOpen = false;
                console.log(element);
                document.getElementById('output').innerHTML += (devtoolsOpen ? "dev tools is open\n" : "dev tools is closed\n");
            }, 1000);
        </script>
    </body>
</html>

工作原理

setInterval 每秒执行一次。 console.log 始终执行,无论开发工具是打开还是关闭:始终定义 console 对象。但是,log 方法仅在开发工具打开时将输出写入控制台。如果 devtools 关闭,console.log 是空操作。这是让您检测开发工具是否打开的关键:检测日志操作是否为空操作。

在向控制台写入element的过程中,它获取了元素的id。这调用了__defineGetter__ 附加的函数。因此,console.log(element) 仅在开发工具打开且console.log 不是空操作时调用该函数。该标志设置在该函数中,为我们提供了每秒更新的 devtools 状态视图。

samy.pl 使用了一些额外的技巧来隐藏这一点:控制台也每秒被清除一次,并且此代码使用空格 (!) 编码进行混淆。

【讨论】:

  • 我们应该写一份 Chrome/Chromium 错误报告来防止这种行为吗?我有点不喜欢人们知道我有那个开放。
  • 很好的答案。如果你有时间,你能扩展最后一句话吗? and this code is obfuscated with a whitespace (!) encoding 谢谢!
  • @Jake 混淆本身就是一个答案!包含此检测的源代码通过将每个字符转换为其 ASCII 字符代码的二进制表示进行编码(例如 'A' == '1000001');然后将每个 0 转换为空格,将 1 转换为制表符。该空白字符串被转换回二进制,然后是 HTML,并使用此 JS 执行(其中s 是空白字符串):s.replace(/.{7}/g,function(w){document.write(String.fromCharCode(parseInt(w.replace(/ /g,'0').replace(/ /g,'1'),2)))})
  • @Jake 我没有查看 load.js,但从 samy.pl 提供的内容中发现了这一点。设置执行前断点(在 Chrome devtools 中,通过 Sources 选项卡 > Event Listener Breakpoints > Script > Script First Statement)让我在代码执行时单步执行,这是最有价值的。这包括解码和混淆代码,让我有机会干预或阻止其中的一些。
  • 这真的很酷,只需要弄清楚如何打败它 :) 对不起 samy。要打败它,输入console.log = function() {},浏览器会重新加载,然后快速按下回车再次运行,就可以看到源码了。 imgur.com/a/1dBPn
猜你喜欢
  • 1970-01-01
  • 2012-08-30
  • 2022-10-13
  • 2015-08-25
  • 1970-01-01
  • 2020-05-06
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多