Python爬虫（入门+进阶）学习笔记 3-1 爬虫工程师进阶（七）：HTTP请求分析

Chrome浏览器相对于其他的浏览器而言，DevTools（开发者工具）非常强大。这节课将为大家介绍怎么利用Chrome浏览器的开发者工具进行HTTP请求分析

Chrome浏览器讲解

Chrome 开发者工具是一套内置于Google Chrome中的Web开发和调试工具，可用来对网站进行迭代、调试和分析

打开Chrome开发工具

• 在Chrome菜单中选择更多工具 >开发者工具
• 在页面元素上右键点击，选择“检查”
• 或者使用快捷键：Ctrl+Shift+I (Windows) 或 Cmd+Opt+I (Mac)

开发者工具的功能结构

• Elements（元素面板）：使用“元素”面板可以通过自由操纵DOM和CSS来重演您网站的布局和设计。
• Console（控制台面板）：在开发期间，可以使用控制台面板记录诊断信息，或者使用它作为 shell，在页面上与JavaScript交互
• Sources（源代码面板）：在源代码面板中设置断点来调试 JavaScript ，或者通过Workspaces（工作区）连接本地文件来使用开发者工具的实时编辑器
• Network（网络面板）：从发起网页页面请求Request后得到的各个请求资源信息（包括状态、资源类型、大小、所用时间等），并可以根据这个进行网络性能优化
• Performance（性能面板）：使用时间轴面板，可以通过记录和查看网站生命周期内发生的各种事件来提高页面运行时的性能
• Memory（内存面板）：分析web应用或者页面的执行时间以及内存使用情况
• Application（应用面板）：记录网站加载的所有资源信息，包括存储数据（Local Storage、Session Storage、-IndexedDB、Web SQL、Cookies）、缓存数据、字体、图片、脚本、样式表等
• Security（安全面板）：使用安全面板调试混合内容问题，证书问题等等
• Audits（审核面板）：对当前网页进行网络利用情况、网页性能方面的诊断，并给出一些优化建议。比如列出所有没有用到的CSS文件等

Network（网络）面板：

Network 面板记录页面上每个网络操作的相关信息，包括详细的耗时数据、HTTP 请求与响应标头和 Cookie

Network面板由五个窗格组成：

• Controls：使用这些选项可以控制 Network 面板的外观和功能 
  
  
• Filters： 使用这些选项可以控制在 Requests Table 中显示哪些资源。提示：按住 Cmd (Mac) 或 Ctrl (Windows/Linux) 并点击过滤器可以同时选择多个过滤器 
  
  
• Overview： 此图表显示了资源检索时间的时间线。如果您看到多条竖线堆叠在一起，则说明这些资源被同时检索 
  
  
• Requests Table： 此表格列出了检索的每一个资源。 默认情况下，此表格按时间顺序排序，最早的资源在顶部。点击资源的名称可以显示更多信息。 提示：右键点击 Timeline 以外的任何一个表格标题可以添加或移除信息列 
  
  
• Summary： 此窗格可以一目了然地告诉您请求总数、传输的数据量和加载时间