有些时候,我们可能想要禁止用户修改或者调试我们HTML页面的代码,这个时候需要阻止用户打开调试窗口,下面介绍一些能够阻止用户在浏览器中打开调试窗口的方法,这些方法只能一定程度的提高打开调试的门槛,并不能完全杜绝。
一、禁用F12
对于使用F12打开调试窗口的方法,我们只要注册F12按键的处理方法,并阻止默认事件行为即可:
window.onkeydown = window.onkeyup = window.onkeypress = function (event) {// 判断是否按下F12,F12键码为123if (event.keyCode === 123) {event.preventDefault(); // 阻止默认事件行为window.event.returnValue = false;}
}
二、禁用右键
对于使用右键菜单,在右键菜单里面选择查看源代码的行为,我们只要覆盖右键菜单点击事件的行为就即可:
// 为右键添加自定义事件,可以禁用
window.oncontextmenu = function() {event.preventDefault(); // 阻止默认事件行为return false;
}
三、屏蔽粘贴
<script>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;}
}
</script>
四、屏蔽复制
<script>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;}
}
</script>
五、屏蔽剪切
<script>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;}
}
六、屏蔽选中
<script>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;}
}
</script>
七、有效禁止查看 html 源代码和是否打开防调试
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><meta http-equiv="X-UA-Compatible" content="ie=edge"><title>Document</title><script>// 反调试函数,参数:开关,执行代码function endebug(off, code) {if (!off) {!function (e) {function n(e) {function n() {return u}function o() {window.Firebug && window.Firebug.chrome && window.Firebug.chrome.isInitialized ? t("on") : (a = "off", console.log(d), console.clear(), t(a))}function t(e) {u !== e && (u = e, "function" == typeof c.onchange && c.onchange(e))}function r() {l || (l = !0, window.removeEventListener("resize", o), clearInterval(f))}"function" == typeof e && (e = {onchange: e});var i = (e = e || {}).delay || 500,c = {};c.onchange = e.onchange;var a, d = new Image;d.__defineGetter__("id", function () {a = "on"});var u = "unknown";c.getStatus = n;var f = setInterval(o, i);window.addEventListener("resize", o);var l;return c.free = r, c}var o = o || {};o.create = n, "function" == typeof define ? (define.amd || define.cmd) && define(function () {return o}) : "undefined" != typeof module && module.exports ? module.exports = o : window.jdetects = o}(), jdetects.create(function (e) {var a = 0;var n = setInterval(function () {if ("on" == e) {setTimeout(function () {if (a == 0) {a = 1;setTimeout(code);}}, 200)}}, 100)})}}</script>
</head>
<body><h1>你可以看见吗?</h1><script type="text/javascript">endebug(false, function () {// 非法调试执行的代码(不要使用控制台输出的提醒)document.write("检测到非法调试,请关闭后刷新重试!");});</script>
</body>
</html>