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

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

该库有以下特性:

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

安装 disable-devtool

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

属性配置

disableDevtool(options);

options中的参数与说明如下：

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

也可以直接script方式引入

<script disable-devtool-auto src='https://cdn.jsdelivr.net/npm/disable-devtool/disable-devtool.min.js'></script>

script使用属性配置

<script disable-devtool-autosrc='https://cdn.jsdelivr.net/npm/disable-devtool/disable-devtool.min.js'md5='xxx'url='xxx'tk-name='xxx'interval='xxx'disable-menu='xxx'
></script>

注：

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

以下是该库官方文档：

English | 在线试用/文档 | 更新日志 | Gitee

禁用f12键开发者工具右键菜单相关推荐

谷歌浏览器F12（开发者工具） -----功能介绍
测试调试时使用最多的功能页面是:元素(ELements).控制台(Console).源代码(Sources).网络(Network)等. 元素(Elements):用于查看或修改HTML元素的属性.C ...
自定义右键菜单，禁用浏览器自带的右键菜单[右键菜单实现--Demo]
许多从事Web开发的会发现有些事,我们需要禁用浏览器本事自带的右键菜单,而实现自定义的右键菜单下面我们也来实现一个自定义的右键菜单首先来创建JSP页面 1 <%@ page language ...
chrome F12 谷歌开发者工具详解 Network篇
开发者工具初步介绍 chrome开发者工具最常用的四个功能模块: Elements:主要用来查看前面界面的html的Dom结构,和修改css的样式.css可以即时修改,即使显示.大大方便了开发者调试页 ...
f12获取网页文本_F12 - 开发者工具详解
学习使用浏览器自带的 F12 网页开发者工具,可以帮助前端以及测试人员来快速定位调试分析问题.解决问题. 一.如何调出开发者工具在浏览器页面上F12键 (笔记本电脑 Fn + F12) 右键选择检 ...
IE11 全新的F12开发者工具
我讨厌debug,相信也没多少开发者会喜欢.但是当代码出错之后肯定是要找出问题出在哪里的.不过网页开发的时候遇到 BUG 是一件再正常不过的事情了,我们不能保证自己的代码万无一失,于是使用浏览器的开发 ...
f12获取网页文本_细说网页开发者工具F12-前端开发利器一
网页开发者工具之 Elements 前言写这篇文章的目的主要是为了帮助前端小白,学习使用浏览器自带的F12网页开发者工具,来快速定位调试分析问题.解决问题.当然这仅是作者的个人学习心得,有不足之处欢 ...
Chrome 技术篇-F12开发者工具清理缓存，高级、专业清浏览器缓存，storage和cache都指什么、区别
作为一名开发,作为一名技术人员,直接用浏览器清缓存的话会显的不够专业. 开发者工具清理的好处: 它可以很清晰的清理对应的缓存,让我们知道哪些缓存对我们的哪些代码有影响,提高我们对整体代码的把控,提升我 ...
联想电脑谷歌浏览器f12无法唤起开发者工具
联想电脑谷歌浏览器F12键无法唤起开发者工具刚入职新的公司,接手了上一个离职员工的台式联想电脑,键盘有一个键是坏的.使用谷歌浏览器调试页面时,按F12唤起开发者工具时灵时不灵.我认为是键盘的问题,遂 ...
《浏览器F12开发者工具的妙用》
浏览器的有趣玩法前端相关小技巧 ^-^ 下面的几种用法本人都--试过,还是挺有意思的,安利一下. 一:复制不可复制的文字例子(比如我在某乎分享过一篇文章,我设置了不可转载,那么如果别人想复制我的文 ...

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

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

安装 disable-devtool

也可以直接script方式引入

禁用f12键开发者工具右键菜单相关推荐

最新文章

热门文章

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

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

安装 disable-devtool

也可以直接script方式引入

禁用f12键 开发者工具 右键菜单相关推荐

最新文章

热门文章

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

禁用f12键开发者工具右键菜单相关推荐