禁用f12键开发者工具右键菜单

刺骨的言语ヽ痛彻心扉 2022-11-18 04:55 287阅读 0赞

## ##

### 分享一款插件库disable-devtool 可以禁用所有一切可以进入开发者工具的方法，防止通过开发者工具进行的 ‘代码搬运’，亲测有效哦！！！ ###

该库有以下特性:

1.  支持可配置是否禁用右键菜单
2.  禁用 f12 和 ctrl+shift+i 快捷键
3.  支持识别从浏览器菜单栏打开开发者工具并关闭当前页面
4.  开发者可以绕过禁用 (url参数使用tk配合md5加密)
5.  支持几乎所有浏览器（IE,360,qq浏览器,FireFox,Chrome,Edge...）
6.  高度可配置
7.  使用极简、体积小巧 (仅7kb)
8.  支持npm引用和script标签引用(属性配置)
9.  识别真移动端与浏览器开发者工具设置插件伪造的移动端，为移动端节省性能

### 安装 disable-devtool ###

import disableDevtool from 'disable-devtool';
    
    disableDevtool();

属性配置

disableDevtool(options);

options中的参数与说明如下：

declare interface optionStatic {
        md5?: string; // 绕过禁用的md5值，详情见3.2，默认不启用绕过禁用
        url?: string; // 关闭页面失败时的跳转页面，默认值为localhost
        tkName?: string; // 绕过禁用时的url参数名称，默认为 ddtk
        ondevtoolopen?(): void; // 开发者面板打开的回调，启用时url参数无效
        interval?: number; // 定时器的时间间隔 默认200ms
        disableMenu?: boolean; // 是否禁用右键菜单 默认为true
        stopIntervalTime?: number; // 在移动端时取消监视的等待时长
    }

### 也可以直接script方式引入 ###

script使用属性配置

注：

1.  如希望自动禁用，属性配置时必须要带上 `disable-devtool-auto` 属性
2.  属性配置都是可选的，字段与上面options参数一致，区别是将驼峰形式改成横线分割
3.  该script标签建议放在body最底部

以下是该库官方文档：

**[English][] | [在线试用/文档][Link 1] | [更新日志][Link 2] | [Gitee][]**

[English]: https://github.com/theajack/disable-devtool/blob/master/README.md
[Link 1]: https://theajack.gitee.io/disable-devtool
[Link 2]: https://github.com/theajack/disable-devtool/blob/master/helper/version.md
[Gitee]: https://gitee.com/theajack/disable-devtool