luizbizzio/siteguard

GitHub: luizbizzio/siteguard

一个轻量级客户端 JavaScript 工具,通过浏览器级别限制阻止随意查看和复制网页内容,但无法防御有经验的攻击者。

Stars: 23 | Forks: 0

SiteGuard 🛡️

版本:1.0.0
作者:Luiz Bizzio
许可证:Apache License Version 2.0
https://github.com/luizbizzio/siteguard
发布日期:2024-11-08

## 概述 🚀 SiteGuard 是一个轻量级的客户端 JavaScript 威慑工具。 它旨在通过浏览器级别的限制,阻止对网站内容的随意检查、复制和交互。 该项目**不提供真正的安全性**,不应被视为对抗爬虫、抓取工具或恶意用户的保护机制。 ## 演示 🕵️‍♂️ 在线演示:https://siteguard.pages.dev/ 此演示展示了脚本如何应对随意操作(右键点击、选择、常见快捷键)。 高级用户仍然可以绕过它。 ## 这不是什么 - 不是安全解决方案 - 不是爬虫保护 - 不是 WAF 替代品 - 不是访问控制 ## 浏览器级别限制 🌟 | 限制 | 描述 | 状态 | | ------- | ----------- | ------ | | 📅 开发者工具检测 | 监控开发者工具,检测到时清除内容。 | ✅ 已激活 | | 🔍 禁止拖拽元素 | 禁用元素拖拽以保持内容完整性。 | ✅ 已激活 | | 🚧 阻止中键点击 | 禁用中键打开新标签页和图片。 | ✅ 已激活 | | 🚫 禁用右键菜单 | 阻止上下文菜单出现,减少内容窃取。 | ✅ 已激活 | | 🔒 阻止组合键 | 阻止用户使用快捷键打开开发者工具和 JavaScript 控制台。 | ✅ 已激活 | | 🛑 禁止选择文本 | 禁用网页上的文本选择,使复制变得困难。 | ✅ 已激活 | | 🖨️ 打印时隐藏内容 | 用户尝试打印页面时隐藏所有内容。 | ✅ 已激活 | ## 如何使用 🔧 ### 压缩脚本版本(推荐)✅ 此轻量级压缩版本适用于大多数情况。它以更小的体积应用相同的浏览器级别威慑。 ``` ```


### **重要说明 ⚠** 请确保将此脚本直接嵌入到 `` 标签的最开始位置,即在 `` 标签之前,以便在页面变为可交互之前应用限制。高级用户仍然可以绕过或禁用。
### 详细脚本版本 📝 ``` ``` ## 函数说明 📚 本项目使用多种 JavaScript 函数和事件监听器来阻止访问开发者工具,并防止未经授权的交互。以下是每个函数的用途和功能详解。 ### 1. 开发者工具检测 📅 主函数 `af()` 通过评估性能延迟来持续监控开发者工具: - **执行方式:** 每 50ms 运行一次以检测开发者工具。 - **方法:** 使用 `console.profile()` 和 `console.profileEnd()` 测量代码执行时间。 - **触发动作:** 如果执行时间超过 10ms,则假定开发者工具已打开,并清除整个 `document.documentElement`。 此方法通过检查开发者工具打开时通常出现的性能延迟来有效监控访问,且不会影响正常用户交互。 ### 2. 禁止拖拽元素 🔍 通过添加 `dragstart` 事件监听器来禁止元素拖拽: - **执行方式:** `document.addEventListener("dragstart", e => e.preventDefault())` - **功能:** 阻止用户通过拖拽保存图片或内容,从而保持视觉结构和内容安全。 ### 3. 阻止中键点击 🚧 通过 `auxclick` 事件监听器阻止中键点击: - **执行方式:** `document.addEventListener("auxclick", e => e.button === 1 && (e.stopPropagation(), e.preventDefault()))` - **功能:** 阻止中键打开新标签页,限制可能的意外导航,并加强内容访问限制。 ### 4. 禁用右键菜单 🚫 通过 `contextmenu` 事件监听器阻止右键上下文菜单: - **执行方式:** `document.addEventListener("contextmenu", e => e.preventDefault())` - **功能:** 禁用右键点击,减少对检查选项和内容复制的访问。 ### 5. 阻止组合键 🔒 此函数阻止打开开发者工具和其他检查选项的常见快捷键: - **监控的组合键:** 包括 `Ctrl + Shift + I`、`Ctrl + Shift + J`、`Ctrl + U`、`Ctrl + Shift + J` 和 `F12`。 - **执行方式:** 使用 `document.onkeydown` 监听按键。 - **功能:** 阻止常用于访问开发者工具、JavaScript 控制台和源代码查看的快捷键的默认行为。 ### 6. 禁止选择文本 🛑 通过将 `document.body` 的 `userSelect` 属性设置为 `"none"` 来禁止文本选择: - **执行方式:** `document.body.style.userSelect = "none"` - **功能:** 禁用文本选择,提供另一层防止直接内容复制的保护。 ### 7. 打印时隐藏内容 🖨️ 为防止内容被打印,为打印媒体添加特定样式: - **执行方式:** `const printStyle = document.createElement("style"); printStyle.type = "text/css"; printStyle.media = "print"; printStyle.innerHTML = "* { display: none !important; }"; document.head.appendChild(printStyle);` - **功能:** 打印时隐藏所有内容,确保页面内容无法被打印。 ## ⚠ 调整开发者工具检测的灵敏度 ⚠ 提供的代码通过在脚本性能中使用 `performance.now()` 来检测浏览器中的**开发者工具**是否打开。如果脚本执行时间超过某一阈值,则假定开发者工具已打开并触发动作。 使此系统良好工作的关键在于**调整检测的灵敏度**。需要在**检测准确性**和**不同设备的兼容性**之间找到平衡。这一调整取决于用户设备的**性能**和所浏览的**网页类型**。 ## 检测如何工作?🤔 检测基于脚本执行所需的**毫秒(ms)** 时间。脚本预期执行时间与实际时间之间的差值定义了**灵敏度阈值**: - **较小的值**:使系统更敏感,从而更快检测到开发者工具,但可能在较慢设备上触发**误报**。 - **较大的值**:降低灵敏度,提高与较慢设备的**兼容性**,但可能无法在较快设备上迅速检测到开发者工具。 ### 推荐灵敏度 ⚖️ 灵敏度可在 **5ms 到 10ms** 之间调整,以确保有效检测,同时不影响不同设备上的页面性能。 ## CPU 性能限制 🖥️ 你也可以根据设备的**CPU 性能**调整灵敏度。下面展示了**CPU 节流**(限制 CPU 使用)如何影响检测灵敏度。我们通过有意降低 CPU 使用率进行测试,观察检测反应。 | **CPU 使用率(流测试)** | **检测阈值(ms)** | **行为** | **兼容性** | |-----------------------------|---------------------------|--------------------------------------------|------------------------| | **8%** | 150ms | 适用于低负载设备,可能不会在新设备上触发。 | ❌ | | **17%** | 10ms | 在检测速度和设备兼容性之间取得良好平衡。 | ✅ | | **27%** | 5ms | 足够灵敏,但不会在旧设备上产生误报。 | ✅ | | **50%** | 2ms | 非常灵敏,但有轻微误报风险。 | ✅ | | **100%** | 1ms | 极度灵敏,可能在性能较低的设备上导致误报。 | ❌ | ## 根据需求调整灵敏度 🔧 ### 如何为你的站点调整灵敏度 理想的灵敏度取决于你的**站点类型**和用户设备的**预期性能**: - **轻量级站点**:🚀 如果你的站点简单且加载速度快,可以使用**较低值(2ms)** 以快速检测开发者工具。 - **重量级站点**:🏋️ 对于包含许多脚本的复杂站点,最好使用**较高值(5ms 或以上)**,以确保检测不会影响性能。 还需要考虑用户在不同设备上与站点的交互方式,调整灵敏度。 ## 浏览器和处理器之间的差异 🌐 检测性能还取决于用户使用的**浏览器**和**处理器**。我们发现**灵敏度**在不同设备之间可能有所不同,并且此方法**仅适用于基于 Chromium 的浏览器**(如 Chrome、Edge、Opera 等)。 - **CPU 较慢的设备**(如较旧的处理器)可能需要更高的 `ms` 值(10ms 或以上),以避免检测失败。 - **CPU 较快的设备**(较新处理器)可以使用**较低值**(如 5ms 甚至 2ms),使检测更有效。 在使用 **Opera GX**(版本 `114.0.5282.159`)和 **Ryzen 5 5500** 处理器的测试中,通过不同的 CPU 限制来调整代码的灵敏度。 ## 结论 🎯 检测**开发者工具**应根据**站点类型**和用户的**设备配置**进行定制。选择适当的灵敏度值时,需要**平衡检测效果**与**设备兼容性**。 ### 推荐 ✅ - 对于**轻量级站点**,**2ms 到 5ms** 之间的值最适合快速检测。 - 对于**重量级站点**,**5ms 到 10ms** 之间的值更好,既能减少性能影响,又能保持检测有效。 请务必在不同设备上**测试灵敏度设置**,以为所有人提供最佳用户体验。 ## 适用场景 - 低风险网站 - 着陆页和演示 - 阻止随意用户复制内容 - 可接受用户体验限制的情况 ## 不适用场景 - 需要真正保护的内容 - 包含认证用户的应用 - 高价值知识产权 - 需要可访问性或 SEO 保证的环境 ## 许可证 📄 本项目采用 Apache License Version 2.0 授权 - 详细内容请参阅 [许可证](LICENSE) 文件。
标签:CMS安全, DOM解析, JavaScript, 内容保护, 前端安全, 反审查, 反拷贝, 反调试, 右键屏蔽, 客户端威慑, 开发者工具检测, 打印保护, 拖拽禁止, 数据可视化, 网站保护, 自定义脚本, 键盘快捷键阻止