github/disable-devtool
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: 0.1.4

Browse Source
This commit is contained in:
theajack 2021-07-25 17:52:51 +08:00
parent c1aa0bbeba
commit 8c888fe71d
26 changed files with 394 additions and 136 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
.eslintrc.js
View File

@ -56,6 +56,7 @@ module.exports = {
"semi-spacing": "error", "semi-spacing": "error",
"comma-spacing": "error", "comma-spacing": "error",
"key-spacing": "error", "key-spacing": "error",
"no-undef": "error" "no-undef": "error",
"prefer-const": "error"
} }
} }

25
README.cn.md
View File

@ -77,7 +77,7 @@ disable-devtool 可以禁用所有一切可以进入开发者工具的方法，
2. 禁用 f12 和 ctrl+shift+i 快捷键 2. 禁用 f12 和 ctrl+shift+i 快捷键
3. 支持识别从浏览器菜单栏打开开发者工具并关闭当前页面 3. 支持识别从浏览器菜单栏打开开发者工具并关闭当前页面
4. 开发者可以绕过禁用 (url参数使用tk配合md5加密) 4. 开发者可以绕过禁用 (url参数使用tk配合md5加密)
5. 支持几乎所有浏览器（IE,360,qq浏览器,FireFox,Chrome,Edge...） 5. 多种监测模式，支持几乎所有浏览器（IE,360,qq浏览器,FireFox,Chrome,Edge...）
6. 高度可配置 6. 高度可配置
7. 使用极简、体积小巧 (仅7kb) 7. 使用极简、体积小巧 (仅7kb)
8. 支持npm引用和script标签引用(属性配置) 8. 支持npm引用和script标签引用(属性配置)
@ -106,11 +106,14 @@ declare interface optionStatic {
md5?: string; // 绕过禁用的md5值，详情见3.2，默认不启用绕过禁用 md5?: string; // 绕过禁用的md5值，详情见3.2，默认不启用绕过禁用
url?: string; // 关闭页面失败时的跳转页面，默认值为localhost url?: string; // 关闭页面失败时的跳转页面，默认值为localhost
tkName?: string; // 绕过禁用时的url参数名称，默认为 ddtk tkName?: string; // 绕过禁用时的url参数名称，默认为 ddtk
ondevtoolopen?(): void; // 开发者面板打开的回调，启用时url参数无效 ondevtoolopen?(type: DetectorType): void; // 开发者面板打开的回调，启用时url参数无效，type 为监测模式，详见3.5
interval?: number; // 定时器的时间间隔 默认200ms interval?: number; // 定时器的时间间隔 默认200ms
disableMenu?: boolean; // 是否禁用右键菜单 默认为true disableMenu?: boolean; // 是否禁用右键菜单 默认为true
stopIntervalTime?: number; // 在移动端时取消监视的等待时长 stopIntervalTime?: number; // 在移动端时取消监视的等待时长
clearIntervalWhenDevOpenTrigger?: boolean; // 是否在触发之后停止监控
} }
declare type DETECTOR_TYPE = -1 | 0 | 1 | 2 | 3;
``` ```
### 3.2 md5 与 tk 绕过禁用 ### 3.2 md5 与 tk 绕过禁用
@ -156,4 +159,20 @@ disableDevtool.md5('xxx');
// 参数与3.1中一致 // 参数与3.1中一致
}) })
</script> </script>
``` ```
### 3.5 监测模式
Disable-Devtool 有四种监测模式, DisableDevtool.DETECTOR_TYPE 为所有的监测模式
```js
const DETECTOR_TYPE = {
UNKONW: -1,
TO_STRING: 0,
DEFINE_ID: 1,
SIZE: 2,
LOG_TIME: 3,
}
```
ondevtoolopen 事件的回调参数就是被触发的监测模式

25
README.md
View File

@ -76,7 +76,7 @@ The library has the following features:
2. Disable f12 and ctrl+shift+i shortcuts 2. Disable f12 and ctrl+shift+i shortcuts
3. Support recognition to open the developer tools from the browser menu bar and close the current page 3. Support recognition to open the developer tools from the browser menu bar and close the current page
4. Developers can bypass the disablement (use tk and md5 encryption for url parameters) 4. Developers can bypass the disablement (use tk and md5 encryption for url parameters)
5. Support almost all browsers (IE,360,qq browser,FireFox,Chrome,Edge...) 5. Multiple monitoring modes, support almost all browsers (IE, 360, qq browser, FireFox, Chrome, Edge...)
6. Highly configurable 6. Highly configurable
7. Minimal use, small size (only 7kb) 7. Minimal use, small size (only 7kb)
8. Support npm reference and script tag reference (attribute configuration) 8. Support npm reference and script tag reference (attribute configuration)
@ -105,11 +105,14 @@ declare interface optionStatic {
md5?: string; // Bypass the disabled md5 value, see 3.2 for details, the bypass disable is not enabled by default md5?: string; // Bypass the disabled md5 value, see 3.2 for details, the bypass disable is not enabled by default
url?: string; // Jump to the page when closing the page fails, the default value is localhost url?: string; // Jump to the page when closing the page fails, the default value is localhost
tkName?: string; // Bypass the url parameter name when disabled, the default is ddtk tkName?: string; // Bypass the url parameter name when disabled, the default is ddtk
ondevtoolopen?(): void; // Callback for opening the developer panel, the url parameter is invalid when enabled ondevtoolopen?(type: DetectorType): void; // Callback for opening the developer panel, the url parameter is invalid when it is enabled, and the type is the monitoring mode, see 3.5 for details
interval?: number; // Timer interval is 200ms by default interval?: number; // Timer interval is 200ms by default
disableMenu?: boolean; // Whether to disable the right-click menu The default is true disableMenu?: boolean; // Whether to disable the right-click menu The default is true
stopIntervalTime?: number; // Waiting time to cancel monitoring on mobile stopIntervalTime?: number; // Waiting time to cancel monitoring on mobile
clearIntervalWhenDevOpenTrigger?: boolean; // Whether to stop monitoring after triggering
} }
declare type DETECTOR_TYPE = -1 | 0 | 1 | 2 | 3;
``` ```
### 3.2 md5 and tk bypass disable ### 3.2 md5 and tk bypass disable
@ -155,4 +158,20 @@ Note:
// The parameters are the same as in 3.1 // The parameters are the same as in 3.1
}) })
</script> </script>
``` ```
### 3.5 Monitoring Mode
Disable-Devtool has four monitoring modes, DisableDevtool.DETECTOR_TYPE is all monitoring modes
```js
const DETECTOR_TYPE = {
UNKONW: -1,
TO_STRING: 0,
DEFINE_ID: 1,
SIZE: 2,
LOG_TIME: 3,
}
```
The callback parameter of the ondevtoolopen event is the triggered monitoring mode

4
helper/copy-to-npm.js
View File

@ -8,9 +8,9 @@ function main () {
copyPkg(); copyPkg();
copyFiles(); copyFiles();
} }
function copyPkg () { function copyPkg () {
let npmPkg = util.pick({ const npmPkg = util.pick({
target: pkg, target: pkg,
attrs: [ attrs: [
'name', 'version', 'description', 'main', 'unpkg', 'jsdelivr', 'name', 'version', 'description', 'main', 'unpkg', 'jsdelivr',

2
helper/mod-index-html-version.js
View File

@ -3,7 +3,7 @@ const util = require('./util');
function modIndexHtmlVersion () { function modIndexHtmlVersion () {
util.read('index.html', (html) => { util.read('index.html', (html) => {
let res = html.match(new RegExp(`https://cdn.jsdelivr.net/npm/disable-devtool@.*/disable-devtool.min.js#use`)); const res = html.match(new RegExp(`https://cdn.jsdelivr.net/npm/disable-devtool@.*/disable-devtool.min.js#use`));
if (res) { if (res) {
util.write('index.html', html.replace(res[0], `https://cdn.jsdelivr.net/npm/disable-devtool@${pkg.version}/disable-devtool.min.js#use`)); util.write('index.html', html.replace(res[0], `https://cdn.jsdelivr.net/npm/disable-devtool@${pkg.version}/disable-devtool.min.js#use`));
} }

2
helper/util.js
View File

@ -1,4 +1,4 @@
let fs = require('fs'); const fs = require('fs');
module.exports = { module.exports = {
read: function (file, cb) { read: function (file, cb) {

8
helper/version.md
View File

@ -44,4 +44,10 @@
1. 加上document的判断 以适应服务端渲染 npm 调用 1. 加上document的判断 以适应服务端渲染 npm 调用
## 0.1.3 ## 0.1.3
1. 修复 disableMenu 参数无效的bug 1. 修复 disableMenu 参数无效的bug
## 0.1.4
1. 增加 detector，增加多种监测模式
2. 使用logTime模式兜底，兼容mac，linux
3. 增加 clearIntervalWhenDevOpenTrigger 参数
4. ondevtoolopen 增加 监测模式 回调参数

11
index.html
View File

@ -97,7 +97,7 @@ disableDevtool();</code>
<li>Disable f12 and ctrl+shift+i shortcuts</li> <li>Disable f12 and ctrl+shift+i shortcuts</li>
<li>Support recognition to open the developer tools from the browser menu bar and close the current page</li> <li>Support recognition to open the developer tools from the browser menu bar and close the current page</li>
<li>Developers can bypass the disablement (use tk and md5 encryption for url parameters)</li> <li>Developers can bypass the disablement (use tk and md5 encryption for url parameters)</li>
<li>Support almost all browsers (IE,360,qq browser,FireFox,Chrome,Edge...)</li> <li>Multiple monitoring modes, support almost all browsers (IE, 360, qq browser, FireFox, Chrome, Edge...)</li>
<li>Highly configurable</li> <li>Highly configurable</li>
<li>Minimal use, small size (only 7kb)</li> <li>Minimal use, small size (only 7kb)</li>
<li>Support npm reference and script tag reference (attribute configuration)</li> <li>Support npm reference and script tag reference (attribute configuration)</li>
@ -121,11 +121,14 @@ disableDevtool(options);</code></p>
md5?: string; // Bypass the disabled md5 value, see 3.2 for details, the bypass disable is not enabled by default md5?: string; // Bypass the disabled md5 value, see 3.2 for details, the bypass disable is not enabled by default
url?: string; // Jump to the page when closing the page fails, the default value is localhost url?: string; // Jump to the page when closing the page fails, the default value is localhost
tkName?: string; // Bypass the url parameter name when disabled, the default is ddtk tkName?: string; // Bypass the url parameter name when disabled, the default is ddtk
ondevtoolopen?(): void; // Callback for opening the developer panel, the url parameter is invalid when enabled ondevtoolopen?(type: DetectorType): void; // Callback for opening the developer panel, the url parameter is invalid when it is enabled
interval?: number; // Timer interval is 200ms by default interval?: number; // Timer interval is 200ms by default
disableMenu?: boolean; // Whether to disable the right-click menu The default is true disableMenu?: boolean; // Whether to disable the right-click menu The default is true
stopIntervalTime?: number; // Waiting time to cancel monitoring on mobile stopIntervalTime?: number; // Waiting time to cancel monitoring on mobile
}</code></p> clearIntervalWhenDevOpenTrigger?: boolean; // Whether to stop monitoring after triggering
}
declare type DETECTOR_TYPE = -1 | 0 | 1 | 2 | 3;</code></p>
<h3>3.2 md5 and tk bypass disable</h3> <h3>3.2 md5 and tk bypass disable</h3>
@ -178,7 +181,7 @@ disableDevtool(options);</code></p>
<script <script
disable-devtool-auto disable-devtool-auto
md5='1aabac6d068eef6a7bad3fdf50a05cc8' md5='1aabac6d068eef6a7bad3fdf50a05cc8'
src='https://cdn.jsdelivr.net/npm/disable-devtool@0.1.3/disable-devtool.min.js#use' src='https://cdn.jsdelivr.net/npm/disable-devtool@0.1.4/disable-devtool.min.js#use'
></script> ></script>
<!-- <script disable-devtool-auto md5='1aabac6d068eef6a7bad3fdf50a05cc8' src='./npm/disable-devtool.min.js'></script> --> <!-- <script disable-devtool-auto md5='1aabac6d068eef6a7bad3fdf50a05cc8' src='./npm/disable-devtool.min.js'></script> -->
<script> <script>

63
npm/README.cn.md
View File

@ -5,19 +5,35 @@
---- ----
<p align=""> <p>
<a href="https://www.github.com/theajack/disable-devtool"><img src="https://img.shields.io/github/stars/theajack/disable-devtool.svg?style=social" alt="star"></a> <a href="https://www.github.com/theajack/disable-devtool/stargazers" target="_black">
<a href="https://theajack.gitee.io"><img src="https://img.shields.io/badge/author-theajack-blue.svg?style=social" alt="Author"></a> <img src="https://img.shields.io/github/stars/theajack/disable-devtool?logo=github" alt="stars" />
</p> </a>
<a href="https://www.github.com/theajack/disable-devtool/network/members" target="_black">
<p align=""> <img src="https://img.shields.io/github/forks/theajack/disable-devtool?logo=github" alt="forks" />
<a href="https://www.npmjs.com/package/disable-devtool"><img src="https://img.shields.io/npm/v/disable-devtool.svg" alt="Version"></a> </a>
<a href="https://npmcharts.com/compare/disable-devtool?minimal=true"><img src="https://img.shields.io/npm/dm/disable-devtool.svg" alt="Downloads"></a> <a href="https://www.npmjs.com/package/disable-devtool" target="_black">
<a href="https://cdn.jsdelivr.net/gh/theajack/disable-devtool/dist/disable-devtool.latest.min.js"><img src="https://img.shields.io/bundlephobia/minzip/disable-devtool.svg" alt="Size"></a> <img src="https://img.shields.io/npm/v/disable-devtool?logo=npm" alt="version" />
<a href="https://github.com/theajack/disable-devtool/blob/master/LICENSE"><img src="https://img.shields.io/npm/l/disable-devtool.svg" alt="License"></a> </a>
<a href="https://github.com/theajack/disable-devtool/search?l=javascript"><img src="https://img.shields.io/github/languages/top/theajack/disable-devtool.svg" alt="TopLang"></a> <a href="https://www.npmjs.com/package/disable-devtool" target="_black">
<img src="https://img.shields.io/npm/dm/disable-devtool?color=%23ffca28&logo=npm" alt="downloads" />
</a>
<a href="https://www.jsdelivr.com/package/npm/disable-devtool" target="_black">
<img src="https://data.jsdelivr.com/v1/package/npm/disable-devtool/badge" alt="jsdelivr" />
</a>
<a href="https://github.com/theajack/disable-devtool/issues"><img src="https://img.shields.io/github/issues-closed/theajack/disable-devtool.svg" alt="issue"></a> <a href="https://github.com/theajack/disable-devtool/issues"><img src="https://img.shields.io/github/issues-closed/theajack/disable-devtool.svg" alt="issue"></a>
</p>
<p>
<a href="https://github.com/theajack" target="_black">
<img src="https://img.shields.io/badge/Author-%20theajack%20-7289da.svg?&logo=github" alt="author" />
</a>
<a href="https://www.github.com/theajack/disable-devtool/blob/master/LICENSE" target="_black">
<img src="https://img.shields.io/github/license/theajack/disable-devtool?color=%232DCE89&logo=github" alt="license" />
</a>
<a href="https://cdn.jsdelivr.net/npm/disable-devtool/disable-devtool.min.js"><img src="https://img.shields.io/bundlephobia/minzip/disable-devtool.svg" alt="Size"></a>
<a href="https://github.com/theajack/disable-devtool/search?l=javascript"><img src="https://img.shields.io/github/languages/top/theajack/disable-devtool.svg" alt="TopLang"></a>
<a href="https://www.github.com/theajack/disable-devtool"><img src="https://img.shields.io/librariesio/dependent-repos/npm/disable-devtool.svg" alt="Dependent"></a> <a href="https://www.github.com/theajack/disable-devtool"><img src="https://img.shields.io/librariesio/dependent-repos/npm/disable-devtool.svg" alt="Dependent"></a>
<a href="https://github.com/theajack/disable-devtool/blob/master/test/test-report.txt"><img src="https://img.shields.io/badge/test-passed-44BB44" alt="test"></a>
</p> </p>
**[English](https://github.com/theajack/disable-devtool/blob/master/README.md) | [在线试用/文档](https://theajack.gitee.io/disable-devtool) | [更新日志](https://github.com/theajack/disable-devtool/blob/master/helper/version.md) | [Gitee](https://gitee.com/theajack/disable-devtool)** **[English](https://github.com/theajack/disable-devtool/blob/master/README.md) | [在线试用/文档](https://theajack.gitee.io/disable-devtool) | [更新日志](https://github.com/theajack/disable-devtool/blob/master/helper/version.md) | [Gitee](https://gitee.com/theajack/disable-devtool)**
@ -61,7 +77,7 @@ disable-devtool 可以禁用所有一切可以进入开发者工具的方法，
2. 禁用 f12 和 ctrl+shift+i 快捷键 2. 禁用 f12 和 ctrl+shift+i 快捷键
3. 支持识别从浏览器菜单栏打开开发者工具并关闭当前页面 3. 支持识别从浏览器菜单栏打开开发者工具并关闭当前页面
4. 开发者可以绕过禁用 (url参数使用tk配合md5加密) 4. 开发者可以绕过禁用 (url参数使用tk配合md5加密)
5. 支持几乎所有浏览器（IE,360,qq浏览器,FireFox,Chrome,Edge...） 5. 多种监测模式，支持几乎所有浏览器（IE,360,qq浏览器,FireFox,Chrome,Edge...）
6. 高度可配置 6. 高度可配置
7. 使用极简、体积小巧 (仅7kb) 7. 使用极简、体积小巧 (仅7kb)
8. 支持npm引用和script标签引用(属性配置) 8. 支持npm引用和script标签引用(属性配置)
@ -90,11 +106,14 @@ declare interface optionStatic {
md5?: string; // 绕过禁用的md5值，详情见3.2，默认不启用绕过禁用 md5?: string; // 绕过禁用的md5值，详情见3.2，默认不启用绕过禁用
url?: string; // 关闭页面失败时的跳转页面，默认值为localhost url?: string; // 关闭页面失败时的跳转页面，默认值为localhost
tkName?: string; // 绕过禁用时的url参数名称，默认为 ddtk tkName?: string; // 绕过禁用时的url参数名称，默认为 ddtk
ondevtoolopen?(): void; // 开发者面板打开的回调，启用时url参数无效 ondevtoolopen?(type: DetectorType): void; // 开发者面板打开的回调，启用时url参数无效，type 为监测模式，详见3.5
interval?: number; // 定时器的时间间隔 默认200ms interval?: number; // 定时器的时间间隔 默认200ms
disableMenu?: boolean; // 是否禁用右键菜单 默认为true disableMenu?: boolean; // 是否禁用右键菜单 默认为true
stopIntervalTime?: number; // 在移动端时取消监视的等待时长 stopIntervalTime?: number; // 在移动端时取消监视的等待时长
clearIntervalWhenDevOpenTrigger?: boolean; // 是否在触发之后停止监控
} }
declare type DETECTOR_TYPE = -1 | 0 | 1 | 2 | 3;
``` ```
### 3.2 md5 与 tk 绕过禁用 ### 3.2 md5 与 tk 绕过禁用
@ -140,4 +159,20 @@ disableDevtool.md5('xxx');
// 参数与3.1中一致 // 参数与3.1中一致
}) })
</script> </script>
``` ```
### 3.5 监测模式
Disable-Devtool 有四种监测模式, DisableDevtool.DETECTOR_TYPE 为所有的监测模式
```js
const DETECTOR_TYPE = {
UNKONW: -1,
TO_STRING: 0,
DEFINE_ID: 1,
SIZE: 2,
LOG_TIME: 3,
}
```
ondevtoolopen 事件的回调参数就是被触发的监测模式

63
npm/README.md
View File

@ -4,19 +4,35 @@
---- ----
<p align=""> <p>
<a href="https://www.github.com/theajack/disable-devtool"><img src="https://img.shields.io/github/stars/theajack/disable-devtool.svg?style=social" alt="star"></a> <a href="https://www.github.com/theajack/disable-devtool/stargazers" target="_black">
<a href="https://theajack.gitee.io"><img src="https://img.shields.io/badge/author-theajack-blue.svg?style=social" alt="Author"></a> <img src="https://img.shields.io/github/stars/theajack/disable-devtool?logo=github" alt="stars" />
</p> </a>
<a href="https://www.github.com/theajack/disable-devtool/network/members" target="_black">
<p align=""> <img src="https://img.shields.io/github/forks/theajack/disable-devtool?logo=github" alt="forks" />
<a href="https://www.npmjs.com/package/disable-devtool"><img src="https://img.shields.io/npm/v/disable-devtool.svg" alt="Version"></a> </a>
<a href="https://npmcharts.com/compare/disable-devtool?minimal=true"><img src="https://img.shields.io/npm/dm/disable-devtool.svg" alt="Downloads"></a> <a href="https://www.npmjs.com/package/disable-devtool" target="_black">
<a href="https://cdn.jsdelivr.net/gh/theajack/disable-devtool/dist/disable-devtool.latest.min.js"><img src="https://img.shields.io/bundlephobia/minzip/disable-devtool.svg" alt="Size"></a> <img src="https://img.shields.io/npm/v/disable-devtool?logo=npm" alt="version" />
<a href="https://github.com/theajack/disable-devtool/blob/master/LICENSE"><img src="https://img.shields.io/npm/l/disable-devtool.svg" alt="License"></a> </a>
<a href="https://github.com/theajack/disable-devtool/search?l=javascript"><img src="https://img.shields.io/github/languages/top/theajack/disable-devtool.svg" alt="TopLang"></a> <a href="https://www.npmjs.com/package/disable-devtool" target="_black">
<img src="https://img.shields.io/npm/dm/disable-devtool?color=%23ffca28&logo=npm" alt="downloads" />
</a>
<a href="https://www.jsdelivr.com/package/npm/disable-devtool" target="_black">
<img src="https://data.jsdelivr.com/v1/package/npm/disable-devtool/badge" alt="jsdelivr" />
</a>
<a href="https://github.com/theajack/disable-devtool/issues"><img src="https://img.shields.io/github/issues-closed/theajack/disable-devtool.svg" alt="issue"></a> <a href="https://github.com/theajack/disable-devtool/issues"><img src="https://img.shields.io/github/issues-closed/theajack/disable-devtool.svg" alt="issue"></a>
</p>
<p>
<a href="https://github.com/theajack" target="_black">
<img src="https://img.shields.io/badge/Author-%20theajack%20-7289da.svg?&logo=github" alt="author" />
</a>
<a href="https://www.github.com/theajack/disable-devtool/blob/master/LICENSE" target="_black">
<img src="https://img.shields.io/github/license/theajack/disable-devtool?color=%232DCE89&logo=github" alt="license" />
</a>
<a href="https://cdn.jsdelivr.net/npm/disable-devtool/disable-devtool.min.js"><img src="https://img.shields.io/bundlephobia/minzip/disable-devtool.svg" alt="Size"></a>
<a href="https://github.com/theajack/disable-devtool/search?l=javascript"><img src="https://img.shields.io/github/languages/top/theajack/disable-devtool.svg" alt="TopLang"></a>
<a href="https://www.github.com/theajack/disable-devtool"><img src="https://img.shields.io/librariesio/dependent-repos/npm/disable-devtool.svg" alt="Dependent"></a> <a href="https://www.github.com/theajack/disable-devtool"><img src="https://img.shields.io/librariesio/dependent-repos/npm/disable-devtool.svg" alt="Dependent"></a>
<a href="https://github.com/theajack/disable-devtool/blob/master/test/test-report.txt"><img src="https://img.shields.io/badge/test-passed-44BB44" alt="test"></a>
</p> </p>
**[中文](https://github.com/theajack/disable-devtool/blob/master/README.cn.md) | [online trial/document](https://theajack.gitee.io/disable-devtool) | [Version Log](https://github.com/theajack/disable-devtool/blob/master/helper/version.md) | [Gitee](https://gitee.com/theajack/disable-devtool)** **[中文](https://github.com/theajack/disable-devtool/blob/master/README.cn.md) | [online trial/document](https://theajack.gitee.io/disable-devtool) | [Version Log](https://github.com/theajack/disable-devtool/blob/master/helper/version.md) | [Gitee](https://gitee.com/theajack/disable-devtool)**
@ -60,7 +76,7 @@ The library has the following features:
2. Disable f12 and ctrl+shift+i shortcuts 2. Disable f12 and ctrl+shift+i shortcuts
3. Support recognition to open the developer tools from the browser menu bar and close the current page 3. Support recognition to open the developer tools from the browser menu bar and close the current page
4. Developers can bypass the disablement (use tk and md5 encryption for url parameters) 4. Developers can bypass the disablement (use tk and md5 encryption for url parameters)
5. Support almost all browsers (IE,360,qq browser,FireFox,Chrome,Edge...) 5. Multiple monitoring modes, support almost all browsers (IE, 360, qq browser, FireFox, Chrome, Edge...)
6. Highly configurable 6. Highly configurable
7. Minimal use, small size (only 7kb) 7. Minimal use, small size (only 7kb)
8. Support npm reference and script tag reference (attribute configuration) 8. Support npm reference and script tag reference (attribute configuration)
@ -89,11 +105,14 @@ declare interface optionStatic {
md5?: string; // Bypass the disabled md5 value, see 3.2 for details, the bypass disable is not enabled by default md5?: string; // Bypass the disabled md5 value, see 3.2 for details, the bypass disable is not enabled by default
url?: string; // Jump to the page when closing the page fails, the default value is localhost url?: string; // Jump to the page when closing the page fails, the default value is localhost
tkName?: string; // Bypass the url parameter name when disabled, the default is ddtk tkName?: string; // Bypass the url parameter name when disabled, the default is ddtk
ondevtoolopen?(): void; // Callback for opening the developer panel, the url parameter is invalid when enabled ondevtoolopen?(type: DetectorType): void; // Callback for opening the developer panel, the url parameter is invalid when it is enabled, and the type is the monitoring mode, see 3.5 for details
interval?: number; // Timer interval is 200ms by default interval?: number; // Timer interval is 200ms by default
disableMenu?: boolean; // Whether to disable the right-click menu The default is true disableMenu?: boolean; // Whether to disable the right-click menu The default is true
stopIntervalTime?: number; // Waiting time to cancel monitoring on mobile stopIntervalTime?: number; // Waiting time to cancel monitoring on mobile
clearIntervalWhenDevOpenTrigger?: boolean; // Whether to stop monitoring after triggering
} }
declare type DETECTOR_TYPE = -1 | 0 | 1 | 2 | 3;
``` ```
### 3.2 md5 and tk bypass disable ### 3.2 md5 and tk bypass disable
@ -139,4 +158,20 @@ Note:
// The parameters are the same as in 3.1 // The parameters are the same as in 3.1
}) })
</script> </script>
``` ```
### 3.5 Monitoring Mode
Disable-Devtool has four monitoring modes, DisableDevtool.DETECTOR_TYPE is all monitoring modes
```js
const DETECTOR_TYPE = {
UNKONW: -1,
TO_STRING: 0,
DEFINE_ID: 1,
SIZE: 2,
LOG_TIME: 3,
}
```
The callback parameter of the ondevtoolopen event is the triggered monitoring mode

2
npm/disable-devtool.min.js vendored
View File

File diff suppressed because one or more lines are too long

12
npm/index.d.ts vendored
View File

@ -1,15 +1,25 @@
declare type DETECTOR_TYPE = -1 | 0 | 1 | 2 | 3;
declare interface optionStatic { declare interface optionStatic {
md5?: string; // 绕过禁用的md5值，详情见3.2，默认不启用绕过禁用 md5?: string; // 绕过禁用的md5值，详情见3.2，默认不启用绕过禁用
url?: string; // 关闭页面失败时的跳转页面，默认值为localhost url?: string; // 关闭页面失败时的跳转页面，默认值为localhost
tkName?: string; // 绕过禁用时的url参数名称，默认为 ddtk tkName?: string; // 绕过禁用时的url参数名称，默认为 ddtk
ondevtoolopen?(): void; // 开发者面板打开的回调，启用时url参数无效 ondevtoolopen?(type: DETECTOR_TYPE): void; // 开发者面板打开的回调，启用时url参数无效
interval?: number; // 定时器的时间间隔 默认200ms interval?: number; // 定时器的时间间隔 默认200ms
disableMenu?: boolean; // 是否禁用右键菜单 默认为true disableMenu?: boolean; // 是否禁用右键菜单 默认为true
stopIntervalTime?: number; // 在移动端时取消监视的等待时长 stopIntervalTime?: number; // 在移动端时取消监视的等待时长
clearIntervalWhenDevOpenTrigger?: boolean; // 是否在触发之后停止监控
} }
declare interface DDTStatic { declare interface DDTStatic {
(option?: optionStatic): void; (option?: optionStatic): void;
md5(text?: string): string; md5(text?: string): string;
DETECTOR_TYPE: {
UNKONW: -1;
TO_STRING: 0;
DEFINE_ID: 1;
SIZE: 2;
LOG_TIME: 3;
}
version: string; version: string;
} }

2
npm/package.json
View File

@ -1,6 +1,6 @@
{ {
"name": "disable-devtool", "name": "disable-devtool",
"version": "0.1.3", "version": "0.1.4",
"description": "Disable web developer tools from the f12 button, right-click and browser ", "description": "Disable web developer tools from the f12 button, right-click and browser ",
"main": "disable-devtool.min.js", "main": "disable-devtool.min.js",
"unpkg": "disable-devtool.min.js", "unpkg": "disable-devtool.min.js",

2
package.json
View File

@ -1,6 +1,6 @@
{ {
"name": "disable-devtool", "name": "disable-devtool",
"version": "0.1.3", "version": "0.1.4",
"description": "Disable web developer tools from the f12 button, right-click and browser ", "description": "Disable web developer tools from the f12 button, right-click and browser ",
"main": "disable-devtool.min.js", "main": "disable-devtool.min.js",
"unpkg": "disable-devtool.min.js", "unpkg": "disable-devtool.min.js",

5
src/config.js
View File

@ -1,6 +1,6 @@
import {closeWindow} from './util'; import {closeWindow} from './util';
export let config = { export const config = {
md5: '', md5: '',
ondevtoolopen: closeWindow, // ondevtoolopen 优先级高于 url ondevtoolopen: closeWindow, // ondevtoolopen 优先级高于 url
url: '', url: '',
@ -8,10 +8,11 @@ export let config = {
interval: 200, interval: 200,
disableMenu: true, // 该参数ie下无效，ie 右键菜单会阻塞线程影响debug延迟计算 禁用右键菜单 disableMenu: true, // 该参数ie下无效，ie 右键菜单会阻塞线程影响debug延迟计算 禁用右键菜单
stopIntervalTime: 5000, // 在移动端时取消监视的等待时长 stopIntervalTime: 5000, // 在移动端时取消监视的等待时长
clearIntervalWhenDevOpenTrigger: false, // 是否在触发之后停止监控
}; };
export function mergeConfig (opts = {}) { export function mergeConfig (opts = {}) {
for (let k in config) { for (const k in config) {
if (typeof opts[k] !== 'undefined' && typeof config[k] === typeof opts[k]) { if (typeof opts[k] !== 'undefined' && typeof config[k] === typeof opts[k]) {
config[k] = opts[k]; config[k] = opts[k];
} }

24
src/detector/define-id.js Normal file
View File

@ -0,0 +1,24 @@
/*
* @Author: theajack
* @Date: 2021-07-24 23:15:49
* @LastEditor: theajack
* @LastEditTime: 2021-07-25 16:46:36
* @Description: Coding something
*/
import {DETECTOR_TYPE, triggerOnDevOpen} from './detector';
import {registInterval} from '../interval';
export default function detector () {
const div = document.createElement('div');
div.__defineGetter__('id', function () {
triggerOnDevOpen(DETECTOR_TYPE.DEFINE_ID);
});
Object.defineProperty(div, 'id', {
get: function () {
triggerOnDevOpen(DETECTOR_TYPE.DEFINE_ID);
},
});
registInterval(() => {
console.log(div);
});
}

44
src/detector/detector.js Normal file
View File

@ -0,0 +1,44 @@
/*
* @Author: theajack
* @Date: 2021-07-24 23:16:34
* @LastEditor: theajack
* @LastEditTime: 2021-07-25 17:07:04
* @Description: Coding something
*/
import {config} from '../config';
import ToStringDetector from './to-string';
import DefineIdDetector from './define-id';
import SizeDetector from './size';
import LogTimeDetector from './log-time';
import {clearDDInterval, clearDDTimeout} from '../interval';
const detectorList = [];
export const DETECTOR_TYPE = {
UNKONW: -1,
TO_STRING: 0,
DEFINE_ID: 1,
SIZE: 2,
LOG_TIME: 3,
};
export function registDetector (detector) {
detectorList.push(detector);
}
export function initDetectors () {
ToStringDetector();
DefineIdDetector();
SizeDetector();
LogTimeDetector();
}
export function triggerOnDevOpen (type = DETECTOR_TYPE.UNKONW) {
console.warn(`You ar not allow to use DEVTOOL! 【type = ${type}】`);
if (config.clearIntervalWhenDevOpenTrigger) {
clearDDInterval();
}
clearDDTimeout();
config.ondevtoolopen(type);
}

30
src/detector/log-time.js Normal file
View File

@ -0,0 +1,30 @@
/*
* @Author: theajack
* @Date: 2021-07-24 23:15:22
* @LastEditor: theajack
* @LastEditTime: 2021-07-25 16:35:51
* @Description: Coding something
*/
import {DETECTOR_TYPE, triggerOnDevOpen} from './detector';
import {registInterval} from '../interval';
function logTime () {
const d = new Date();
for (let i = 0; i < 1000; i++) {
console.log(1);
}
console.clear();
if (new Date() - d > 40) {
console.warn(new Date() - d);
triggerOnDevOpen(DETECTOR_TYPE.LOG_TIME);
}
}
export default function detector () {
registInterval((time) => {
if (time % 5 === 0) {
logTime();
}
});
}

28
src/detector/size.js Normal file
View File

@ -0,0 +1,28 @@
/*
* @Author: theajack
* @Date: 2021-07-24 23:15:54
* @LastEditor: theajack
* @LastEditTime: 2021-07-25 17:12:51
* @Description: Coding something
* @FilePath: \disable-devtool\src\detector\size.js
*/
import {DETECTOR_TYPE, triggerOnDevOpen} from './detector';
function checkWindowSizeUneven () {
const threshold = 160;
const widthUneven = window.outerWidth - window.innerWidth > threshold;
const heightUneven = window.outerHeight - window.innerHeight > threshold;
if (widthUneven || heightUneven) {
triggerOnDevOpen(DETECTOR_TYPE.SIZE);
return false;
}
return true;
}
export default function detector () {
checkWindowSizeUneven();
window.addEventListener('resize', () => {
setTimeout(checkWindowSizeUneven, 100);
}, true);
}

38
src/detector/to-string.js Normal file
View File

@ -0,0 +1,38 @@
/*
* @Author: theajack
* @Date: 2021-07-24 23:15:01
* @LastEditor: theajack
* @LastEditTime: 2021-07-25 16:54:13
* @Description: Coding something
*/
import {registInterval} from '../interval';
import {isFirefox, isQQBrowser} from '../util';
import {DETECTOR_TYPE, triggerOnDevOpen} from './detector';
// 这个方法在chrome 中无论是否打开都会触发
export default function detector () {
const isQQ = isQQBrowser();
const isFF = isFirefox();
if (!isQQ && !isFF) return;
let lastTime = 0;
const reg = /./;
console.log(reg);
reg.toString = function () {
if (isQQ) { // ! qq浏览器在控制台没有打开的时候也会触发 打开的时候会连续触发两次 使用这个来判断
const time = new Date().getTime();
if (lastTime && time - lastTime < 100) {
triggerOnDevOpen(DETECTOR_TYPE.TO_STRING);
} else {
lastTime = time;
}
} else if (isFF) {
triggerOnDevOpen(DETECTOR_TYPE.TO_STRING);
}
return '';
};
registInterval(() => {
console.log(reg);
});
}

12
src/index.d.ts vendored
View File

@ -1,15 +1,25 @@
declare type DETECTOR_TYPE = -1 | 0 | 1 | 2 | 3;
declare interface optionStatic { declare interface optionStatic {
md5?: string; // 绕过禁用的md5值，详情见3.2，默认不启用绕过禁用 md5?: string; // 绕过禁用的md5值，详情见3.2，默认不启用绕过禁用
url?: string; // 关闭页面失败时的跳转页面，默认值为localhost url?: string; // 关闭页面失败时的跳转页面，默认值为localhost
tkName?: string; // 绕过禁用时的url参数名称，默认为 ddtk tkName?: string; // 绕过禁用时的url参数名称，默认为 ddtk
ondevtoolopen?(): void; // 开发者面板打开的回调，启用时url参数无效 ondevtoolopen?(type: DETECTOR_TYPE): void; // 开发者面板打开的回调，启用时url参数无效
interval?: number; // 定时器的时间间隔 默认200ms interval?: number; // 定时器的时间间隔 默认200ms
disableMenu?: boolean; // 是否禁用右键菜单 默认为true disableMenu?: boolean; // 是否禁用右键菜单 默认为true
stopIntervalTime?: number; // 在移动端时取消监视的等待时长 stopIntervalTime?: number; // 在移动端时取消监视的等待时长
clearIntervalWhenDevOpenTrigger?: boolean; // 是否在触发之后停止监控
} }
declare interface DDTStatic { declare interface DDTStatic {
(option?: optionStatic): void; (option?: optionStatic): void;
md5(text?: string): string; md5(text?: string): string;
DETECTOR_TYPE: {
UNKONW: -1;
TO_STRING: 0;
DEFINE_ID: 1;
SIZE: 2;
LOG_TIME: 3;
}
version: string; version: string;
} }

16
src/interval.js
View File

@ -2,24 +2,26 @@ import {config} from './config';
import {hackAlert, isPC, onPageShowHide} from './util'; import {hackAlert, isPC, onPageShowHide} from './util';
let interval = null, timer = null; let interval = null, timer = null;
let calls = []; const calls = [];
let time = 0;
export function initInterval () { export function initInterval () {
let _pause = false; let _pause = false;
let pause = () => {_pause = true;}; const pause = () => {_pause = true;};
let goon = () => {_pause = false;}; const goon = () => {_pause = false;};
hackAlert(pause, goon); // 防止 alert等方法触发了debug延迟计算 hackAlert(pause, goon); // 防止 alert等方法触发了debug延迟计算
onPageShowHide(goon, pause); // 防止切后台触发了debug延迟计算 onPageShowHide(goon, pause); // 防止切后台触发了debug延迟计算
interval = window.setInterval(() => { interval = window.setInterval(() => {
if (_pause) return; if (_pause) return;
calls.forEach(fn => {fn();}); calls.forEach(fn => {fn(time++);});
console.clear();
}, config.interval); }, config.interval);
// 两秒之后判断 如果不是pc去掉定时器interval，为了优化移动端的性能 // 两秒之后判断 如果不是pc去掉定时器interval，为了优化移动端的性能
// 如果控制面板被打开了该定时器timer会被清除 // 如果控制面板被打开了该定时器timer会被清除
timer = setTimeout(() => { timer = setTimeout(() => {
if (!isPC()) { if (!isPC()) {
clearInterval(); clearDDInterval();
} }
}, config.stopIntervalTime); }, config.stopIntervalTime);
} }
@ -28,10 +30,10 @@ export function registInterval (fn) {
calls.push(fn); calls.push(fn);
} }
export function clearInterval () { export function clearDDInterval () {
window.clearInterval(interval); window.clearInterval(interval);
} }
export function clearTimeout () { export function clearDDTimeout () {
window.clearTimeout(timer); window.clearTimeout(timer);
} }

2
src/key-menu.js
View File

@ -3,7 +3,7 @@ import {config} from './config';
export function disableKeyAndMenu () { export function disableKeyAndMenu () {
window.addEventListener('keydown', (e) => { window.addEventListener('keydown', (e) => {
e = e || window.event; e = e || window.event;
let keyCode = e.keyCode || e.which; const keyCode = e.keyCode || e.which;
// alert(e.keyCode); // alert(e.keyCode);
if (keyCode === 123 || (e.shiftKey && e.ctrlKey && e.keyCode === 73)) { if (keyCode === 123 || (e.shiftKey && e.ctrlKey && e.keyCode === 73)) {
e.returnValue = false; e.returnValue = false;

67
src/main.js
View File

@ -1,39 +1,26 @@
import {disableKeyAndMenu} from './key-menu'; import {disableKeyAndMenu} from './key-menu';
import {initInterval, registInterval, clearTimeout} from './interval'; import {initInterval} from './interval';
import {formatName, getUrlParam, isFirefox, isQQBrowser} from './util'; import {formatName, getUrlParam} from './util';
import {mergeConfig, config} from './config'; import {mergeConfig, config} from './config';
import md5 from './md5'; import md5 from './md5';
import version from './version'; import version from './version';
import {DETECTOR_TYPE, initDetectors} from './detector/detector';
export function disableDevtool (opts) { export function disableDevtool (opts) {
mergeConfig(opts); mergeConfig(opts);
if (checkTk()) {return;} if (checkTk()) {return;}
initInterval(); initInterval();
disableKeyAndMenu(); disableKeyAndMenu();
initDevTool(); initDetectors();
} }
disableDevtool.md5 = md5; disableDevtool.md5 = md5;
disableDevtool.version = version; disableDevtool.version = version;
disableDevtool.DETECTOR_TYPE = DETECTOR_TYPE;
let hasOpened = false;
export function onDevToolOpen () {
let time = new Date().getTime();
console.log('You ar not allow to use DEVTOOL!', time);
if (hasOpened) {return {time, next () {}};}
if (!isQQBrowser()) {
hasOpened = true;
}
return {time, next () {
hasOpened = true;
clearTimeout();
config.ondevtoolopen();
}};
}
function checkTk () { function checkTk () {
if (config.md5) { // 启用了 md5 if (config.md5) { // 启用了 md5
let tk = getUrlParam(config.tkName); const tk = getUrlParam(config.tkName);
if (md5(tk) === config.md5) { // 命中tk if (md5(tk) === config.md5) { // 命中tk
return true; return true;
} }
@ -41,51 +28,15 @@ function checkTk () {
return false; return false;
} }
function initDevTool () {
const isQQ = isQQBrowser();
const isFF = isFirefox();
let toTest = '';
if (isQQ) {
let lastTime = 0;
toTest = /./;
console.log(toTest);
toTest.toString = function () {
let {time, next} = onDevToolOpen();
if (lastTime && time - lastTime < 100) {
next();
} else {
lastTime = time;
}
return '';
};
} else if (isFF) {
toTest = /./;
console.log(toTest);
toTest.toString = function () {
onDevToolOpen().next();
return '';
};
} else {
toTest = new Image();
toTest.__defineGetter__('id', function () {
onDevToolOpen().next();
});
}
registInterval(() => {
console.log(toTest);
console.clear();
});
}
function checkScriptUse () { function checkScriptUse () {
if (typeof document === 'undefined') { if (typeof document === 'undefined') {
return; return;
} }
let dom = document.querySelector('[disable-devtool-auto]'); const dom = document.querySelector('[disable-devtool-auto]');
if (!dom) { if (!dom) {
return; return;
} }
let json = {}; const json = {};
['md5', 'url', 'tk-name', 'interval', 'disable-menu'].forEach(name => { ['md5', 'url', 'tk-name', 'interval', 'disable-menu'].forEach(name => {
let value = dom.getAttribute(name); let value = dom.getAttribute(name);
if (value !== null) { if (value !== null) {

38
src/util.js
View File

@ -1,27 +1,29 @@
import {config} from './config'; import {config} from './config';
import {clearDDInterval} from './interval';
export function isPC () { export function isPC () {
return !/(iphone|ipad|ipod|ios|android)/i.test(navigator.userAgent.toLowerCase()); return !/(iphone|ipad|ipod|ios|android)/i.test(navigator.userAgent.toLowerCase());
} }
export function closeWindow () { export function closeWindow () {
// 需要是有js跳转到这个页面才可以关闭这个页面 clearDDInterval();
if (config.url) { if (config.url) {
window.location.href = config.url; window.location.href = config.url;
} else { } else {
try { try {
window.opener = null; window.opener = null;
window.open('', '_self'); window.open('', '_self');
// 需要是有js跳转到这个页面才可以关闭这个页面
window.close(); window.close();
window.history.back(); window.history.back();
} catch (e) { } catch (e) {
console.log(e); console.log(e);
} }
setTimeout(() => { setTimeout(() => {
// 否则执行跳转到 url
window.location.href = `https://tackchen.gitee.io/404.html?h=${encodeURIComponent(location.host)}`; window.location.href = `https://tackchen.gitee.io/404.html?h=${encodeURIComponent(location.host)}`;
}, 500); }, 500);
} }
// 否则执行跳转到 url
} }
export function getNowTime () { export function getNowTime () {
@ -29,10 +31,10 @@ export function getNowTime () {
} }
export function getUrlParam (name) { export function getUrlParam (name) {
let search = window.location.search; const search = window.location.search;
if (search !== '') { if (search !== '') {
let reg = new RegExp('(^|&)' + name + '=([^&]*)(&|$)', 'i'); const reg = new RegExp('(^|&)' + name + '=([^&]*)(&|$)', 'i');
let r = search.substr(1).match(reg); const r = search.substr(1).match(reg);
if (r != null) { if (r != null) {
return unescape(r[2]); return unescape(r[2]);
} }
@ -44,7 +46,7 @@ export function formatName (name) {
if (name.indexOf('-') === -1) { if (name.indexOf('-') === -1) {
return name; return name;
} }
var flag = false; let flag = false;
return name.split('').map(c => { return name.split('').map(c => {
if (c === '-') { if (c === '-') {
flag = true; flag = true;
@ -60,7 +62,7 @@ export function formatName (name) {
export function onPageShowHide (onshow, onhide) { export function onPageShowHide (onshow, onhide) {
var hidden, state, visibilityChange; let hidden, state, visibilityChange;
if (typeof document.hidden !== 'undefined') { if (typeof document.hidden !== 'undefined') {
hidden = 'hidden'; hidden = 'hidden';
visibilityChange = 'visibilitychange'; visibilityChange = 'visibilitychange';
@ -78,7 +80,7 @@ export function onPageShowHide (onshow, onhide) {
visibilityChange = 'webkitvisibilitychange'; visibilityChange = 'webkitvisibilitychange';
state = 'webkitVisibilityState'; state = 'webkitVisibilityState';
} }
var cb = function () { const cb = function () {
if (document[state] === hidden) { if (document[state] === hidden) {
onhide(); onhide();
} else { } else {
@ -90,10 +92,10 @@ export function onPageShowHide (onshow, onhide) {
} }
export function hackAlert (before, after) { export function hackAlert (before, after) {
let _alert = window.alert; const _alert = window.alert;
let _confirm = window.confirm; const _confirm = window.confirm;
let _prompt = window.prompt; const _prompt = window.prompt;
let mod = (fn) => { const mod = (fn) => {
return (...args) => { return (...args) => {
if (before) {before();} if (before) {before();}
fn(...args); fn(...args);
@ -106,15 +108,15 @@ export function hackAlert (before, after) {
} }
export function isIE () { export function isIE () {
var userAgent = navigator.userAgent; // 取得浏览器的userAgent字符串 const userAgent = navigator.userAgent; // 取得浏览器的userAgent字符串
var isIE = userAgent.indexOf('compatible') > -1 && userAgent.indexOf('MSIE') > -1; // 判断是否IE<11浏览器 const isIE = userAgent.indexOf('compatible') > -1 && userAgent.indexOf('MSIE') > -1; // 判断是否IE<11浏览器
var isEdge = userAgent.indexOf('Edge') > -1 && !isIE; // 判断是否IE的Edge浏览器 const isEdge = userAgent.indexOf('Edge') > -1 && !isIE; // 判断是否IE的Edge浏览器
var isIE11 = userAgent.indexOf('Trident') > -1 && userAgent.indexOf('rv:11.0') > -1; const isIE11 = userAgent.indexOf('Trident') > -1 && userAgent.indexOf('rv:11.0') > -1;
return isIE || isEdge || isIE11; return isIE || isEdge || isIE11;
// if (isIE) { // if (isIE) {
// var reIE = new RegExp('MSIE (\\d+\\.\\d+);'); // let reIE = new RegExp('MSIE (\\d+\\.\\d+);');
// reIE.test(userAgent); // reIE.test(userAgent);
// var fIEVersion = parseFloat(RegExp['$1']); // let fIEVersion = parseFloat(RegExp['$1']);
// if (fIEVersion == 7) { // if (fIEVersion == 7) {
// return 7; // return 7;
// } else if (fIEVersion == 8) { // } else if (fIEVersion == 8) {

2
src/version.js
View File

@ -1 +1 @@
export default '0.1.3'; export default '0.1.4';