js屏蔽F12审查元素，禁止修改页面代码等实现代码

更新时间：2020年10月02日 12:56:24 投稿：mdxy-dxy

有时候我们需要屏蔽客户端的F12，以防菜鸟也可以随意修改我们的代码，也处于源码的保护等操作，这里就为大家分享一下常见的代码

众所周知，审查元素的情况下，大家都可以随机更改一部分页面的代码，注入恶意JS等等，这种情况避免也不难，虽然还能看到一部分H5源码，但是无法修改

一、屏蔽F12 审查元素

document.onkeydown = function(){
  if(window.event && window.event.keyCode == 123) {
    alert("F12被禁用");
    event.keyCode=0;
    event.returnValue=false;
  }
  if(window.event && window.event.keyCode == 13) {
    window.event.keyCode = 505;
  }
  if(window.event && window.event.keyCode == 8) {
    alert(str+"\n请使用Del键进行字符的删除操作！");
    window.event.returnValue=false;
  }
}

如果想要禁用右键不提示可以使用下面的代码

document.onkeydown = function(){
  if(window.event && window.event.keyCode == 123) {    
    event.keyCode=0;
    event.returnValue=false;
  }
  if(window.event && window.event.keyCode == 13) {
    window.event.keyCode = 505;
  }
  if(window.event && window.event.keyCode == 8) {
    alert(str+"\n请使用Del键进行字符的删除操作！");
    window.event.returnValue=false;
  }
}

还有其他的玩法也可以让用户按F12我们关闭网页或者跳转其他页面

<script type="text/javascript">
document.onkeydown = function(){
 
  if(window.event && window.event.keyCode == 123) {
    window.close(); //关闭当前窗口(防抽)
    event.keyCode=0;
    event.returnValue=false;
  }
  if(window.event && window.event.keyCode == 13) {
    window.event.keyCode = 505;
  }
  if(window.event && window.event.keyCode == 8) {
    alert(str+"\n请使用Del键进行字符的删除操作！");
    window.event.returnValue=false;
  }
 
}
</script>

按住F12空白页面或者跳转其他页面

<script type="text/javascript">
document.onkeydown = function(){
 
  if(window.event && window.event.keyCode == 123) {
    window.location="about:blank"; //将当前窗口跳转置空白页
    event.keyCode=0;
    event.returnValue=false;
  }
  if(window.event && window.event.keyCode == 13) {
    window.event.keyCode = 505;
  }
  if(window.event && window.event.keyCode == 8) {
    alert(str+"\n请使用Del键进行字符的删除操作！");
    window.event.returnValue=false;
  }
 
}
</script>

除了屏蔽这个，我们还有其他有趣的设置：

二、屏蔽右键菜单

document.oncontextmenu = function (event){
if(window.event){
event = window.event;
}try{
var the = event.srcElement;
if (!((the.tagName == "INPUT" && the.type.toLowerCase() == "text") || the.tagName == "TEXTAREA")){
return false;
}
return true;
}catch (e){
return false;
}
}

三、屏蔽粘贴

document.onpaste = function (event){
if(window.event){
event = window.event;
}try{
var the = event.srcElement;
if (!((the.tagName == "INPUT" && the.type.toLowerCase() == "text") || the.tagName == "TEXTAREA")){
return false;
}
return true;
}catch (e){
return false;
}
}

四、屏蔽复制

document.oncopy = function (event){
if(window.event){
event = window.event;
}try{
var the = event.srcElement;
if(!((the.tagName == "INPUT" && the.type.toLowerCase() == "text") || the.tagName == "TEXTAREA")){
return false;
}
return true;
}catch (e){
return false;
}
}

五、屏蔽剪切

document.oncut = function (event){
if(window.event){
event = window.event;
}try{
var the = event.srcElement;
if(!((the.tagName == "INPUT" && the.type.toLowerCase() == "text") || the.tagName == "TEXTAREA")){
return false;
}
return true;
}catch (e){
return false;
}
}

这种很适合小说网站，毕竟版权珍贵，被别人随意copy走内容就不好了

六、屏蔽选中

document.onselectstart = function (event){
if(window.event){
event = window.event;
}try{
var the = event.srcElement;
if (!((the.tagName == "INPUT" && the.type.toLowerCase() == "text") || the.tagName == "TEXTAREA")){
return false;
}
return true;
} catch (e) {
return false;
}
}

当然js屏蔽chrome F12后页面自动跳转可以参考这篇文章

https://www.jb51.net/article/196910.htm

js检测用户是否打开调试工具（chrome）

(function(){ var re=/x/; var i=0; console.log(re); re.toString=function(){ window.close(); return '第'+(++i)+'次打开控制台'; } })();

JavaScript检测是否开启了控制台（调试工具）

测试后在chrome有效

不少人防止别人趴源码，一般采用检测按键F12之类的，但是这些基本没什么用

现在介绍一个方法，非常管用，可以检测到你是否开启了控制台程序，可以算是JavaScript的一些奇淫巧技

将这段代码加入你的网站即可，原理不明 = -

(function () {
var re = /x/;
var i = 0;
console.log(re);
 
re.toString = function () {
alert("请关闭控制台");
return '第 ' + (++i) + ' 次打开控制台';
};
})();

然后你在打开控制台，即会弹出对话框

js检测开发者工具Devtools是否打开防调试

之前写过一篇文章《Javascript检测开发者工具Devtools是否打开》，主要是讲如何通过js来检测开发者工具是否打开，防止别人恶意调试我们的代码，那段代码也是查了蛮多资料整理出来的，当时可以兼容chrome，firefox，ie，但是随着浏览器版本的更新，已经基本上没有作用了，最近我发现还是有蛮多人去浏览那篇文章，所以这里再放出一段代码，算是个升级版吧，之前的版本里在firefox上还有有限制的，下面提供的这个版本我测试过通杀现在的chrome 69，firefox，IE，也不存在之前firefox上存在的问题了，下面直接贴出代码：

setInterval(function() {
  check()
}, 4000);
var check = function() {
  function doCheck(a) {
    if (("" + a/a)["length"] !== 1 || a % 20 === 0) {
      (function() {}
      ["constructor"]("debugger")())
    } else {
      (function() {}
      ["constructor"]("debugger")())
    }
    doCheck(++a)
  } 
  try {
    doCheck(0)
  } catch (err) {}
};
check();

这段代码是什么原理，说实话我没搞太懂，也去请教过一些大佬，都不能完全说出其中的原理，如果有懂的朋友请一定不吝赐教，虽然不知道原理，但是效果的确是杠杠的，这是本人从huichan网站上截取的，这里不得不佩服那些做huichan的，太强大。由于以前代码是加密的，对于其中一些方法的命名我解密时都是随意取的，不喜勿喷。

当然这种伎俩对于熟悉调试的开发者来说，完全没有阻碍，但毕竟也能防范住一小批不怀好意的人，幸幸苦苦写出来的代码被别人悄悄的就搬走了，确实挺恼人的，但仅仅靠这么一个防调试的代码是不够的，我们还需要做的还有很多，比如一些基本的js的压缩混淆加密等等，后期本人会整理一些js加密混淆以及解密方面的文章，敬请期待...

Javascript中获取对象的原型对象的方法小结
这篇文章主要介绍了Javascript中获取对象的原型对象的方法小结,需要的朋友可以参考下
2015-02-02
VScode中配置JavaScript编译环境的方法
这篇文章主要介绍了VSCODE中配置JavaScript编译环境的方法，方式一使用Node.js做为解释器运行JS代码 Node.js的安装和配置，方式二使用VSCODE插件Code Runner运行JS代码，本文给大家介绍的非常详细，需要的朋友可以参考下
2022-08-08
鼠标点击input,显示瞬间的边框颜色,对之修改与隐藏实例
下面小编就为大家带来一篇鼠标点击input,显示瞬间的边框颜色,对之修改与隐藏实例。小编觉得挺不错的，现在就分享给大家，也给大家做个参考。一起跟随小编过来看看吧，祝大家游戏愉快哦
2016-12-12
微信小程序实现锚点定位功能的方法实例
“锚点”功能在实际应用设计的好,可以提高用户体验,这篇文章主要给大家介绍了关于微信小程序实现锚点定位功能的相关资料,文中通过示例代码介绍的非常详细,需要的朋友可以参考下
2021-07-07
微信小程序开发教程-手势解锁实例
手势解锁是app上常见的解锁方式，相比输入密码方式操作起来要方便许多。这篇文章主要介绍了微信小程序开发教程-手势解锁实例，有兴趣的可以了解一下。
2017-01-01
实现点击列表弹出列表索引的两种方式
使用利用事件冒泡委托给列表的父节点去处理的方式第二种方式就是使用闭包了，感兴趣的你可以参考下本文，或许对你学习js有所帮助
2013-03-03
利用Echarts如何实现多段圆环图
这篇文章主要给大家介绍了关于利用Echarts如何实现多段圆环图的相关资料,文中通过实例代码代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下
2022-03-03
JS实现支持多选的遍历下拉列表代码
这篇文章主要介绍了JS实现支持多选的遍历下拉列表代码,涉及javascript遍历select及设置css属性的相关技巧,具有一定参考借鉴价值,需要的朋友可以参考下
2015-08-08
Bootstrap 设置datetimepicker在屏幕上面弹出设置方法
datetimepicker默认是在输入框下面弹出的，但是遇到输入框在屏幕下面时，日期选择框会有一部分在屏幕下面，显示不了，因此需要能够从上面弹出，下面小编给大家介绍下Bootstrap 设置datetimepicker在屏幕上面弹出的设置方法
2017-03-03
前端页面文件拖拽上传模块js代码示例
这篇文章主要为大家详细介绍了前端页面文件拖拽上传模块js代码示例，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
2017-05-05

js屏蔽F12审查元素，禁止修改页面代码等实现代码

相关文章

最新评论

大家感兴趣的内容

最近更新的内容

常用在线小工具