Inside this article we will see the concept i.e How To Disable Right Click and F12 Key Using JavaScript. Article contains the classified information i.e How to disable right click on web page using JavaScript.
You may want to take precautions as the creator or owner of a website to prevent unauthorised visitors from copying or viewing the material of your website. Disabling the right-click context menu and the F12 key on your website is one approach to achieve this. This post will go over how to use JavaScript to disable the right-click and the F12 key.
Read More: Do You Know Types of Programming Errors of PHP?
Let’s get started.
Methods: Disable Right Click and F12 Key Using JavaScript
Disabling right click and the F12 key is a common technique used to protect website content. Here’s how to disable both using JavaScript:
Disabling Right Click
Users of web browsers frequently use the right-click context menu, which offers functions like copy, paste, and save picture as. By turning off this function, visitors won’t be able to download or copy any of the content from your website.
To disable the right-click context menu, we need to add an event listener to the contextmenu event and call the preventDefault() method on the event object. Here’s an example code that demonstrates how to disable the right-click context menu on a webpage:
document.addEventListener('contextmenu', function(event) {
event.preventDefault();
});
In the above code, we are adding an event listener to the contextmenu event, which is triggered when the user right-clicks on the webpage.
Inside the event listener, we are calling the preventDefault() method on the event object, which prevents the default action of opening the right-click context menu.
Instead of the contextmenu event, You can also add the oncontextmenu handler into the HTML body tag to disable the right click.
<body oncontextmenu="return false;">Disabling F12 Key
Read More: PHP Security Best Practices: Keeping Your Web Application Safe
The F12 key is a keyboard shortcut that is commonly used to open the developer tools in web browsers. Disabling this feature can prevent users from accessing the developer tools and viewing or modifying the webpage source code.
<script>
document.onkeydown = function (e) {
// disable F12 key
if(e.keyCode == 123) {
return false;
}
// disable I key
if(e.ctrlKey && e.shiftKey && e.keyCode == 73){
return false;
}
// disable J key
if(e.ctrlKey && e.shiftKey && e.keyCode == 74) {
return false;
}
// disable U key
if(e.ctrlKey && e.keyCode == 85) {
return false;
}
}
</script>From above code you can disable the F12 , Ctrl + Shift + I, Ctrl + Shift + J and Ctrl + U keys.
Disabling right-click and the F12 key can help protect your website content from unauthorized access or copying. However, it’s important to note that these techniques are not foolproof and can be bypassed by determined users.
Additionally, disabling right-click can also disable useful browser features such as opening links in a new tab. Therefore, it’s recommended to use these techniques judiciously and in combination with other security measures such as using watermarks or login systems to protect your website content.
Read More: How To Extract Email Addresses From a String in PHP
We hope this article helped you to learn How To Disable Right Click and F12 Key Using JavaScript in a very detailed way.
Online Web Tutor invites you to try Skillshike! Learn CakePHP, Laravel, CodeIgniter, Node Js, MySQL, Authentication, RESTful Web Services, etc into a depth level. Master the Coding Skills to Become an Expert in PHP Web Development. So, Search your favourite course and enroll now.
If you liked this article, then please subscribe to our YouTube Channel for PHP & it’s framework, WordPress, Node Js video tutorials. You can also find us on Twitter and Facebook.