Facebook如何禁用浏览器的集成开发工具？

显然，由于最近的骗局，开发者工具被人们用来发布垃圾邮件，甚至被用来“黑客”账户。Facebook已经屏蔽了开发者工具，我甚至无法使用控制台。

他们是怎么做到的？？一篇Stack Overflow的帖子声称这是不可能的，但Facebook已经证明他们错了。

只需转到Facebook并打开开发工具，在控制台中键入一个字符，就会弹出此警告。无论你投入什么，它都不会被执行。

这怎么可能？

他们甚至在控制台中阻止了自动完成：

当前回答

这不是让弱代码无人看管的安全措施。在实施此策略之前，请始终为弱代码找到永久解决方案，并妥善保护您的网站

据我所知，到目前为止最好的工具是添加多个javascript文件，通过刷新或替换内容将页面的完整性恢复到正常状态。禁用这个开发工具并不是最好的主意，因为绕过总是有问题的，因为代码是浏览器的一部分，而不是服务器渲染，因此可能会被破解。

如果您让js file 1检查重要元素的＜element＞更改，js file 2和js file 3检查每个周期是否存在该文件，您将在该周期内对页面进行完整性恢复。

让我们以4个文件为例，向您展示我的意思。

索引html

   <!DOCTYPE html>
   <html>
   <head id="mainhead">
   <script src="ks.js" id="ksjs"></script>
   <script src="mainfile.js" id="mainjs"></script>
   <link rel="stylesheet" href="style.css" id="style">
   <meta id="meta1" name="description" content="Proper mitigation against script kiddies via Javascript" >
   </head>
   <body>
   <h1 id="heading" name="dontdel" value="2">Delete this from console and it will refresh. If you change the name attribute in this it will also refresh. This is mitigating an attack on attribute change via console to exploit vulnerabilities. You can even try and change the value attribute from 2 to anything you like. If This script says it is 2 it should be 2 or it will refresh. </h1>
   <h3>Deleting this wont refresh the page due to it having no integrity check on it</h3>

   <p>You can also add this type of error checking on meta tags and add one script out of the head tag to check for changes in the head tag. You can add many js files to ensure an attacker cannot delete all in the second it takes to refresh. Be creative and make this your own as your website needs it. 
   </p>

   <p>This is not the end of it since we can still enter any tag to load anything from everywhere (Dependent on headers etc) but we want to prevent the important ones like an override in meta tags that load headers. The console is designed to edit html but that could add potential html that is dangerous. You should not be able to enter any meta tags into this document unless it is as specified by the ks.js file as permissable. <br>This is not only possible with meta tags but you can do this for important tags like input and script. This is not a replacement for headers!!! Add your headers aswell and protect them with this method.</p>
   </body>
   <script src="ps.js" id="psjs"></script>
   </html>

主文件.js

   setInterval(function() {
   // check for existence of other scripts. This part will go in all other files to check for this file aswell. 
   var ksExists = document.getElementById("ksjs"); 
   if(ksExists) {
   }else{ location.reload();};

   var psExists = document.getElementById("psjs");
   if(psExists) {
   }else{ location.reload();};

   var styleExists = document.getElementById("style");
   if(styleExists) {
   }else{ location.reload();};


   }, 1 * 1000); // 1 * 1000 milsec

ps.js

   /*This script checks if mainjs exists as an element. If main js is not existent as an id in the html file reload!You can add this to all js files to ensure that your page integrity is perfect every second. If the page integrity is bad it reloads the page automatically and the process is restarted. This will blind an attacker as he has one second to disable every javascript file in your system which is impossible.

   */

   setInterval(function() {
   // check for existence of other scripts. This part will go in all other files to check for this file aswell. 
   var mainExists = document.getElementById("mainjs"); 
   if(mainExists) {
   }else{ location.reload();};

   //check that heading with id exists and name tag is dontdel.
   var headingExists = document.getElementById("heading"); 
   if(headingExists) {
   }else{ location.reload();};
   var integrityHeading = headingExists.getAttribute('name');
   if(integrityHeading == 'dontdel') {
   }else{ location.reload();};
   var integrity2Heading = headingExists.getAttribute('value');
   if(integrity2Heading == '2') {
   }else{ location.reload();};
   //check that all meta tags stay there
   var meta1Exists = document.getElementById("meta1"); 
   if(meta1Exists) {
   }else{ location.reload();};

   var headExists = document.getElementById("mainhead"); 
   if(headExists) {
   }else{ location.reload();};

   }, 1 * 1000); // 1 * 1000 milsec

ks.js

   /*This script checks if mainjs exists as an element. If main js is not existent as an id in the html file reload! You can add this to all js files to ensure that your page integrity is perfect every second. If the page integrity is bad it reloads the page automatically and the process is restarted. This will blind an attacker as he has one second to disable every javascript file in your system which is impossible.

   */

   setInterval(function() {
   // check for existence of other scripts. This part will go in all other files to check for this file aswell. 
   var mainExists = document.getElementById("mainjs"); 
   if(mainExists) {
   }else{ location.reload();};
   //Check meta tag 1 for content changes. meta1 will always be 0. This you do for each meta on the page to ensure content credibility. No one will change a meta and get away with it. Addition of a meta in spot 10, say a meta after the id="meta10" should also be covered as below.
   var x = document.getElementsByTagName("meta")[0];
   var p = x.getAttribute("name");
   var s = x.getAttribute("content");
   if (p != 'description') {
   location.reload();
   }
   if ( s != 'Proper mitigation against script kiddies via Javascript') {
   location.reload();
   }
   // This will prevent a meta tag after this meta tag @ id="meta1". This prevents new meta tags from being added to your pages. This can be used for scripts or any tag you feel is needed to do integrity check on like inputs and scripts. (Yet again. It is not a replacement for headers to be added. Add your headers aswell!)
   var lastMeta = document.getElementsByTagName("meta")[1];
   if (lastMeta) {
   location.reload();
   }
   }, 1 * 1000); // 1 * 1000 milsec

样式表

现在，这只是为了显示它也适用于所有文件和标记

   #heading {
   background-color:red;
   }

如果您将所有这些文件放在一起并构建示例，您将看到此度量的功能。如果您在索引文件中的所有重要元素上正确实现它，尤其是在使用PHP时，这将防止一些不可见的注入。

我之所以选择重新加载而不是更改回每个属性的正常值，是因为一些攻击者可能已经配置并准备好了网站的另一部分，这会减少代码量。重新加载将消除攻击者的所有努力，他可能会去更容易的地方打球。

另一个注意事项：这可能会变成很多代码，所以请保持干净，并确保将定义添加到它们所属的位置，以便于将来编辑。此外，将秒数设置为您的首选值，因为大页面上的1秒间隔可能会对访问者可能使用的旧计算机产生严重影响

2018-03-04 03:16:16

其他回答

我使用Chrome开发工具找到了Facebook的控制台脚本。以下是为提高可读性所做的小改动。我删除了我无法理解的部分：

Object.defineProperty(window, "console", {
    value: console,
    writable: false,
    configurable: false
});

var i = 0;
function showWarningAndThrow() {
    if (!i) {
        setTimeout(function () {
            console.log("%cWarning message", "font: 2em sans-serif; color: yellow; background-color: red;");
        }, 1);
        i = 1;
    }
    throw "Console is disabled";
}

var l, n = {
        set: function (o) {
            l = o;
        },
        get: function () {
            showWarningAndThrow();
            return l;
        }
    };
Object.defineProperty(console, "_commandLineAPI", n);
Object.defineProperty(console, "__commandLineAPI", n);

这样，当在控制台中键入的语句将无法执行时，控制台自动完成将以静默方式失败（将记录异常）。

参考文献：

对象定义属性对象.getOwnPropertyDescriptorChrome的console.log功能（用于格式化输出的提示）

2014-02-15 08:16:15

我有一个简单的方法：window.console=函数（）｛｝

2022-07-19 14:45:03

在内部，devtools将一个名为getCompletions的IIFE注入页面，当在devtools控制台内按下一个键时调用。

查看该函数的源代码，它使用了一些可以覆盖的全局函数。

通过使用Error构造函数，可以获得调用堆栈，当Devtools调用时，它将包括getCompletions。

例子：

2018-08-29 16:08:44

我会这样做：

Object.defineProperty(window, 'console', {
  get: function() {

  },
  set: function() {

  }
});

2018-11-14 11:17:07