CODEWITHSUNDEEP
javascriptgoogle-chromegoogle-chrome-app
Kim Honoridez
Kim Honoridez

Reputation: 997

Is it possible to remove "Inspect Element"?

Is it possible to remove or disable "Inspect Element" context menu in Chrome App via Javascript?

I have searched through several forums but there are no definite answer.

Upvotes: 52

Views: 170970

Answers (21)

Shahed
Shahed

Reputation: 1885

To add mac check as well, use this

  function isShortcutKey(e, keyCode) {
    // Check for Ctrl + Shift + Key or Cmd + Option + Key
    return (
      (e.ctrlKey && e.shiftKey && e.keyCode === keyCode.charCodeAt(0)) ||
      (e.metaKey && e.altKey && e.keyCode === keyCode.charCodeAt(0))
    );
  }

    document.addEventListener("contextmenu", function (e) {
      e.preventDefault();
    });

    document.onkeydown = (e) => {
      // Disable F12, Ctrl + Shift + I/J/C, Cmd + Option + I/J/C, Ctrl + U
      if (
        e.keyCode === 123 ||
        isShortcutKey(e, "I") ||
        isShortcutKey(e, "J") ||
        isShortcutKey(e, "C") ||
        (e.ctrlKey && e.keyCode === "U".charCodeAt(0)) ||
        (e.metaKey && e.keyCode === "U".charCodeAt(0))
      ) {
        e.preventDefault();
        return false;
      }
    };

// REACT COMP

import React, { useEffect } from "react";
import SomeComp from "./any-where.js";
import "./App.css";

function App() {
  function isShortcutKey(e, keyCode) {
    // Check for Ctrl + Shift + Key or Cmd + Option + Key
    return (
      (e.ctrlKey && e.shiftKey && e.keyCode === keyCode.charCodeAt(0)) ||
      (e.metaKey && e.altKey && e.keyCode === keyCode.charCodeAt(0))
    );
  }

  useEffect(() => {
    document.addEventListener("contextmenu", function (e) {
      e.preventDefault();
    });

    document.onkeydown = (e) => {
      // Disable F12, Ctrl + Shift + I/J/C, Cmd + Option + I/J/C, Ctrl + U
      if (
        e.keyCode === 123 ||
        isShortcutKey(e, "I") ||
        isShortcutKey(e, "J") ||
        isShortcutKey(e, "C") ||
        (e.ctrlKey && e.keyCode === "U".charCodeAt(0)) ||
        (e.metaKey && e.keyCode === "U".charCodeAt(0))
      ) {
        e.preventDefault();
        return false;
      }
    };
  }, []);

  return (
    <div className="App">
     <SomeComp/>
    </div>
  );
}

export default App;

Upvotes: 2

255kb - Mockoon
255kb - Mockoon

Reputation: 6974

Disclaimer: You shouldn't do this, it's like hijacking the scroll, at best it will annoy your users. It may also restrict access to some right-click only browser features.

It is possible to prevent the user from opening the context menu by right clicking like this (javascript):

document.addEventListener('contextmenu', function(e) {
  e.preventDefault();
});

By listening to the contextmenu event and preventing the default behavior which is "showing the menu", the menu won't be shown. But the user will still be able to inspect code through the console (by pressing F12 in Chrome for example).

Upvotes: 25

Gaurav Pandey
Gaurav Pandey

Reputation: 1

prevent inspect from the keyboard key and the right click

document.addEventListener('contextmenu', (e) => e.preventDefault());

function ctrlShiftKey(e, keyCode) {

return e.ctrlKey && e.shiftKey && e.keyCode === keyCode.charCodeAt(0); }

// Disable F12, Ctrl + Shift + I, Ctrl + Shift + J, Ctrl + U

document.onkeydown = (e) => {

if (event.keyCode === 123 ||

ctrlShiftKey(e, 'I') ||
ctrlShiftKey(e, 'J') ||
ctrlShiftKey(e, 'C') ||
(e.ctrlKey && e.keyCode === 'U'.charCodeAt(0)))
return false };

Upvotes: 0

Kamal Dhiman
Kamal Dhiman

Reputation: 11

If you want to disable the

  • ctrl+U
  • Shift+Ctrl+I
  • Shift+Ctrl+J
  • Shift+Ctrl+C
  • Ctrl+U
  • ...

then you have to add this javascript code to your file.

<script type="text/javascript">
    document.onkeydown = function(e) {
        if(event.keyCode == 123) {
            return false;
        }
        if(e.ctrlKey && e.shiftKey && e.keyCode == 'I'.charCodeAt(0)){
            return false;
        }
        if(e.ctrlKey && e.shiftKey && e.keyCode == 'J'.charCodeAt(0)){
            return false;
        }
        if(e.ctrlKey && e.shiftKey && e.keyCode == 'C'.charCodeAt(0)){
            return false;
        }
        if(e.ctrlKey && e.keyCode == 'U'.charCodeAt(0)){
            return false;
        }
    }
</script>

And, after just add this line in the tag, see below:

<html oncontextmenu="return false;">

Thank you!

Upvotes: 1

ramakrishna
ramakrishna

Reputation: 917

I have one requirement for one page. On that page, I want to block the user from performing the below actions,

  • Right Click
  • F12
  • Ctrl + Shift + I
  • Ctrl + Shift + J
  • Ctrl + Shift + C
  • Ctrl + U

For this, I googled and finally got the below link,

http://andrewstutorials.blogspot.in/2014/03/disable-ways-to-open-inspect-element-in.html

I tested it with Chrome & Firefox. It's working for my requirement.

Right Click

 <body oncontextmenu="return false">

Keys

document.onkeydown = (e) => {
    if (e.key == 123) {
        e.preventDefault();
    }
    if (e.ctrlKey && e.shiftKey && e.key == 'I') {
        e.preventDefault();
    }
    if (e.ctrlKey && e.shiftKey && e.key == 'C') {
        e.preventDefault();
    }
    if (e.ctrlKey && e.shiftKey && e.key == 'J') {
        e.preventDefault();
    }
    if (e.ctrlKey && e.key == 'U') {
        e.preventDefault();
    }
};

Upvotes: 84

Emranul Farhad
Emranul Farhad

Reputation: 59

  

 "put this script before ending your body tag"

 <script> 
      document.addEventListener('contextmenu', event=> event.preventDefault()); 
      document.onkeydown = function(e) { 
      if(event.keyCode == 123) { 
      return false; 
      } 
      if(e.ctrlKey && e.shiftKey && e.keyCode == 'I'.charCodeAt(0)){ 
      return false; 
      } 
      if(e.ctrlKey && e.shiftKey && e.keyCode == 'J'.charCodeAt(0)){ 
      return false; 
      } 
      if(e.ctrlKey && e.keyCode == 'U'.charCodeAt(0)){ 
      return false; 
      } 
      } 
      </script>

Upvotes: 5

mohamed sharkawey
mohamed sharkawey

Reputation: 86

in nextJs you can put this code in the _app.tsx or _app.js file and use e.key instead of e.keyCode as it is deprecated

    useEffect(() => {
    typeof window !== undefined &&
      window.document.addEventListener("contextmenu", (e) => {
        e.preventDefault();
      });
  }, []);

  document.onkeydown = function(e) {
    console.log(e.key)
    if(e.key === 'F12') {
       return false;
    }
    if(e.ctrlKey && e.shiftKey && e.key === 'I') {
       return false;
    }
    if(e.ctrlKey && e.shiftKey && e.key === 'C') {
       return false;
    }
    if(e.ctrlKey && e.shiftKey && e.key === 'J') {
       return false;
    }
    if(e.ctrlKey && e.key === 'u') {
       return false;
    }
  }

Upvotes: 0

Dex _
Dex _

Reputation: 1

It's easy, just press F6 and then press F12.

Upvotes: -4

Priyanshu Haldar
Priyanshu Haldar

Reputation: 39

Yes, there is, some of the above scripts successfully disable one but can't close the other so below's the summary of the above.

document.addEventListener('contextmenu',(e)=>{
    e.preventDefault();
  }
  );
  document.onkeydown = function(e) {
  if(event.keyCode == 123) {
     return false;
  }
  if(e.ctrlKey && e.shiftKey && e.keyCode == 'I'.charCodeAt(0)) {
     return false;
  }
  if(e.ctrlKey && e.shiftKey && e.keyCode == 'C'.charCodeAt(0)) {
     return false;
  }
  if(e.ctrlKey && e.shiftKey && e.keyCode == 'J'.charCodeAt(0)) {
     return false;
  }
  if(e.ctrlKey && e.keyCode == 'U'.charCodeAt(0)) {
     return false;
  }
}

Use this and you are all secure, now nobody can steal ur code or use js to crack open ur database!

Upvotes: 3

melper
melper

Reputation: 1

Try this:

document.onkeydown = function(e) {
if(event.keyCode == 123) {
    return false;
}
if(e.ctrlKey && e.shiftKey && e.keyCode == 'I'.charCodeAt(0)){
    return false;
}
if(e.ctrlKey && e.shiftKey && e.keyCode == 'J'.charCodeAt(0)){
    return false;
}
if(e.ctrlKey && e.keyCode == 'U'.charCodeAt(0)){
    return false;
}
if(e.ctrlKey && e.keyCode == 'C'.charCodeAt(0)){
    return false;
}
if(e.ctrlKey && e.keyCode == 'X'.charCodeAt(0)){
    return false;
}
if(e.ctrlKey && e.keyCode == 'Y'.charCodeAt(0)){
    return false;
}
if(e.ctrlKey && e.keyCode == 'Z'.charCodeAt(0)){
    return false;
}
if(e.ctrlKey && e.keyCode == 'V'.charCodeAt(0)){
    return false;
}
if (e.keyCode == 67 && e.shiftKey && (e.ctrlKey || e.metaKey)){
    return false;
}
if (e.keyCode == 'J'.charCodeAt(0) && e.altKey && (e.ctrlKey || e.metaKey)){
    return false;
}
if (e.keyCode == 'I'.charCodeAt(0) && e.altKey && (e.ctrlKey || e.metaKey)){
    return false;
}
if ((e.keyCode == 'V'.charCodeAt(0) && e.metaKey) || (e.metaKey && e.altKey)){
    return false;
}
if (e.ctrlKey && e.shiftKey && e.keyCode == 'C'.charCodeAt(0)){
    return false;
}
if(e.ctrlKey && e.keyCode == 'S'.charCodeAt(0)){
    return false;
}
if(e.ctrlKey && e.keyCode == 'H'.charCodeAt(0)){
    return false;
}
if(e.ctrlKey && e.keyCode == 'A'.charCodeAt(0)){
    return false;
}
if(e.ctrlKey && e.keyCode == 'F'.charCodeAt(0)){
    return false;
}
if(e.ctrlKey && e.keyCode == 'E'.charCodeAt(0)){
    return false;
}
}
if (document.addEventListener) {
    document.addEventListener('contextmenu', function(e) {
    e.preventDefault();
    }, false);
}else{
    document.attachEvent('oncontextmenu', function() {
    window.event.returnValue = false;
    });
}

Upvotes: 0

Anshu Meena
Anshu Meena

Reputation: 381

well yes its possible to stop inspecting the website into the browser. as you know that there are three ways to inspect a website into the browser

  1. using keyboard shortcuts
  2. using right click
  3. using developer menu of the browser

i have solution for the 1 and the 2 ways here is the JavaScript code but user user 3rd way is very rare cases

// take body to change the content
const body = document.getElementsByTagName('body');
// stop keyboard shortcuts
window.addEventListener("keydown", (event) => {
  if(event.ctrlKey && (event.key === "S" || event.key === "s")) {
     event.preventDefault();
     body[0].innerHTML = "sorry, you can't do this 💔"
  }

  if(event.ctrlKey && (event.key === "C")) {
     event.preventDefault();
     body[0].innerHTML = "sorry, you can't do this 💔"
  }
  if(event.ctrlKey && (event.key === "E" || event.key === "e")) {
     event.preventDefault();
     body[0].innerHTML = "sorry, you can't do this 💔"
  }
  if(event.ctrlKey && (event.key === "I" || event.key === "i")) {
     event.preventDefault();
     body[0].innerHTML = "sorry, you can't do this 💔";
  }
  if(event.ctrlKey && (event.key === "K" || event.key === "k")) {
     event.preventDefault();
     body[0].innerHTML = "sorry, you can't do this 💔";
  }
  if(event.ctrlKey && (event.key === "U" || event.key === "u")) {
     event.preventDefault();
     body[0].innerHTML = "sorry, you can't do this 💔";
  }
});
// stop right click
document.addEventListener('contextmenu', function(e) {
  e.preventDefault();
});

Upvotes: 1

eitzaz shah
eitzaz shah

Reputation: 104

Above Answer Is Perfect but has some issue when pression ctrl+shift+I. in previous answer it still opens inspect. By Adding event.preventdefault() solve this problem

document.addEventListener('keydown', function() {
    if (event.keyCode == 123) {
      alert("You Can not Do This!");
      return false;
    } else if (event.ctrlKey && event.shiftKey && event.keyCode == 73) {
      alert("You Can not Do This!");
       event.preventDefault();
      return false;
    } else if (event.ctrlKey && event.keyCode == 85) {
      alert("You Can not Do This!");
      return false;
    }
  }, false);
  
  if (document.addEventListener) {
    document.addEventListener('contextmenu', function(e) {
      alert("You Can not Do This!");
      e.preventDefault();
    }, false);
  } else {
    document.attachEvent('oncontextmenu', function() {
      alert("You Can not Do This!");
      window.event.returnValue = false;
    });
  }

Upvotes: 0

UserName Name
UserName Name

Reputation: 313

You can not block it, but you can stop some keys:

Add this to your script:

<script>
 
 document.addEventListener('contextmenu', function(e) {
  e.preventDefault();
 });
 document.addEventListener('keydown', function(e) {
 if (event.keyCode == 123) {
  return false;
 }
 if (e.ctrlKey && e.shiftKey) {
  return false;
 }
 if (event.ctrlKey && event.keyCode == 85) {
  return false;
 }
});
/* other script code */
</script>

Upvotes: 0

مهراسا صدیقی فر
مهراسا صدیقی فر

Reputation: 21

document.addEventListener('keydown', function() {
    if (event.keyCode == 123) {
      alert("You Can not Do This!");
      return false;
    } else if (event.ctrlKey && event.shiftKey && event.keyCode == 73) {
      alert("You Can not Do This!");
      return false;
    } else if (event.ctrlKey && event.keyCode == 85) {
      alert("You Can not Do This!");
      return false;
    }
  }, false);
  
  if (document.addEventListener) {
    document.addEventListener('contextmenu', function(e) {
      alert("You Can not Do This!");
      e.preventDefault();
    }, false);
  } else {
    document.attachEvent('oncontextmenu', function() {
      alert("You Can not Do This!");
      window.event.returnValue = false;
    });
  }

No F12 No Rightclick

Hi I use this codes. Have fun♥

Upvotes: 2

Diego Fortes
Diego Fortes

Reputation: 9790

It is kinda possible.

  1. Firstly, use ramakrishna's solution to block the devtools shortcut keys.

  2. Add devtools-detect to your website. Here is a quick link for the devtools.js file from his github.

  3. Then, finally, add the following:

if (devtools.isOpen) {


    setInterval(() => {

        var $all = document.querySelectorAll("*");

        for (var each of $all) {
            each.classList.add(`asdjaljsdliasud8ausdijaisdluasdjasildahjdsk${Math.random()}`);
        }
        

    }, 5);
}

or maybe this:

if (devtools.isOpen) {
while (true) {
    console.log("access denied")
}
}

It will basically overload the DOM and make it impossible to interact with it via the devtools.

Additionally, this is a mere example; you can use much more elaborate ways to overload the DOM instead of just adding classes.

I don't think it will work flawlessly but it should be enough to offer at least some extra minor layer of "security".

Upvotes: 8

Malshan Gunawardana
Malshan Gunawardana

Reputation: 51

Add this to the html tag of your page

<html oncontextmenu="return false">

Upvotes: 2

user14413603
user14413603

Reputation: 151

You can't.

Everything on a web page is rendered by the browser, and they want web sites to properly work on them or their users would despise them. As a result, browsers want to expose the lower level ticks of everything to the web developers with tools like code inspectors.

You could try to prevent the user from entering the menu with a key event. Something like this:

// Disable inspect element
$(document).bind("contextmenu",function(e) {
  e.preventDefault();
});
$(document).keydown(function(e){
  if(e.which === 123){
    return false;
}
});

But if a user want to see the code, he will do it in another way. He will just need a little longer.

Short: If you do not want people to get something in their browser, you shouldn't send it to their browser in the first place.

Upvotes: 15

Jamie Birch
Jamie Birch

Reputation: 6102

In case it helps anyone, Inspect Element can be disabled for an individual element by adding the style pointer-events: none; to it.

This is very useful if you have any elements that are purely for the purpose of aligning child elements that necessarily overlap a large area of more useful elements; it lets you prevent the aligner elements from responding to the Inspect Element command.

Upvotes: 0

cloakedninjas
cloakedninjas

Reputation: 4176

While not an answer, Chrome certainly has a way to do this, I appear to be in an A/B test as my work account can't inspect in Gmail, meanwhile my personal account can.

I've searched for <meta> tags or HTTP headers which might be controlling this, but nothing stands out

Gmail blocking Inspect option

Upvotes: 3

Waruna Manjula
Waruna Manjula

Reputation: 3477

<script language="javascript">
document.onmousedown=disableclick;
status="Right Click Disabled";
function disableclick(event)
{
  if(event.button==2)
   {
     alert(status);
     return false;    
   }
}
</script>

Upvotes: 0

childofsoong
childofsoong

Reputation: 1936

Nope. Closest you can do is capture right clicks, and make them not open the context menu, but the savvy user will know the keyboard combos or menu options to access it anyway, defeating the point. That's a feature of the browser, so nothing you do in your page is going to defeat it (short of installing malware on their computer).

Upvotes: 2

Related Questions