网页防止打开开发者模式,防止恶意测试或采集方法

81次阅读
没有评论

为什么要防止被恶意调式?

我们的目的是尽可能的减少资源被盗取,防止爬虫和攻击、以及api !

第一种方式

禁止F12和右击、审查元素设置中强行打开开发者会直接关闭网页。

		<script>
			//禁用右键(防止右键查看源代码)
			window.oncontextmenu = function() {
				return false;
			}
			//禁止任何键盘敲击事件(防止F12和shift+ctrl+i调起开发者工具)
			window.onkeydown = window.onkeyup = window.onkeypress = function() {
				window.event.returnValue = false;
				return false;
			}
			//如果用户在工具栏调起开发者工具,那么判断浏览器的可视高度和可视宽度是否有改变,如有改变则关闭本页面
			var h = window.innerHeight,
				w = window.innerWidth;
			window.onresize = function() {
				if (h != window.innerHeight || w != window.innerWidth) {
					window.close();
					window.location = "about:blank";
				}
			}
		</script>

第二种方式

使用开源项目ConsoleBan。

Github:https://github.com/fz6m/console-ban/blob/master/README.zh.md

<script src="https://cdn.jsdelivr.net/npm/console-ban@5.0.0/dist/console-ban.min.js"></script>
<script>
	// 第一种防爬虫的方法,打开F12自动重定向
	// ConsoleBan.init({
	// 	redirect: '/404'
	// })
 
	//第二种防爬虫的方法,重写页面元素
	var div = document.createElement('div')
	div.innerHTML = '<h1> 不要偷看啦~</h1>'
	ConsoleBan.init({
	// 重写 body 为字符串
	write: '<h1> 不要偷看啦~ </h1>',
	// 可传入节点对象
	write: div
	})
 
	//第三种防爬虫的方法,打开F12自动走debugger
	ConsoleBan.init({
	debug: true,
	debugTime: 1
	})
</script>

主要是通过ConsoleBan.init()进行实例化,跟Vue实例化用法类似,该对象可传参数如下:

网页防止打开开发者模式,防止恶意测试或采集方法

第三种方式

自动清空控制台。

<script>
	var clear = console.clear
	setTimeout(clear, 1)
</script>

三种方式都很好用,具体使用那种方式进行防范可以根据自己实际需求进行选定!

正文完
 0
116博客
版权声明:本篇文章由 116博客 于2024-09-24发表,共计1165字。
转载说明:除特殊说明外本站文章皆由CC-4.0协议发布,转载请注明出处。
评论(没有评论)
验证码