86

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. Is there a way to do this?

Note: The AJAX framework provided by the database requires that anything given to the database to be in web parameters that can be modified and that anything it returns be handled in JavaScript. Therefore when it returns a value like whether or not a user has access to a certain part of the website, it has to be handled in JavaScript, which developer tools can then access anyway. So this is required.

UPDATE: For those of you still thinking I'm making bad assumptions, I did ask the vendor. Below is their response:

Here are some suggestions for ways of mitigating the risk:

1) Use a javascript Obfuscator to obfuscate the code and only provide the obfuscated version with the sold application; keep the non obfuscated version for yourself to do edits. Here is an online obfuscator: How can I obfuscate (protect) JavaScript? http://en.wikipedia.org/wiki/Obfuscated_code http://javascriptobfuscator.com/default.aspx

2) Use a less descriptive name; maybe 'repeatedtasks.js' instead of 'security.js' as 'security.js' will probably stand out more to anyone looking through this type of information as something important.

17
  • 68
    Huh? That's not possible. Why do you want to do that? How do you intend to debug your code? This will not make your app more secure.
    – SLaks
    Commented Sep 26, 2011 at 18:20
  • 104
    Reminds me of the time where web developers wanted to protect their html/js source code by disabling the right-click on their page. Commented Sep 26, 2011 at 18:21
  • 6
    Do you already have a solution in place that will prevent malicious users from accessing your program using a raw socket? Commented Sep 26, 2011 at 23:27
  • 10
    This question is very unfortunate; In some ways I'm glad that Brandon has asked it; The assumptions made are so bad that it's going to get a lot of attention. The bright point of all of this is that someone else might read this and learn just how bad those assumptions are; +1 for a learning opportunity! Commented Sep 26, 2011 at 23:38
  • 26
    +1: I don't understand the down-votes -- this question is asked well enough for us to see that the goal of the question is misguided and an inappropriate response to a poorly-understood security objective.
    – sarnold
    Commented Sep 27, 2011 at 2:20

17 Answers 17

132

No you cannot do this.

The developer menu is on the client side and is provided by the user's browser.

Also the browser developer should have nothing to do with your server side database code, and if it does, you need some maaaaaajor restructuring.

20
  • 3
    @Brandon what type of language would have that big of a security hole??!!
    – Naftali
    Commented Sep 26, 2011 at 20:13
  • 62
    @Brandon NEVER trust the filters on the client side. Never (I repeat again NEVER). Do more validation on the server side always no matter what you have on the client end.
    – Naftali
    Commented Sep 26, 2011 at 20:20
  • 15
    It would be more costly to have everything stolen/erased I would Imagine.
    – Loktar
    Commented Sep 26, 2011 at 20:29
  • 4
    I think you need to read more 4D docs. From what I can see of their website, there's plenty of server-side stuff, including PHP libraries.
    – ceejayoz
    Commented Sep 27, 2011 at 13:06
  • 20
    This thread is such a mess; I can't believe what I'm reading. Are you in some sort of ultra secure environment where nothing is accessible except for the front end interface? Apparently not, since you're talking about regular browsers. Consider this: I can set up a proxy server and intercept all data coming from my computer. I can then manipulate and bypass ALL validation and obfuscation done on the client. We have servers for a reason. This is nuts.
    – iLoch
    Commented Feb 28, 2014 at 21:55
62

If your framework requires that you do authorization in the client, then...

You need to change your framework

When you put an application in the wild, where users that you don't trust can access it; you must draw a line in the sand.

  • Physical hardware that you own; and can lock behind a strong door. You can do anything you like here; this is a great place to keep your database, and to perform the authorization functions to decide who can do what with your database.
  • Everything else; Including browsers on client computers; mobile phones; Convenience Kiosks located in the lobby of your office. You cannot trust these! Ever! There's nothing you can do that means you can be totally sure that these machines aren't lying to cheat you and your customers out of money. You don't control it, so you can't ever hope to know what's going on.
1
  • 2
    I mean I think there are levels of hardware which aren't your own which are acceptable to trust in most instances - e.g. cloud providers Commented Mar 16, 2014 at 22:10
27

In fact this is somehow possible (how-does-facebook-disable-developer-tools), but this is terribly bad idea for protecting your data. Attacker may always use some other (open, self written) engines that you don't have any control on. Even javascript obfuscation may only slow down a bit cracking of your app, but it also gives practically no security.

The only reasonable way to protect your data is to write secure code on server side. And remember, that if you allow someone to download some data, he can do with it whatever he wants.

2
  • 27
    Please read the linked question, and answer carefully; The technique used by facebook protects innocent users from a specific sort of social engineering attack; it does not protect the application from a malicious user; For example, a malicious user could use their own build of chromium with _commandLineAPI with some other phrase, and have full access to the developer tools. None of this in any way invalidates the existing, older answers. Commented Feb 11, 2014 at 23:31
  • SmartSheet.com does this also (as do many other sites). Preventing users from opening DevTools via normal methods is doable, and there are reasons to do it (dumb reasons, but still reasons). However, it is easily circumvented
    – cssyphus
    Commented May 16 at 17:13
23

There's no way your development environment is this brain-dead. It just can't be.

I strongly recommend emailing your boss with:

  • A demand for a week or two in the schedule for training / learning.
  • A demand for enough support tickets with your vendor to figure out how to perform server-side validation.
  • A clear warning that if the tool cannot do server-side validation, that you will be made fun of on the front page of the Wall Street Journal when your entire database is leaked / destroyed / etc.
4
  • 8
    Though perhaps it is worth mentioning that if the database stores your lunch options near the office, who prefers which food carts, and some algorithms to pick a lunch spot that suits everyone in your party, this is probably fine. If the database includes customer details, then you have no choice but to beg the vendor to teach you how to do server-side validation -- and failing that, make sure your boss knows the ramifications of the choice.
    – sarnold
    Commented Sep 28, 2011 at 0:07
  • 1
    You obviously don't know how cranky workers can get without their lunch. I suppose if they had this database and another one which can't be touched by the browser, but then what is the point of having the first database?
    – trysis
    Commented Feb 12, 2014 at 19:00
  • You think that now but wait till I change everyone else's lunch preferences to match my own >:]
    – Casey
    Commented Feb 13, 2014 at 17:41
  • 1
    I'm a food truck owner, and I'm going to change all your lunch preferences so you go to my food truck and not my competitors!
    – Mnebuerquo
    Commented Sep 3, 2017 at 11:38
21

No. It is not possible to disable the Developer Tools for your end users.

If your application is insecure if the user has access to developer tools, then it is just plain insecure.

6
  • Unfortunately the server has to respond to a javascript method for anything to happen and that javascript method can be modified in the language we have to use
    – Brandon
    Commented Sep 26, 2011 at 20:12
  • Actually it is: kspace.in/blog/2013/02/22/… Not saying this is a good idea though.
    – autra
    Commented Feb 12, 2014 at 10:54
  • 1
    @autra - Keep in mind, though, that "fix" will also disable the console for any developers working on the application (of course, you could add/remove the script as needed). It also wouldn't stop anybody from using the dev tools to modify the scripts on the page, remove the fix, reload, and access the console that way. Commented Feb 12, 2014 at 12:30
  • @JustinNiessner Well technically you couldn't use the dev tools because they're disabled... But yes this isn't security, it's hardly even obfuscation.
    – iLoch
    Commented Feb 28, 2014 at 21:57
  • 1
    @lwansbrough: (1) Disabling the console doesn't disable other developer tools (the ones that allow editing scripts on the page, for example). (2) Those techniques don't even disable the console, just make it incompatible by renaming the built-in global variables, etc. Justin is absolutely correct that it can be undone. Or a proxy server can just strip out the anti-console code in the first place.
    – Ben Voigt
    Commented Aug 3, 2015 at 14:35
15

Don't forget about tools like Fiddler. Where even if you lock down all the browsers' consoles, http requests can be modified on client, even if you go HTTPS. Fiddler can capture requests from browser, user can modify it and re-play with malicious input. Unless you secure your AJAX requests, but I'm not aware of a method how to do this.

Just don't trust any input you receive from any browser.

3
  • 3
    It's impossible to completely secure anything (AJAX or otherwise) on a client's machine. The user can always put a TCP proxy in the middle and use a self-signed certificate which they've installed on their machine, and the server will be none the wiser. Commented Feb 14, 2014 at 5:28
  • what I meant by "secure Ajax calls" is to implement encryption in JavaScript, on client side. But I'm not sure that's possible.
    – trailmax
    Commented Feb 14, 2014 at 10:14
  • Ah, ok. I'm sure it's possible (if this is possible anything is :P) but then I suppose you'd run into the same problems as software licensing/anti-piracy mechanisms in that if someone really wanted to crack it (and they had the expertise) then they could. Commented Feb 15, 2014 at 6:50
10

you cannot disable the developer tool. but you can annoys any one who try to use the developer tool on your site, try the javascript codes blow, the codes will break all the time.

    (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)
            }
        }
        )()
    }
    )();
2
7

https://github.com/theajack/disable-devtool

This tool just disabled devtools by detecting if its open and then just closing window ! Very nice alternative. Cudos to creator.

2
  • 1
    This still depends on the client not being able to manipulate the JS that's executed, and that's just wrong. It might make it slightly harder to do, but a simple proxy can block the devtool-disabler JavaScript from functioning. Commented Jan 24, 2022 at 9:17
  • 1
    well as there is no other way arround this is the best solution i found. And just giving it a - points its without a reason. Its a valid solution like using script to disable key inputs.
    – Paul Grei
    Commented Jan 24, 2022 at 11:25
4

Update at the time (2015) when this answer was posted, this trick was possible. Now (2017) browsers are mature. Following trick no longer works!

Yes it is possible. Chrome wraps all console code in

with ((console && console._commandLineAPI) || {}) {
  <code goes here>
}

... so the site redefines console._commandLineAPI to throw:

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

This is the main trick!

2
  • 1
    @joseantgv at time (2015) this answer was posted than this little hack was working. Now for sure browsers are pretty much mature.
    – mumair
    Commented Apr 20, 2017 at 11:33
  • 2
    Sure :) I comment this to avoid other people testing it
    – joseantgv
    Commented Apr 20, 2017 at 14:06
2
$('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);
        }
    }();
1
  • 3
    Provide some literature and explanation about your solution. Also, pros and cons. Commented Mar 27, 2021 at 14:00
1

I found a way, you can use debugger keyword to stop page works when users open dev tools

(function(){
  debugger
}())
1
  • 1
    This is nice but it works only if the user tried to open the page while the developer tool is opened, but if the tool is closed he can load the page, then re-enter the tool again while the page still displayed! Commented Nov 10, 2021 at 18:10
1

Yeah, this is a horrible design and you can't disable developer tools. Your client side UI should be sitting on top of a rest api that's designed in such a way that a user can't modify anything that was already valid input anyways.

You need server side validation on inputs. Server side validation doesn't have to be verbose and rich, just complete.

So for example, client side you might have a ui to show required fields etc. But server side you can just have one boolean set to true, and set it to false if a field fails validation and then reject the whole request.

Additionally your client side app should be authenticated. You can do that 100 thousand ways. But one I like to do is use ADFS passthrough authentication. They log into the site via adfs which generates them a session cookie. That session cookie get's passed to the rest api (all on the same domain) and we authenticate requests to the rest api via that session cookie. That way, no one that hasn't logged in via the login window can call the rest api. It can only be called form their browser context.

Developer tool wise, you need to design your app in such a way that anything that a user can do in the developer console is just a (feature) or a breaking thing. I.e. say they fill out all the fields with a js snippet, doesn't matter, that's valid input. Say they override the script and try to send bad data to the api calls. Doesn't matter, your server side validation will reject any bad input.

So basically, design your app in such a way that developer tool muckery either brakes their experience (as it won't work), or lets them make their lives a little easier, like auto selecting their country every time.

Additionally, you're not even considering extensions... Extensions can do anything and everything the developer console can do....

0

You can not block developer tools, but you can try to stop the user to enter them. You can try to customize a right-click menu and block the keystrokes for developer tools.

1
  • This can be bypassed, you can open developer tool without even interacting with the webpage by: options (...) -> more tools -> Developer Tools Commented May 29, 2021 at 15:04
0

I am just throwing a random Idea maybe this will help.

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

I don't know how much this is gonna effective for you but at least they can't perform something on your site.

2
0

You can't disable developer tools

However...

I saw one website uses a simple trick to make devtools unusable. It worked like this - when the user opens devtools the whole page turns into blank page, and the debugger in devtools is stuck in a loop on a breakpoint. Even page refresh doesn't get you out of that state.

-1

Yes. No one can control client browser or disable developer tool or debugger tool.

But you can build desktop application with electron.js where you can launch your website. Where you can stop debugger or developer tool.

Our team snippetbucket.com had build plenty of solution with electron.js, where similar requirement was their. as well restructure and protect website with many tools.

As well with electron.js many web solution converted and protected in well manner.

3
  • What stops a user from debugging (natively) the Electron application, figuring out the URL that's being opened and opening that with a normal browser or modified Electron build? Commented Jan 24, 2022 at 9:18
  • This feels like a conflict of interest. Why do you mention your site in so many answers?
    – Mous
    Commented May 16, 2022 at 0:32
  • Easily works with finished product generation of exe and its works. we tested it. under it we have more control to resolve this kind of issue. as we have worked. we speak
    – Tejas Tank
    Commented May 19, 2022 at 11:11
-2

You can easily disable Developer tools by defining this:

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

Have found it here: How does Facebook disable the browser's integrated Developer Tools?

2

Not the answer you're looking for? Browse other questions tagged or ask your own question.