前端项目部署阻止用户打开控制台

news2025/2/26 9:18:07

需求:在前端开发过程中,会遇到生产坏境不让用户打开控制台,防止不法分子虚假信息操作。

废话不多说一共两步,添加我们的js方法,和在全局使用这个方法。

第一步:添加我的js文件:
//禁用开发者工具
export default async () => {
    if ((localStorage.getItem('devTools') && localStorage.getItem('devTools') === 1) || localStorage.getItem('devTools') === '1') {
        return;
    }
    document.onkeydown = () => {
        //禁用F12
        if (window.event && window.event.keyCode === 123) {
            return false;
            //禁用ctrl+shift+i,
        } else if (window.event.ctrlKey && window.event.shiftKey && window.event.keyCode === 73) {
            return false;
            //屏蔽Shift+F10
        } else if (window.event.shiftKey && window.event.keyCode === 121) {
            return false;
        }
    };
    window.oncontextmenu = (e) => {
        e.preventDefault();
    };
    setInterval(function () {
        check();
    }, 1000);

    var check = function () {
        function doCheck(a) {
            if (('' + a / a)['length'] !== 1 || a % 20 === 0) {
                (function () {})['constructor']('debugger')();
            } else {
                (function () {})['constructor']('debugger')();
            }
            doCheck(++a);
        }
        try {
            doCheck(0);
        } catch (err) {
            console.error(err);
        }
    };
    check();
};
第二步:在全局使用,以vue项目为例,在main.js中引用使用
import disableDeveloperTools from '你存放js文件的路径';


app.use(store);
app.use(router);

//判断生产环境使用
if (import.meta.env.MODE === 'production') {
    disableDeveloperTools();
}

app.mount('#app');

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/2306277.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

一周学会Flask3 Python Web开发-Jinja2模板过滤器使用

锋哥原创的Flask3 Python Web开发 Flask3视频教程: 2025版 Flask3 Python web开发 视频教程(无废话版) 玩命更新中~_哔哩哔哩_bilibili 在Jinja2中,过滤器(filter)是一些可以用来修改和过滤变量值的特殊函数,过滤器和变量用一个竖线 | &a…

【STM32H743IIT6】STM32H7的ADC时钟频率设置问题 —— 网上大多文章未注意到的要点!

前言 我使用的是定时器触发ADC采样。最近在想达到ADC的最高采样率的时候,发现一直却卡在1Msps上不去,直到在硬汉嵌入式的论坛里才发现了答案:[ADC] STM32H743/H750的Y版和V版芯片ADC的主频区别 这篇文章就详细的讲一下这个问题,这…

JavaScript基础(函数及面向对象)

函数 定义函数 Java定义方法: public 返回值类型 方法名(){ return 返回值 } 定义函数方法一 eg:定义一个绝对值函数 function abs(x) {if (x>0){return x;}else {return -x;}} 调用函数: 注意:一旦执行到return代表函数…

2025面试Go真题第一场

前几天参加了一场面试,GoLang 后端工程师,他们直接给了我 10 道题,我留了一个截图。 在看答案之前,你可以先简单做一下,下面我会对每个题目做一个说明。 文章目录 1、golang map 是否并发安全?2、协程泄漏的原因可能是…

【有奖实践】轻量消息队列(原 MNS)订阅 OSS 事件实时处理文件变动

当你需要对对象存储 OSS(Object Storage Service)中的文件变动进行实时处理、同步、监听、业务触发、日志记录等操作时, 你可以通过设置 OSS 的事件通知规则,自定义关注的文件,并将 OSS 事件推送到轻量消息队列&#x…

关于Postman自动获取token

在使用postman测试联调接口时,可能每个接口都需要使用此接口生成的令牌做Authorization的Bearer Token验证,最直接的办法可能会是一步一步的点击,如下图: 在Authorization中去选择Bearer Token,然后将获取到的token粘贴…

Baklib知识中台构建企业智慧中枢

智能技术架构构建路径 Baklib知识中台的技术架构设计以模块化和可扩展性为核心,通过分层解耦的架构体系实现知识管理的全流程覆盖。底层依托智能语义分析引擎与多模态知识图谱,完成非结构化数据的自动清洗与语义关联;中间层构建统一的知识资…

解决安卓recyclerView滚到底部不彻底问题

问题分析: 传统recycleview滚到到底部方式scrollToPosition(lastpositon),只能定位到最后一条数据的顶部。由于数据过长,无法滚动到最底部。 问了下deepseek,给了个方案: private void recyclerViewScrollToBottom()…

StepAudio:语音大模型

Step-Audio 是业界首个集语音理解与生成控制一体化的产品级开源实时语音对话系统,支持多语言对话(如 中文,英文,日语),语音情感(如 开心,悲伤),方言&#xff…

Kafka可视化工具EFAK(Kafka-eagle)安装部署

Kafka Eagle是什么? Kafka Eagle是一款用于监控和管理Apache Kafka的开源系统,它提供了完善的管理页面,例如Broker详情、性能指标趋势、Topic集合、消费者信息等。 源代码地址:https://github.com/smartloli/kafka-eagle 前置条件…

[Web 安全] PHP 反序列化漏洞 —— PHP 反序列化漏洞演示案例

关注这个专栏的其他相关笔记:[Web 安全] 反序列化漏洞 - 学习笔记-CSDN博客 PHP 反序列化漏洞产生原因 PHP 反序列化漏洞产生的原因就是因为在反序列化过程中,unserialize() 接收的值可控。 0x01:环境搭建 这里笔者是使用 PhpStudy 搭建的环…

2.部署kafka:9092

官方文档:http://kafka.apache.org/documentation.html (虽然kafka中集成了zookeeper,但还是建议使用独立的zk集群) Kafka3台集群搭建环境: 操作系统: centos7 防火墙:全关 3台zookeeper集群内的机器,1台logstash 软件版本: …

springboot博客系统详解与实现(后端实现)

目录 前言: 项目介绍 一、项目的准备工作 1.1 数据准备 1.2 项目创建 1.3 前端页面的准备 1.4 配置配置文件 二、公共模块 2.1 根据需求完成公共层代码的编写 2.1.1 定义业务状态枚举 2.1.2 统一返回结果 2.1.3 定义项目异常 2.1.4 统一异常处理 三、业…

seacmsv9注入管理员账号密码+orderby+limit

一、网上收集: 海洋影视管理系统(seacms,海洋cms)是一套专为不同需求的站长而设计的视频点播系统,采 用的是 php5.Xmysql 的架构,seacmsv9漏洞文件:./comment/api/index.php,漏洞参数…

企业级大模型应用的Java-Python异构融合架构实践

一、后端语言相关技术生态 Python语言 Python在AI计算领域拥有全面的生态支持: 底层工具库: Pandas、NumPy、SciPy、Matplotlib深度学习框架: PyTorch、TensorFlow领域专用框架: HuggingFace Transformers(社区生态为主) 常见Python框架 …

C#连接sql server

连接时,出现如下提示: ERROR [IM014] [Microsoft][ODBC 驱动程序管理器] 在指定的 DSN 中,驱动程序和应用程序之间的体系结构不匹配 原因是odbc的驱动和应用程序的架构不一致。我的odbc如下所示: 显示为64位,而c#程序显…

粉色和紫色渐变壁纸怎么设计?

粉色和紫色的渐变壁纸设计可以打造极为浪漫的氛围,这两种颜色的搭配极具梦幻感与浪漫气息,常被用于各种浪漫主题的设计之中。以下是关于粉色和紫色渐变壁纸的设计方法: 一、渐变方向设计 横向渐变:从画面左侧的粉色过渡到右侧的紫…

AOP基础-01.快速入门

一.AOP 对于统计每一个业务方法的耗时这一操作,如果再业务层的每一个方法前获取方法运行的开始时间,方法结束获取结束时间,然后计算执行耗时,那这样就太繁琐了。能不能定义一个模板方法,使得该方法能够在业务层的方法执…

Go小技巧易错点100例(二十三)

本期分享: 1.Go Module控制Go版本 2.int转string注意事项 3.Go项目查看mod依赖关系 Go Module控制Go版本 当我们开发Go项目涉及到两台及以上的机器,而且它们又刚好是不同操作系统的时候,可能就要把代码挪到另一台机器上重新编译&#xff…

使用Docker Desktop部署GitLab

1. 环境准备 确保Windows 10/11系统支持虚拟化技术(需在BIOS中开启Intel VT-x/AMD-V)内存建议≥8GB,存储空间≥100GB 2. 安装Docker Desktop 访问Docker官网下载安装包安装时勾选"Use WSL 2 instead of Hyper-V"(推荐…