代码片段展示了如何在前端页面中禁用右键菜单、禁止文本选择、阻止特定键盘操作(如F12键打开开发者工具),以及通过检测窗口尺寸变化来尝试阻止用户调试页面。
// 鼠标禁止右键禁止打开控制台及键盘禁用forbidden(){// 1.禁用右键菜单document.oncontextmenu = new Function("event.returnValue=false");// 2.禁用鼠标选中document.onselectstart = new Function("event.returnValue=false");document.onkeydown = () => {console.log(window.event.keyCode);if(window.event && window.event.keyCode == 123) {return false;}}},// 禁止别人调试前端页面代码,使用无限debuggerpageTable(){/** 页面模块 */const block = () => {if (window.outerHeight - window.innerHeight > 200 || window.outerWidth - window.innerWidth > 200) {document.body.innerHTML = "检测到非法调试,请关闭后刷新重试!";document.body.style.display = 'flex'document.body.style.justifyContent = 'center'document.body.style.alignItems = 'center'}setInterval(() => {(function () {return false;}['constructor']('debugger')['call']());}, 50);}/** 禁止调试 */const banDebugging = () => {try {block();} catch (err) {console.log({ err })}}let threshold = 160 // 打开控制台的宽或高阈值window.setInterval(function() {if (window.outerWidth - window.innerWidth > threshold ||window.outerHeight - window.innerHeight > threshold) {// 如果打开控制台,则禁止banDebugging();}}, 1000)}
-
认识到完全防止前端页面被调试是不可能的。即使是最复杂的反调试技术,经验丰富的开发者也能找到绕过的方法。
-
专注于保护敏感数据和逻辑,而不是试图阻止调试。例如,通过服务器端验证和加密来保护敏感信息。