记一次抓取网页内容

已打码

// ==UserScript==
// @name         ---------
// @namespace    http://tampermonkey.net/
// @version      0.1
// @description  https://---------oups/{id}/topics?scope=all&count=20&begin_time=2022-09-01T00%3A00%3A00.000%2B0800&end_time=2022-10-01T00%3A00%3A00.000%2B08
// @author       非
// @run-at       document-end
// @require      https://cdn.jsdelivr.net/jquery/latest/jquery.min.js
// @require      https://cdn.jsdelivr.net/momentjs/latest/moment.min.js
// @require      https://cdnjs.cloudflare.com/ajax/libs/bootstrap-daterangepicker/3.1/daterangepicker.min.js
// @match        https://--------2/index/group/*
// @icon         https://--------mages/favicon_32.ico
// @license      MIT
// ==/UserScript==

;(() => {
    let dateRange = [];

    let link = document.createElement("link");
    link.rel = "stylesheet";
    link.href="https://cdn.jsdelivr.net/npm/daterangepicker/daterangepicker.css";
    document.head.appendChild(link);

    let navBarElem = document.querySelector('.---nt-datepicker');

    // Remove existing
    navBarElem && navBarElem.remove();

    // navBar button
    navBarElem = document.createElement('div');
    navBarElem.classList.add('zsxq-content-datepicker');
    navBarElem.innerHTML = '<input id="demo" type="text" name="daterange"/>';

    // --- CSS Style ---
    const styleElem = document.createElement('style');
    styleElem.type = 'text/css';
    styleElem.innerHTML = `
.zsxq-content-datepicker {
position: fixed;
top: 1rem;
right: 30rem;
bottom: 3.5rem;
z-index: 1999;
width: 2rem;
height: 2rem;
color: white;
font-size: 1.5rem;
line-height: 2rem;
text-align: center;
cursor: pointer;
}
`;

    document.body.appendChild(navBarElem);
    document.head.appendChild(styleElem);

    function simulateMouseClick(targetNode) {
        function triggerMouseEvent(targetNode, eventType) {
            var clickEvent = document.createEvent('MouseEvents');
            clickEvent.initEvent(eventType, true, true);
            targetNode.dispatchEvent(clickEvent);
        }

        ["mouseover", "mousedown", "mouseup", "click"].forEach(function (eventType) {
            triggerMouseEvent(targetNode, eventType);
        });
    }

    // 重新ajax请求url
    const originOpen = XMLHttpRequest.prototype.open;
    XMLHttpRequest.prototype.open = function (_, url) {
        let match = /https\:\/\/------------+\/topics\?scope=all\&count=20/.test(url)
        if (dateRange.length == 2 && match) {
            url += `&begin_time=${dateRange[0]}T00%3A00%3A00.000%2B0800&end_time=${dateRange[1]}T00%3A00%3A00.000%2B0800`
            // console.log("url", url)
            dateRange = [];
        }

//参考了https://developer.mozilla.org/zh-CN/docs/Web/API/XMLHttpRequest
//和 https://www.saoniuhuo.com/question/detail-2342992.html
//和https://www.sojson.com/ascii.html

        originOpen.apply(this, arguments);
        this.addEventListener("readystatechange", function(event) { // 加了这个事件之后,就可以请求的时候打印了
            if(this.readyState == 4){
                console.log(this.responseText);
                 var elementA = document.createElement('a');
      //文件的名称为时间戳加文件名后缀
      elementA.download = +new Date() + ".tpl";
      elementA.style.display = 'none';
      //生成一个blob二进制数据,内容为json数据
      var blob = new Blob([this.responseText]);
      //生成一个指向blob的URL地址,并赋值给a标签的href属性
      elementA.href = URL.createObjectURL(blob);
      document.body.appendChild(elementA);
      elementA.click();
      document.body.removeChild(elementA);
            }
        },false);
    };

    // 日期选择器
    $('#demo').daterangepicker({
        "showDropdowns": true,
        "autoApply": false,
        ranges: {
            '今天': [moment(), moment()],
            '昨天': [moment().subtract(1, 'days'), moment().subtract(1, 'days')],
            '最近 7 天': [moment().subtract(6, 'days'), moment()],
            '最近 30 天': [moment().subtract(29, 'days'), moment()],
            '当月': [moment().startOf('month'), moment().endOf('month')],
            '上月': [moment().subtract(1, 'month').startOf('month'), moment().subtract(1, 'month').endOf('month')]
        },
        "locale": {
            "format": "YYYY-MM-DD",
            "separator": " 至 ",
            "applyLabel": "查询",
            "cancelLabel": "取消",
            "fromLabel": "From",
            "toLabel": "To",
            "customRangeLabel": "自定义",
            "weekLabel": "W",
            "daysOfWeek": [
                "日",
                "一",
                "二",
                "三",
                "四",
                "五",
                "六"
            ],
            "monthNames": [
                "1月",
                "2月",
                "3月",
                "4月",
                "5月",
                "6月",
                "7月",
                "8月",
                "9月",
                "10月",
                "11月",
                "12月"
            ],
            "firstDay": 1
        },
        "alwaysShowCalendars": true,
        "startDate": moment().subtract(6, 'days').format('YYYY-MM-DD'),
        "endDate": moment().format('YYYY-MM-DD'),
        "opens": "left"
    }, function(start, end, label) {
        let s = start.format('YYYY-MM-DD');
        let e = end.add(1, "days").format('YYYY-MM-DD');
        console.log('New date range selected: ' + start.format('YYYY-MM-DD') + ' to ' + end.format('YYYY-MM-DD') + ' (predefined range: ' + label + ')');
        dateRange = [s, e];
    });
    $('#demo').on('apply.daterangepicker', function(ev, picker) {
        let search = document.querySelector("body > app-root > app-index > div > app-topic-flow > div > app-month-selector > ul > li:nth-child(1) > div")
        simulateMouseClick(search);
    });
})()

爬取网页有很多种方式,各有各的利弊,比如python的selenium爬虫,比如rpa的模拟操作,比如抓包,各种都ok,看具体场景适合什么,
这里有个网站非常的操作反人性,还不可复制,基于开源的精神现把他爬出来, 哦对了 上面漏说了js脚本, 这里就是利用了tampermonkey, 找到了一个类似的, 但并不符合我们的要求,另外也有bug, 即改动了url之后请求的签名也是要改的, 前几次还能用后来就会报错签名有问题.
代码如上, 这是初版,不重要,说下基本思路, 重写了ajax的请求函数, 加上了url的重写(这里已经有问题了, url改了之后(长度改了之后) 签名是变化的, js给到他们服务器的签名和服务器自己生成的签名就会对不上, 几次之后就会报签名问题), 然后把请求的结果写到了文件里 方便后续分析处理

不太会js, 需要阻断 好每次发了请求之后隔一段时间再发请求,用到了

function sleep(delay) {
            var start = (new Date()).getTime();
            while((new Date()).getTime() - start < delay) {
                continue;
            }
        }

把sleep放在了请求结果处理的方法里, 发现会一直阻断住请求的结束, 然后发现了

var numOneTen = Math.floor(Math.random()*60+30);
                setTimeout(function(){
                    let search = document.querySelector("body > app-root > app-index > div > app-topic-flow > div > app-month-selector > ul > li:nth-child(1) > div")
                    simulateMouseClick(search);
                },1000*numOneTen);

setTimeout函数, 不会阻断住, 有会把语句放在一段时间后执行. 还不错

做完的效果是, 请求了之后触发下一次请求, 下一次请求把准备好的入参的url发送出去, 再下一次请求, 一直循环.
是能跑的, 还ok, 但还是url的问题, 几次之后就报错了

尝试新方法, 不改动url自然就不会遇到签名的问题, 因为他是每次滚动到底部加载新数据的,猜想可以模拟人的滚动把数据都加载出来, 就发现了回到顶部的函数

document.getElementById("js-gotop").addEventListener("click", function() {
                            document.body.scrollTop = document.documentElement.scrollTop = 0
                        })

放在console里执行一下确实可以用,
然后

document.body.scrollTop = document.documentElement.scrollTop = 50000000

这个也可以用, 至此解决方案已然ok.
首先了在console里试了下面的方式

function sleep(delay) {
    var start = (new Date()).getTime();
    while((new Date()).getTime() - start < delay) {
        continue;
    }
}
var count = 1;
while(true) {
    var numOneTen = Math.floor(Math.random() * 60 + 20);
    console.log("sleep");
    sleep(1000 * numOneTen)
    console.log("sleep over");
    document.body.scrollTop = document.documentElement.scrollTop =  5000*count;
    count = count +1 ;
}

不知道为什么不能成功.

又查了查试了下面的, ok了

setInterval(function(){
    document.body.scrollTop = document.documentElement.scrollTop =  1000000
},10000);

另外这个方法可以用clearTimeout来解除.

至此完成抓取, 为了他们服务器的压力和尊重作者们的知识产权, 不公开方法, 只是记录一个思考的路径和记录些有意思的东西

最近内耗中, 没时间没心情写博客,但,技术从来不是重要的, 重要的是我们做什么,做什么才是重要的,技术只是一种手段,手段可以很多, 目的唯一重要.

//参考了https://developer.mozilla.org/zh-CN/docs/Web/API/XMLHttpRequest
//和 https://www.saoniuhuo.com/question/detail-2342992.html
//和https://www.sojson.com/ascii.html
//https://blog.csdn.net/qq_22158021/article/details/79456246
//https://blog.csdn.net/wxl1555/article/details/86501049

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值