对于一些简单的网页,我们可以非常容易的通过Develop Tool来获取其请求报文规律,并仿照其构建报文来获取页面信息。但是,随着网页越来越复杂,许多页面是由js动态渲染生成的。要获取这类信息,则需要蜘蛛程序模拟js渲染过程,此时必须研究其js脚本才能完成信息的获取。
虽然从理论上来讲,任何浏览器能获取到的信息,我们完全可以编写爬虫来获取到。但是而这个分析过程往往并不是一个比较麻烦的过程,往往存在如下困难:
- 逆向分析js费时费力,
- 许多爬虫作者并不是前端工程师,效率不高
- 开发阶段容易分析不全,使用时再改开销很大
- 许多信息需要登陆,点击等操作才能获取到,爬虫模拟这些行为比较费劲
- 爬虫容易被网站屏蔽
对于动态网页,一种策略是:首先通过浏览器访问目标网页,由浏览器完成解析后生成渲染后的Html文件,再由蜘蛛程序解析渲染后的Html文件。这样就非常方便的解决的前面遇到的大多数问题了。
要实现这个操作,则需要一个能与应用程序交互的类浏览器软件。网上看到的文章大多数是介绍通过phantomjs完成这一过程,不过用过它的人估计都会对它吐槽不已的,这里我这里就不一一列举了,感兴趣的朋友可以看看别人的吐槽:让人欢喜让我忧的phantomjs。
后来,发现Chrome本身也是可以通过远程调试协议实现与应用程序交互的,并且功能更加强大,从此果断的切换到了Chrome,使用它作为动态网页的渲染器,本文这里对使用Chrome的优越性并不想做太多介绍,主要介绍如何使用它。
启动Chrome
要使得Chrome支持与应用程序交互,首先需要指定远程调试端口:
chrome.exe --remote-debugging-port=9222
- 如果要指定缓存位置,可以添加启动参数:--user-data-dir=r:\cache
- 如果要使用无GUI模式(Headless),则需要添加参数: --disable-gpu --headless
注: Headless 模式目前尚还没有正式完善,目前的情况是:
- --headless在Linux的Chrome59中支持,Windows 的Canary版本60以上的版本支持
- --disable-gpu参数在未来可能不需要,
作为爬虫来说,使用Headless的方式可能更为常见,不过,在学习和开发的过程中,往往还是带着GUI的方式跟为方便些的。这里就使用带GUI的方式启动Chrome。
标签管理
启动后,我们就可以在程序中通过socket的方式实现和chrome的交互了。Chrome Debug API包括两个部分:标签管理和页面管理。首先我们介绍标签管理部分,它是Rest形式的API接口,我们可以通过浏览器进行协议的模拟。
首先用浏览器打开 http://127.0.0.1:9222/json,这是当前所有标签的list接口,可以看到如下接口数据:
[
????{
????????"description": "",
????????"devtoolsFrontendUrl": "/devtools/inspector.html?ws=127.0.0.1:9222/devtools/page/6d4f925f-7220-47cd-a4f9-800686445ffb",
????????"faviconUrl": "http://tianfang.cnblogs.com/favicon.ico",
????????"id": "6d4f925f-7220-47cd-a4f9-800686445ffb",
????????"title": "天方 - 博客园",
????????"type": "page",
????????"url": "http://tianfang.cnblogs.com/",
????????"webSocketDebuggerUrl": "ws://127.0.0.1:9222/devtools/page/6d4f925f-7220-47cd-a4f9-800686445ffb"
????},
????{
????????"description": "",
????????"devtoolsFrontendUrl": "/devtools/inspector.html?ws=127.0.0.1:9222/devtools/page/92615aad-5862-48d5-983d-248468e9741a",
????????"id": "92615aad-5862-48d5-983d-248468e9741a",
????????"title": "Worker pid:6008",
????????"type": "service_worker",
????????"url": "https://www.google.com/_/chrome/newtab-serviceworker.js",
????????"webSocketDebuggerUrl": "ws://127.0.0.1:9222/devtools/page/92615aad-5862-48d5-983d-248468e9741a"
????}
]
相信大部分人从这个页面中就可以它的基本信息,这里仍然简单的介绍一下:
- Id:页面的id信息
- devtoolsFrontendUrl:开发工具Url,可以通过chrome访问这个url来实现内置的调试工具访问
- type:当前进程的类型,只有类型为page的才是浏览器页面,其余类型的是后台背景进程,我们不需要操作这类对象
- url:当前页面访问的地址
- webSocketDebuggerUrl:当前页面的调试接口地址
实际上,chrome本身也内置了一个访问调试协议的工具,我们可以直接通过http://127.0.0.1:9222来使用它。
除此之外,常见的访问命令如下:
- http://127.0.0.1:9222/json?:查看已经打开的Tab列表
- http://127.0.0.1:9222/json/version?: 查看浏览器版本信息
- http://127.0.0.1:9222/json/new?http://www.baidu.com?: 新开Tab打开指定地址
- http://127.0.0.1:9222/json/close/92615aad-5862-48d5-983d-248468e9741a?: 关闭指定Id的Tab页面
- http://127.0.0.1:9222/json/activate/92615aad-5862-48d5-983d-248468e9741a?: 切换到指定Id的Tab页面
?
页面操作
前面的API只能做到简单的打开,关闭标签操作,我么往往还需要对页面进行更详细的操作,由于篇幅所限,本文了先介绍到这里,关于页面操作的方式,在后续文章中再做跟进一步的介绍。