【反爬大核弹】大厂策划们，我来教教你们如何让网站反爬虫

发布时间：2023年12月25日

反爬虫反调试小结：

敢爬我的网站，我就炸了你的电脑！闪花你的双眼。

大家好，这一集我们来学一些非常实用的反爬小妙招。

首先我们来回顾一些非常低级的反爬，有的禁止右键，有的禁止F12，但是我们还可以点击浏览器右上角三个点，然后更多工具然后点击开发者模式啊。我都不信哪个大厂除了谷歌能改这个按钮。

但是啊，网页还可以检测你有没有打开开发者模式啊，如何检测呢？之前是可以判断网页内部宽高和外部宽高差得到，但是这样检测的话我们可以将控制台分离到网页之外就可以检测到。
其实要想检测是否打开了开发者模式挺复杂的，有的帖子一下都划不到头。比如说这个帖子：https://stackoverflow.com/questions/7798748/find-out-whether-chrome-console-is-open/30638226#30638226

但是github有对应的小工具，链接如下：https://github.com/sindresorhus/devtools-detect

我有一个想法就是，悄摸摸的在打开开发者模式进行调试的时候在本地存储下一些暗号，然后页面根据暗号进行一些阻碍操作。

检测到你开启开发者模式之后，然后无限debugger什么的，我觉得这些都没啥意思，新手搜搜教程照着做一下就过去了，就开始找你的加密代码了。

首先要说明的是，我要推荐的反爬方式啊，肯定是能被破解的。只不过我觉得这种方式可以阻挠一下小白。当然只是我觉得，只是我从我的一个爬虫小白的视角来看。

我的建议是直接重定向网页，这个方式啊我看今年年初的时候大模型爆火，然后咱们本地的大厂用的也是这种方法，具体那个大厂我就不说了，也是偶然发现，欸，一右键打开开发者模式就重定向到别的网站了。

就是检测开开发者模式有没有打开，一检测到打开了就重定向到别的网站，这样的话他根本看不到控制台好吧，又谈何去找你的加密代码呢。

其实我们的禁止打开开发者模式的集中手段，还有无限debugger或者是重定向都是比较温和的反爬手段，相当于他只是阻碍了你一下，但是呢，并没有惩罚你什么，但是呢，他其实也可以惩罚你一下，比如说呢，欸，你一打开控制台，我们就给你的大惊喜，比如说，我们可以给你打开一百个资源网站，让你精尽人亡，让你的电脑呢，内存耗尽而卡顿，肯定也会吓你一跳。一下打开了一百个页面，肯定很惊喜吧。

还有别的打开开发者模式就触发的搞人方法吗？当然有，比如说直接关闭浏览器。纳尼，这磨损，还有吗，比如说开启一个动画，频繁改变网页颜色，一闪一闪，就像一个闪光弹，或者蹦迪的颜色。我们可以想象下那个场景，半夜加班你右键想要打开开发者模式，然后你的同事就看到你的屏幕一闪一闪，红色蓝色。

破解办法呢其实就是使用我们的抓包工具，抓取到页面后，查看是哪里的代码实现的重定向，将其注释或者删掉即可。

为什么在我的视角中这种更难点呢？因为一般爬虫小白网页右键过debugger已经有点汗流浃背了，但是如果要使用抓包工具的话，工具还都是英文的，有的同学下载配置完了要用熟练这些工具也很难。

当然啊，我只是刚开始学习爬虫，上面这些知识之前凭兴趣了解的一点东西，可能不是很完善或者正确，所以呢，大家如果觉得我说得好或者不好都可以在评论区留下自己的看法，我们一起交流进步。

本文视频演示：https://www.bilibili.com/video/BV1YG411k7Ab/

代码：

禁用右键和F12

<!DOCTYPE html>
<body>
  禁用右键和F12
  <script>
    // F12
    window.onkeydown = window.onkeyup = window.onkeypress = function (event) {
      // 判断是否按下F12，F12键码为123  
      if (event.keyCode = 123) {
        alert('你按下了F12,\n不要嘛~鸽鸽~')
        event.preventDefault(); // 阻止默认事件行为  
        window.event.returnValue = false;
      }
    }
    // 右键
    document.oncontextmenu = function () {
      alert('你按下了鼠标右键,\n不要嘛~鸽鸽~')
      event.returnValue = false;
    }
  </script>
</body>

无限debugger

<!DOCTYPE html>
<body>
无限debugger
<script>
    function check() {
        debugger;
        setTimeout(check, 1);
    }
    check();
</script>
</body>

检测视图宽高与实际宽高判断是否打开控制台

<!DOCTYPE html>

<body>
    检测视图宽高与实际宽高判断是否打开控制台
<script>
const devtools = {
    isOpen: false,
    orientation: undefined,
};

// inner和outer之间大小的阈值
const threshold = 170;
// 定义监听开发者工具事件
const emitEvent = (isOpen, orientation) => {
    globalThis.dispatchEvent(new globalThis.CustomEvent('devtoolschange', {
        detail: {
            isOpen,
            orientation,
        },
    }));
};

const main = ({ emitEvents = true } = {}) => {
    const widthThreshold = globalThis.outerWidth - globalThis.innerWidth > threshold;
    const heightThreshold = globalThis.outerHeight - globalThis.innerHeight > threshold;
    const orientation = widthThreshold ? 'vertical' : 'horizontal';

    if (
        !(heightThreshold && widthThreshold)
        && ((globalThis.Firebug && globalThis.Firebug.chrome && globalThis.Firebug.chrome.isInitialized) || widthThreshold || heightThreshold)
    ) {
        // 有超过阈值 是打开的
        if ((!devtools.isOpen || devtools.orientation !== orientation) && emitEvents) {
            emitEvent(true, orientation);
        }

        devtools.isOpen = true;
        devtools.orientation = orientation;
    } else {
        // 开发者工具未打开
        if (devtools.isOpen && emitEvents) {
            emitEvent(false, undefined);
        }

        devtools.isOpen = false;
        devtools.orientation = undefined;
    }
};

main({ emitEvents: false });
setInterval(main, 500);
window.addEventListener('devtoolschange', event => {
    console.log(event.detail.isOpen)
});
</script>
</body>

右键网页重定向

<!DOCTYPE html>
<body>
  右键网页重定向
  <script>
    document.oncontextmenu = function () {	
      window.location.href="https://www.baidu.com"
      event.returnValue = false;
    }
  </script>
</body>

右键打开新窗口

<!DOCTYPE html>
<body>
右键打开新窗口
<script>
document.oncontextmenu = function () {
    for(var i=0;i<10;i++){
        window.open('http://www.baidu.com', '_blank')
    }
    event.returnValue = false;
}
</script>
</body>

右键关闭当前网页

<!DOCTYPE html>
<body>
右键关闭当前网页
<script>
document.oncontextmenu = function () {
    window.opener=null;window.open('','_self');
    window.close();
    event.returnValue = false;
}
</script>
</body>

右键闪光弹

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>右键闪光弹</title>
    <style>
        *{margin: 0;padding: 0;}
        #myDiv{
            width: 100vw;
            height: 100vh;
        }
    </style>
</head>
<body>
    <div id="myDiv">派森斗罗,右键闪光弹</div>
<script>
    var flag = 0;
    var int = '';
    function start() {
        var text = document.getElementById("myDiv");
        const colors = ['#FF0000', '#FFA500', '#FFFF00', '#008000', '#00FFFF', '#0000FF', '#800080'];
        const randomIndex = Math.floor(Math.random() * colors.length);
        const randomColor = colors[randomIndex];
        text.style.background = randomColor
        int = setTimeout("start()", 50);
    }
    document.oncontextmenu = function () {
        start();
        event.returnValue = false;
    }
</script>
</body>
</html>

视频介绍：https://www.bilibili.com/video/BV1YG411k7Ab/

总结

🐋 🐬 🐶 🐳 🐰 🦀?? ? 👉 👀

如果你对这篇文章感兴趣，欢迎在评论区留言，分享你的想法和建议。如果你喜欢我的博客，请记得点赞、收藏和关注我，我会持续更新更多有用的网页技巧和教程。谢谢大家！