phantomJs入门

想学爬虫，最初学习的是Python，学了urllib，BeautifulSoup，但学了段时间后想爬几个网站试试，发现一个很大问题：很多网站通过客户端渲染，直接读取源码根本读不到最终展现出来的html元素。

科普一下，网页渲染可分为服务端渲染和客户端渲染，前者是指你在浏览器地址栏输入一个网址，Web服务器处理请求过程就将所有需要呈现的html元素都构造好了，浏览器收到响应就直接render出页面，客户端工作量少；后者是指Web服务器仅仅将必要的信息作为响应传到浏览器，浏览器需要根据响应进行二次处理，比如ajax请求，再根据ajax请求的结果构造html。

urllib不具备js执行能力，自然不能模拟浏览器执行js请求ajax等效果，于是，所谓无头浏览器phontmJs就出现了，借助这个工具可以模拟webkit执行，还可以包含更多js库比如jQuery等对页面的js执行进行扩展。

下面介绍下phantomJs的入门知识：

1）安装（以Windows为例）：

通过 http://phantomjs.org/download.html 下载编译后的可执行phantom.exe，只要这一个exe就可以包含所有需要的内容，无需其他依赖项，方便快捷绿色环保。

2）IDE及调试选择：

个人喜欢使用 VS Code，这个IDE还是更新很快的，使用方面也越用越顺手，一个额外的福利是存在可用于 VS Code 的 phantomJs 调试插件：Debugger for PhantomJS，这就是说可以在VS Code 中直接加断点调试代码，否则就只能按照官方说法使用额外参数到谷歌浏览器调试，这种调试我尝试过觉得很不好用。

3）代码以及调试准备：

在VS Code中安装 Debugger for PhantomJS  很简单，只要在左侧扩展选项中搜索 PhantomJS 该插件点击安装，安装完毕后重新启动VS Code即可，另外，需要在VS Code中调试代码需要新增一个 launch.json 文件，不用手动新增，在左侧调试选项中点击齿轮图标新增调试配置即可，详细可参照官方文档。

launch.json配置文件的核心参数如下：

            "file": "${workspaceRoot}/src/show_title.js",

            "webRoot": "${workspaceRoot}/src",

            "runtimeExecutable": "C:/Program Files/phantomjs/bin/phantomjs.exe",

            "sourceMaps": false

file：需要调试的js文件，即启动文件

webRoot：源文件根目录（我创建了一个src文件夹）

runtimeExecutable：安装环节所下载的exe文件绝对路径

sourceMaps：是否使用map，目前设定false即可

4）真正的编码开始啦：

到此可以开始coding了，我们就在src文件夹创建 show_title.js文件：

var page = require('webpage').create();

page.open("https://www.baidu.com", function(status) {

  if ( status === "success" ) {

      console.log(page.title);

  } else {

      console.log("Page failed to load.");

  }

  phantom.exit(0);

});

上面的代码打开了百度首页，并将其页面标题打印出来，代码很简单，涉及到 webpage 的几个简单知识点，先给大家瞅瞅API，总结方面下次再补充，睡觉去。