javascript防止浏览器打开Web开发者工具查看或调试代码
不想网页被人通过浏览器审查元素或控制台调试网页代码,可以通过比较屏幕window.outerWidth
和页面可见区域window.innerWidth
的差距判断浏览器是否打开了Web开发者工具,如果检测到Web开发者工具被打就清空网页代码。
实现代码:
;(function () { 'use strict'; var devtools = { open: false, orientation: null } var threshold = 160;//outerWidth与innerWidth的差距阀值 var emitEvent = function (state, orientation) { window.dispatchEvent(new CustomEvent('devtoolschange', { detail: { open: state, orientation: orientation } })) } setInterval(function () { var widthThreshold = window.outerWidth - window.innerWidth > threshold; var heightThreshold = window.outerHeight - window.innerHeight > threshold; var orientation = widthThreshold ? 'vertical' : 'horizontal'; if (!(heightThreshold && widthThreshold) && ((window.Firebug && window.Firebug.chrome && window.Firebug.chrome.isInitialized) || widthThreshold || heightThreshold)) { if (!devtools.open || devtools.orientation !== orientation) { emitEvent(true, orientation); } devtools.open = true; devtools.orientation = orientation; } else { if (devtools.open) { emitEvent(false, null); } devtools.open = false; devtools.orientation = null; } }, 500) if (typeof module !== 'undefined' && module.exports) { module.exports = devtools; } else { window.devtools = devtools; } })(); window.addEventListener('devtoolschange', function (e) { if (e.detail.open){ document.getElementsByTagName('body')[0].innerHTML = ''; } });
<< 上一篇