js屏蔽F12审查元素，禁止修改页面代码等实现代码

2023年6月10日下午6:29 • JavaScript

实现屏蔽F12审查元素和禁止修改页面代码需要结合JavaScript和HTML的相关特性。以下是一个完整的攻略：

1. 使用JavaScript禁止页面右键功能

在页面中加入以下JavaScript代码，可以禁止页面的右键功能：

document.oncontextmenu = function () {
    return false;
}

以上代码中，document.oncontextmenu表示捕获右键菜单事件，函数体内返回 false 表示阻止浏览器打开右键菜单。这样做可以防止用户通过右键查看网页源代码。

2. 使用JavaScript判断F12调起事件

在页面中加入以下JavaScript代码，可以通过捕获F12按键事件来判断用户是否打开了开发者工具：

document.onkeydown = function (event) {
    if (event.keyCode == 123) {
        alert('F12被禁用');
        return false;
    }
}

以上代码中，document.onkeydown表示捕获键盘按下事件，event.keyCode == 123 表示捕获F12按键事件，函数体内通过 alert 方法弹出提示信息，同时返回 false 表示阻止浏览器进行默认操作。这样可以防止用户通过F12查看网页源代码。

3. 使用JavaScript禁用控制台

如果要禁用控制台，可以在页面中加入以下JavaScript代码：

// 禁用控制台
if (typeof console !== 'undefined') {
    console.clear();
    console.info('%c', 'padding:50px 100px; line-height:300px; background:url(https://i.loli.net/2021/06/14/Pt7iSHoQWZeznhb.png) no-repeat;');
    console.info('%c请不要在本站进行非法操作！', 'color:red; font-size: 20px; text-shadow:0px 3px 5px #FFF;');
    console.info('%c您的IP已被记录，请自觉遵守法律法规！', 'color:#333; font-size: 16px;');
    setInterval(function () {
        console.clear();
    }, 1000);
}

以上代码中使用了 if (typeof console !== 'undefined') 判断控制台是否可用。如果控制台可用，则通过 console.clear() 清空控制台，并使用 console.info 方法输出自定义的提示信息。通过 setInterval 函数循环清空控制台，可以防范一些技术比较高的用户恶意查看网站代码。

4. 不要过分依赖js

要注意的是，以上的JavaScript代码都是在客户端运行的，如果用户禁用JavaScript，那么以上技术都将失效。因此，我们不能过分依赖JavaScript，对于一些敏感信息，还是需要在服务器端进行限制和保护。

示例说明

下面是两个示例，详细说明了如何使用以上技术来禁用F12审查和修改网页代码：

示例一

<html>
<head>
    <script>
        // 禁用F12审查
        document.onkeydown = function (event) {
            if (event.keyCode == 123) {
                alert('F12被禁用');
                return false;
            }
        }

        // 禁止页面右键功能
        document.oncontextmenu = function () {
            return false;
        }
    </script>
</head>
<body>
    <h1>禁用F12审查和页面右键功能示例</h1>
    <p>这是一个示例页面，演示如何禁用F12审查和页面右键功能。</p>
</body>
</html>

在以上示例中，通过在页面的 <head> 标签中加入 JavaScript 代码实现了禁用 F12 审查和页面右键功能的功能。

示例二

<html>
<head>
    <script>
        // 禁用控制台
        if (typeof console !== 'undefined') {
            console.clear();
            console.info('%c', 'padding:50px 100px; line-height:300px; background:url(https://i.loli.net/2021/06/14/Pt7iSHoQWZeznhb.png) no-repeat;');
            console.info('%c请不要在本站进行非法操作！', 'color:red; font-size: 20px; text-shadow:0px 3px 5px #FFF;');
            console.info('%c您的IP已被记录，请自觉遵守法律法规！', 'color:#333; font-size: 16px;');
            setInterval(function () {
                console.clear();
            }, 1000);
        }
    </script>
</head>
<body>
    <h1>禁用控制台示例</h1>
    <p>这是一个示例页面，演示如何禁用控制台。</p>
</body>
</html>

在以上示例中，通过在页面的 <head> 标签中加入 JavaScript 代码实现了禁用控制台的功能。在控制台中输出了一些自定义的信息，通过每秒钟执行一次 console.clear() 方法来清空控制台，防止用户恶意查看网站代码。

本站文章如无特殊说明，均为本站原创，如若转载，请注明出处：js屏蔽F12审查元素，禁止修改页面代码等实现代码 - Python技术站