如何禁用瀏覽器開發者工具？

Question

I'm developing a web application and since it has access to a database underneath, I require the ability to disable the developer tools from Safari, Chrome, Firefox and Internet Explorer and Firebug in Firefox and all similar applications. 有沒有辦法做到這一點？

注意：數據庫提供的 AJAX 框架要求提供給數據庫的任何內容都在 web 參數中可以修改，並且它返回的任何內容都在 JavaScript 中處理。 因此，當它返回一個值，比如用戶是否可以訪問網站的某個部分時，必須在 JavaScript 中處理，然后開發人員工具無論如何都可以訪問這些值。 所以這是必需的。

更新：對於那些仍然認為我做出錯誤假設的人，我確實詢問了供應商。 以下是他們的回應：

以下是降低風險的一些建議：

1) 使用 javascript 混淆器對代碼進行混淆，並且僅在出售的應用程序中提供混淆版本； 保留非混淆版本供自己進行編輯。 這是一個在線混淆器： 如何混淆（保護）JavaScript？ http://en.wikipedia.org/wiki/Obfuscated_code http://javascriptobfuscator.com/default.aspx

2) 使用描述性較差的名稱； 也許 'repeatedtasks.js' 而不是 'security.js' 因為 'security.js' 可能會讓任何通過此類信息作為重要信息的人更加突出。

Answer 1

不，你不能這樣做<\/strong>。

開發者菜單位於客戶端，由用戶的瀏覽器提供。

此外，瀏覽器開發人員應該與您的服務器端數據庫代碼無關<\/strong>，如果這樣做，您需要進行一些 maaaaaajor 重組。

Answer 2

如果您的框架要求您在客戶端進行授權，那么...

你需要改變你的框架

當您將應用程序放在野外時，您不信任的用戶可以訪問它； 你必須在沙灘上畫一條線。

• 您擁有的物理硬件； 並且可以鎖在一扇堅固的門后面。 你可以在這里做任何你喜歡的事情； 這是保存數據庫和執行授權功能以決定誰可以對您的數據庫執行什么操作的好地方。
• 其他一切； 包括客戶端計算機上的瀏覽器； 手機； 便利亭位於您辦公室的大堂。 你不能相信這些！ 曾經！ 您無能為力，這意味着您可以完全確定這些機器不會撒謊以騙取您和您的客戶的錢。 你無法控制它，所以你永遠無法希望知道發生了什么。

Answer 3

事實上，這在某種程度上是可能的（ how-does-facebook-disable-developer-tools<\/a> ），但這對於保護您的數據來說是非常糟糕的主意。 攻擊者可能總是使用您無法控制的其他一些（開放的、自行編寫的）引擎。 即使是 javascript 混淆可能只會減慢您的應用程序的一點破解速度，但它實際上也沒有提供任何安全性。

保護數據的唯一合理方法是在服務器端編寫安全代碼。 請記住，如果您允許某人下載一些數據，他可以隨心所欲地使用它。

Answer 4

你的開發環境不可能這么<\/em>死腦筋。 這是不可能的。

我強烈建議給你的老板發電子郵件：

• 培訓\/學習計划中需要一兩個星期的時間。<\/li>
• 要求您的供應商提供足夠的支持票，以確定如何執行服務器端驗證。<\/li>
• 一個明確的警告，如果該工具無法進行服務器端驗證，當您的整個數據庫被泄露\/破壞\/等時，您將<\/em>在華爾街日報的首頁上被取笑。<\/li><\/ul>"

Answer 5

不可以。不能為您的最終用戶禁用開發者工具。

如果您的應用程序在用戶有權訪問開發人員工具的情況下不安全，那么它就是完全不安全的。

Answer 6

不要忘記像Fiddler<\/a>這樣的工具。 即使您鎖定了所有瀏覽器的控制台，即使您使用 HTTPS，也可以在客戶端上修改 http 請求。 Fiddler 可以捕獲來自瀏覽器的請求，用戶可以修改它並使用惡意輸入重新播放。 除非您保護您的 AJAX 請求，但我不知道如何執行此操作的方法。

只是不要相信您從任何瀏覽器收到的任何輸入。

Answer 7

您不能禁用開發人員工具。 但是您可能會惹惱任何嘗試在您的網站上使用開發人員工具的人，嘗試使用 javascript 代碼，代碼會一直中斷。

    (function () {
        (function a() {
            try {
                (function b(i) {
                    if (('' + (i / i)).length !== 1 || i % 20 === 0) {
                        (function () { }).constructor('debugger')()
                    } else {
                        debugger
                    }
                    b(++i)
                }
                )(0)
            } catch (e) {
                setTimeout(a, 5000)
            }
        }
        )()
    }
    )();

Answer 8

在發布此答案時（2015 年）更新，這個技巧是可能的。 現在（2017）瀏覽器已經成熟。 以下技巧不再有效！<\/strong>

對的，這是可能的。<\/s> Chrome 將所有控制台代碼封裝在<\/s>

 ...因此該站點重新定義了console._commandLineAPI<\/code>以拋出：<\/s>
這是主要技巧！<\/s>
"

Answer 9

我找到了一種方法，當用戶打開開發工具時，您可以使用debugger<\/code>關鍵字來停止頁面工作

(function(){
  debugger
}())

Answer 10

$('body').keydown(function(e) {
        if(e.which==123){
            e.preventDefault();
        }
        if(e.ctrlKey && e.shiftKey && e.which == 73){
            e.preventDefault();
        }
        if(e.ctrlKey && e.shiftKey && e.which == 75){
            e.preventDefault();
        }
        if(e.ctrlKey && e.shiftKey && e.which == 67){
            e.preventDefault();
        }
        if(e.ctrlKey && e.shiftKey && e.which == 74){
            e.preventDefault();
        }
    });
!function() {
        function detectDevTool(allow) {
            if(isNaN(+allow)) allow = 100;
            var start = +new Date();
            debugger;
            var end = +new Date();
            if(isNaN(start) || isNaN(end) || end - start > allow) {
                console.log('DEVTOOLS detected '+allow);
            }
        }
        if(window.attachEvent) {
            if (document.readyState === "complete" || document.readyState === "interactive") {
                detectDevTool();
              window.attachEvent('onresize', detectDevTool);
              window.attachEvent('onmousemove', detectDevTool);
              window.attachEvent('onfocus', detectDevTool);
              window.attachEvent('onblur', detectDevTool);
            } else {
                setTimeout(argument.callee, 0);
            }
        } else {
            window.addEventListener('load', detectDevTool);
            window.addEventListener('resize', detectDevTool);
            window.addEventListener('mousemove', detectDevTool);
            window.addEventListener('focus', detectDevTool);
            window.addEventListener('blur', detectDevTool);
        }
    }();

Answer 11

是的，這是一個可怕的設計，你不能禁用開發者工具。 您的客戶端 UI 應該位於 rest api 之上，該 api 的設計方式使得用戶無論如何都無法修改任何已經是有效輸入的內容。

您需要對輸入進行服務器端驗證。 服務器端驗證不必冗長而豐富，只要完整即可。

因此，例如，客戶端您可能有一個 ui 來顯示必填字段等。但是服務器端您可以將一個布爾值設置為 true，如果字段驗證失敗，則將其設置為 false，然后拒絕整個請求。

此外，您的客戶端應用程序應該經過身份驗證。 你可以用 10 萬種方式做到這一點。 但我喜歡做的一項是使用 ADFS 直通身份驗證。 他們通過 adfs 登錄網站，adfs 會為他們生成會話 cookie。 該會話 cookie 被傳遞給 rest api（都在同一個域上），我們通過該會話 cookie 驗證對 rest api 的請求。 這樣一來，沒有通過登錄窗口登錄的任何人都無法調用rest api。 它只能從他們的瀏覽器上下文中調用。

開發人員工具方面，您需要以這樣一種方式設計您的應用程序，即用戶在開發人員控制台中可以做的任何事情都只是一個（功能）或破壞性的事情。 即說他們用js片段填寫所有字段，沒關系，這是有效的輸入。 假設他們覆蓋腳本並嘗試將錯誤數據發送到 api 調用。 沒關系，您的服務器端驗證將拒絕任何錯誤的輸入。

因此，基本上，以這樣一種方式設計您的應用程序，即開發人員的工具 muckery 要么破壞他們的體驗（因為它不起作用），要么讓他們的生活變得更輕松，比如每次都自動選擇他們的國家。

此外，您甚至沒有考慮擴展......擴展可以做任何開發者控制台可以做的事情......

Answer 12

您不能阻止開發人員工具，但您可以嘗試阻止用戶進入它們。 您可以嘗試自定義右鍵菜單並阻止開發人員工具的擊鍵。

"

Answer 13

我只是在拋出一個隨機的想法，也許這會有所幫助。

If someone tries to open the developer tool just redirect to some other site.

我不知道這對您有多大效果，但至少他們不能在您的網站上執行某些操作。

Answer 14

是的。 沒有人可以控制客戶端瀏覽器或禁用開發工具或調試工具。

但是您可以使用 electron.js 構建桌面應用程序，您可以在其中啟動您的網站。 您可以在哪里停止調試器或開發人員工具。

我們的團隊 snippetbucket.com 使用 electron.js 構建了大量解決方案，他們的需求類似。 以及使用許多工具重組和保護網站。

與 electron.js 一樣，許多 Web 解決方案也得到了很好的轉換和保護。

Answer 15

https:\/\/github.com\/theajack\/disable-devtool<\/a>

這個工具只是通過檢測它是否打開然后關閉窗口來禁用 devtools ！ 非常好的選擇。 向創作者致敬。

Answer 16

您可以通過定義以下內容輕松禁用開發人員工具：

Object.defineProperty(console, '_commandLineAPI', { get : function() { throw 'Nooo!' } })

Answer 17

布蘭登，

您可以執行以下操作，這是一個非常基本的想法，您可以執行此操作以覆蓋本機代碼，這與您要找的不完全相同，您可以從中開發

delete window.console

console.log('test'); // Noting will work