PageGuard.js 防止网站内容复制和检测开发者工具代码

防复制就不多说了,整合了一下 JS 和 CSS 防复制的方法,应该还是比较全的

检测开发者工具的话,整合了各种较新的方法,经测试是支持 Chrome (包括单独窗口打开的情况)和 Firefox (在单独窗口打开时,只有打开控制台时才能检测到),其他浏览器还没有测试,不过估计 chromium 内核的浏览器也都是支持的

演示地址:https://netrvin.github.io/PageGuard.js/example.html

PageGuard.js

没有复制,打印以及开放的开发人员工具。

gzipped后只有1.6KB

它可以阻止用户:

  • 选择
  • 打印
  • 右键点击
  • Crtl / Shift / Alt / F12
  • 开放开发者工具(包括在单独的窗口中打开)

如果你不运行Javascript,你可以使用CSS。但为了安全起见,您应该使用此JavaScript,并且只在Javscript打开时才显示您的页面。

Uasge

下载或

<script type="text/javascript" src="https://netrvin.github.io/PageGuard.js/pageguard.min.js"></script>

防复制

var anticopy_id = PageGuard.antiCopy();

您可以使用以下代码来允许用户再次复制(无法清除CSS):

PageGuard.allowCopy(anticopy_id);

检测开发人员工具

支持的:

  • Chrome(最新版本:66)
  • Opera(最新版本:52)
  • Firefox(最新版本:59)(如果它在一个单独的窗口中打开,它将仅在用户打开控制台时起作用)
  • IE 11(未在eralier中测试)
  • 边缘(如果它在单独的窗口中打开,则不起作用)
  • 其他(未测试)

它只能同时运行一个。

var detect_key = PageGuard.detectDevTools(function () {
	// Your codes will run when developers tools is opening
});

您还可以使用以下代码停止检测:

PageGuard.stopDetecting(detect_key);

安全提示

不要让用户得到anticopy_id和detect_key。你可以这样写你的代码:

(function () {
    // codes
})();

插件

反复制和打印(CSS)

下载或

<link href="https://netrvin.github.io/PageGuard.js/anticopy.min.css" rel="stylesheet">

最后放个下载链接求 star: https://github.com/Netrvin/PageGuard.js

原创声明,本文系作者授权云+社区发表,未经许可,不得转载。

如有侵权,请联系 yunjia_community@tencent.com 删除。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏杂烩

一个综合的分布式项目之项目部署 原

    项目打包有很多种方式,不管是eclipse的export还是mvn的package,最终目的就是把编译后的项目丢到服务器的tomcat下。我们要部署代码...

8720
来自专栏刺客博客

艾特文件管理器 1.8

35950
来自专栏快乐八哥

ASP.NET输出JSON格式数据

一直使用WordPress3.1的版本,12月份WordPress发布了3.5的版本,想尝试升级一一下。当然最好是先在本地环境测试通过,然后上传的服务器是最好的...

350100
来自专栏web编程技术分享

【PHP快速入门】 第一节 php开发环境的配置

这是一个简单,而且免费的PHP教程。 第一节,说一说如何安装PHP的开发环境。为了方便起见,可以直接安装xampp即可。 首先,去百度上搜索xampp,随便...

11330
来自专栏面朝大海春暖花开

springMVC+freemarker实现自定义标签

强烈建议2.3.20或其以上版本,注意还需要引入spring-context-support

11220
来自专栏向治洪

Jar mismatch! Fix your dependencies

  在开发Android项目的时候,有时需要引用多个项目作为library。在引用项目的时候,有时会出现“Jar mismatch! Fix your depe...

20380
来自专栏张善友的专栏

使用MagicAjax 实现无刷新Webparts

介绍MagicAjax Web.config的配置如下: <?xml version="1.0"?> <configuration> <configSecti...

227100
来自专栏十月梦想

node实现静态资源目录(根目录)

前面也讲述了,nodejs没有web容器,访问使用/filename是无法访问文件的,需要通过路由判断然后fs.readFile读取文件才可以!

9920
来自专栏彭湖湾的编程世界

【npm】如何在Atom中安装emmet和atom-beautify插件?

为了提高编写HTML和CSS的速度,最近尝试着在Atom中安装emmet插件,下面谈谈安装成功的过程 1首先我尝试了网上教程中介绍最多的方法:打开Atom的引导...

25550
来自专栏IT派

Vue + Node + Mongodb 开发一个完整博客流程

前言 前段时间刚把自己的个人网站写完, 于是这段时间因为事情不是太多,便整理了一下,写了个简易版的博客系统。 服务端用的是 koa2框架 进行开发。 技术栈 ...

57250

扫码关注云+社区

领取腾讯云代金券