ITPub博客

首页 > 应用开发 > Html/css > Chrome开发者工具关于网络请求的一个隐藏技能

Chrome开发者工具关于网络请求的一个隐藏技能

原创 Html/css 作者:i042416 时间:2018-09-17 20:33:29 0 删除 编辑

这个隐藏技能的背景是,最近出于学习目的,我写了一个百度贴吧的网络爬虫,专门爬取一些指定主题的贴吧帖子。

抓取帖子用的JavaScript函数如下:

function getPostByAJAX(requestURL){   var html = $.ajax({         url: requestURL,         async: false}).responseText;         return html;
}

就是一个非常简单的AJAX请求:

传入该函数的输入参数requestURL的值为:  http://tieba.baidu.com/i/i/my_tie

上面的url,我直接在浏览器里访问可以正常工作,返回47.2KB大小的数据。

然而当我用AJAX函数访问该url时,在Chrome开发者工具里遇到如下错误:

然而,这个错误没有任何明细信息,我没有线索去排错。

于是,就有了本文这个Chrome开发者工具的隐藏技能的用武之地。

在Chrome地址栏打开:  chrome://net-internals

点击Event标签页:

再回到我的百度贴吧爬虫网页,该网页发起AJAX请求,按F5刷新后发送一个新的请求,然后回到Chrome开发者工具。

该AJAX请求的明细就详细显示出来了。找到我关心的url: http://tieba.baidu.com/i/i/my_tie

chrome://net-internals 这个界面显示的网络请求的明细比Network标签页里要详细得多:

在响应头字段里发现了引起这个错误的一些线索:

从上面的截图发现,HTTP响应状态字段为302,location字段为 “ http://static.tieba.baidu.com/tb/error.html?ErrType=1 ” 。这两条线索给了我提示:这个错误一定和百度网站的登陆状态处理相关:我使用的url不支持匿名访问。

我在浏览器里访问该url能够成功,因为我的Cookie在起作用。

Goole了一下,发现了解决方案。在AJAX的请求参数中添加:

xhrFields:{
withCredentials: true}

如此一来,可以将我的cookie和AJAX请求一齐发送给百度服务器。

加上该参数后,请求就能够得到期望的响应了。

使用Chrome开发者工具这个隐藏技能,我们还能观察到一些其他的平时很难发现的细节。

比如我的AJAX请求通过本地的jQuery库文件发出,我的HTML代码里直接引用了本地文件jquery1.7.1.js。在运行时,这个jquery1.7.1.js文件需要被加载到内存中。

使用这个隐藏技能,我现在能观察到jquery1.7.1.js是通过分块的方式被读入到内存中的,参考现在URL_REQUEST_JOB_BYTES_READ的参数:byte_count = 32768。总共分了8块读取,最后1块因为尺寸不满32768,只读了剩下的22285字节。

这8块的总字节数251661正好是jquery1.7.1.js的字节数。由此再次证明, chrome://net-internals 提供的功能比Network标签页里的要强大。

要获取更多Jerry的原创技术文章,请关注公众号"汪子熙"或者扫描下面二维码:



来自 “ ITPUB博客 ” ,链接:http://blog.itpub.net/24475491/viewspace-2214339/,如需转载,请注明出处,否则将追究法律责任。

请登录后发表评论 登录
全部评论
SAP成都研究院开发专家,SAP社区导师,SAP中国技术大使。

注册时间:2018-01-20

  • 博文量
    1051
  • 访问量
    446513