# 禁用F12
对于使用F12打开调试窗口的方法，我们只要注册F12按键的处理方法，并阻止默认事件行为即可：
window.onkeydown = window.onkeyup = window.onkeypress = function (event) {
// 判断是否按下F12，F12键码为123
if (event.keyCode === 123) {
event.preventDefault(); // 阻止默认事件行为
window.event.returnValue = false;
}
}
1
2
3
4
5
6
7
2
3
4
5
6
7
# 禁用右键
对于使用右键菜单，在右键菜单里面选择查看源代码的行为，我们只要覆盖右键菜单点击事件的行为就即可：
// 为右键添加自定义事件，可以禁用
window.oncontextmenu = function() {
event.preventDefault(); // 阻止默认事件行为
return false;
}
1
2
3
4
5
2
3
4
5
# 禁用预先调试
就算是同时禁用掉F12和右键，用户还是可以提前打开调试窗口，然后在地址中输入网址，这样就算不用右键和F12也是打开调试窗口的。 另外用户也可以通过浏览器菜单打开开发者工具来开启调试窗口，还有诸如 shift+ctrl+i 的快捷键打开控制台。
对于这种预先打开调试窗口的方法，我们可以通过比较屏幕 window.outerWidth 和页面可见内容区域 window.innerWidth 的差距判断是否打开控制台。
var threshold = 160; // 打开控制台的宽或高阈值
// 每秒检查一次
setInternet(function() {
if (window.outerWidth - window.innerWidth > threshold || window.outerHeight - window.innerHeight > threshold) {
// 如果打开控制台，则刷新页面
window.location.reload();
// 或者跳转覆盖父页面
alert("年轻人可不要太好奇，去玩游戏摸会鱼吧！");
window.location.href="https://www.youthup.cn/game/";
}
}, 1e3);
1
2
3
4
5
6
7
8
9
10
11
2
3
4
5
6
7
8
9
10
11
这种方法对于像IE8这种，打开调试窗口是在一个新的Windows窗口中，而不是在当前页面的下面或者上面的情况会失效。
# devtools-detector
想要兼容综上各种情况的话，可以使用 https://github.com/AEPKILL/devtools-detector (opens new window) 进行npm包安装后使用。(本Blog使用的就是它)