[脚本实战篇]分析网络请求

李恒道

之前知道我们点击章节会远程加载一下内容
所以这节课目的主要是分析一下网络请求封装出一个函数
抓包可以知道调用了一个getRess

提交参数也非常简单
是一个章节id

那么我们的目标很简单了
就是将之前得到的数组全部转化为章节id
并实现请求，拿到相应数据
我们再查看一下返回数据

可以看到就是简单的章节内数据
那我们开始写吧
先从dom中读取到章节数据
这里看到有两种元素，li的是主章节的，a是子章节的

我们先看主章节，在data-id属性上

而子章节的却在data-secid上

那么我们可以直接写一个暴力判断
通过读data-id属性，如果读不到直接写一个data-secid属性
因为我们是遍历数组，所以可以直接写一个map属性，然后根据其返回值进行赋值

ChapterList= ChapterList.map((item)=>item.getAttribute("data-id")??item.getAttribute("data-secid"))

可以直接由dom数组转化成id的数组集合

然后我们封装GM_Xhr制作一个简单的promise的post封装

function GetRessList(id){
    return new Promise((resolve,reject)=>{

        GM_xmlhttpRequest({
            url:"https://service.icourses.cn/hep-company//sword/company/getRess",
            method :"POST",
            data:"sectionId="+id,
            headers: {
                "Content-type": "application/x-www-form-urlencoded; charset=UTF-8"
            },
            onload:function(xhr){
                try {
                    resolve(JSON.parse(xhr.responseText).model.listRes)
                }
                catch(err) {
                    resolve([])
                }
            }
        });
    })
}

这里用了promise封装，然后直接json解析找到listRes，如果中间出现任何错误则返回一个空数组

然后简单测试一下

可以发现拿到了数组~
那么这节课我们就搞定了
下节课我们开始尝试操控网页的数据来实现自动刷课！