Js 之禁止浏览器审查元素

一、方式一

1、代码

(function () {
    'use strict'
    var devtools = {
        open: false,
        orientation: null
    }
    var threshold = 160
    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
    }
})();

2、使用

window.addEventListener('devtoolschange', function (e) {
    if (e.detail.open){
        document.getElementsByTagName('body')[0].innerHTML = '<h1>不允许F12</h1>';
    }
})

二、方式二

function checkDevTools()
{
    const start = performance.now();
    debugger;
    const end = performance.now();
    if(end - start > 100) {
        // alert('检测到调试工具');
        window.location.href="about:blank";
    }
}
setInterval(checkDevTools, 1000);