小文笔记 - phantomjs

# 小文笔记 - phantomjs
2017-05-13

## 第一节：安装
``` txt
  Windows安装： 
  下载解压文件 
  我的电脑 -> 属性 -> 高级系统设置 
  点击环境变量 
  在系统变量窗口中，找到Path变量，选中然后选择编辑 
  新建后，添加新的环境变量（phantomjs.exe）所在路径 
  在cmd中，运行phantomjs 
  Mac安装： 
  下载解压文件 
  在用户目录下查看ls -a查看全部文件 
  打开.bash_profile文件 
  加入export PATH=$PATH:/Users/suoyong/phantomjs-2.1.1-macosx/bin 
  在终端中输入phantomjs运行
``` 

`phantomjs -v` 查看版本。

`phantomjs a.js` 运行 `a.js` 文件。

`phantomjs` 进入程序， `console.log(1)` ，运行 js 代码。

`phantom.exit()` 退出.


## 第二节：核心模块
``` txt
  Web page 模块 
  文件模块 
  系统模块 
  子进程模块 
  网络服务模块 
  网站 phantomjs.org/api/
``` 
使用 `require(‘模块名‘)` 引用模块。

a.js
``` js
  var sys = require(‘system‘);

  console.log(sys.args);
  phantom.exit();
``` 

运行，a.js 是第一个参数，hi 是第二个参数。
``` bat
  phantomjs a.js hi
  a.js,hi
``` 

## 第三节：WebPage对象（一）
``` txt
  创建WebPage对象：create() 
  打开网址：page.open 
  在evaluate方法中操作页面（DOM，JSON，Canvas等） 
  把当前页面保存成图片:page.render()

  .create() 创建 webPage 对象实例。
  .open() 打开网址。
  .evaluate() 在这个里面才能操作 web 界面中的内容。
``` 

打开百度首页标题
``` js
  var webpage = require(‘webpage‘);
  var page = webpage.create();

  page.open(‘https://www.baidu.com‘,function(){ // 打开后做的事
    var title = page.evaluate(function(){ // 操作页面
      return document.title
    });
    console.log(title);
    phantom.exit(1); // 1 成功 0失败
  })

``` 

打开对象
``` js
  var webpage = require(‘webpage‘);
  var page = webpage.create();

  page.open(‘https://www.baidu.com‘,function(){ // 打开后做的事
    var title = page.evaluate(function(){ // 操作页面
      return document.getElementById(‘lg‘);
    });
    // console.log(title) // [object Object] ，他其他是一个对象
    // console.dir(title) // [object Object] ，对象
    console.log(JSON.stringify(title)); // 所以需要转换一下
    phantom.exit(1); // 1 成功 0失败
  })

``` 

## 第三节：WebPage对象（二）

不能在 evaluate 中直接使用 console.log 显示 dom 信息，因为为了不影响其他页面正常运行， evaluate 是运行在沙盒中的，他没有 console.log 。

``` js
  var webpage = require(‘webpage‘);
  var page = webpage.create();

  page.open(‘https://www.baidu.com‘,function(){
    page.evaluate(function(){
      console.log(document.getElementById(‘lg‘)); // 不会有 console.log() 输出。
    });
    phantom.exit(1);
  })
``` 

解决方法：为 webpage 对象添加回调函数。
``` js
  var webpage = require(‘webpage‘);
  var page = webpage.create();
  page.onConsoleMessage = function(msg){
    console.log(msg);
  }
  page.open(‘http://www.intalesson.com/‘,function(){
    page.evaluate(function(){
      console.log(document.title);
    });
    phantom.exit(1);
  })
``` 

### 传送参数
如下例添加一个 arg 参数，值为 ‘hi‘ 。
``` js
  var webpage = require(‘webpage‘);
  var page = webpage.create();
  page.onConsoleMessage = function(msg){
    console.log(msg);
  }
  page.open(‘http://www.intalesson.com/‘,function(){
    var title = page.evaluate(function(arg){
      console.log(arg);
    },‘hi‘);
    phantom.exit(1);
  })

``` 

### 设置 user agent
`page.settings.userAgent = ‘要设置的用户代理‘`

## 第五节：提交表单
- `page.onLoadFinished = function(){}` 当页面加载完后执行的函数。
- `Dom.submit()` 提交。
- `模仿点击事件` 提交。

演示登录智联招聘并截图保存。
``` js
  var webpage = require(‘webpage‘);
  var page = webpage.create();

  page.open(‘http://www.zhaopin.com/‘,function(){
    page.evaluate(function(){
      var user = document.getElementById(‘loginname‘);
      var pass = document.getElementById(‘password‘);
      user.value = ‘用户名‘;
      pass.value = ‘密码‘;
      var submit = document.querySelector(‘.logbtn button‘);
      var evt = document.createEvent(‘MouseEvents‘); // 创建一个鼠标事件
      evt.initMouseEvent(‘click‘); // 初始化一个鼠标点击事件
      submit.dispatchEvent(evt); // 使用事件，提交表单
    })

    page.onLoadFinished = function(status){
      if(status == ‘success‘){ // 检查页面是否加载完毕
        page.render(‘1.png‘); // 把页面保存图片
        phantom.exit(1);
      }
    }
  })
``` 
## 第六节：操作Cookie
- cookies 查看
- addCookie 设置 
当设置 cookie 时一定要设置 domain name value 三个值。

``` js
  phantom.addCookie({‘domain‘:‘.baidu.com‘,‘name‘:‘xw‘,‘value‘:‘1‘});
  console.log(JSON.stringify(phantom.cookies));
  phantom.exit(1);
``` 

## 第七节：CasperJS
CasperJS 扩展自 phantomJS ，可更简单的操作页面元素。

phantomjs 不是 nodejs 的模块，但 casperjs 可使用 npm 安装。

- `casper.start() = page.open()`
- `echo() = console.log()`

phantomjs 像 js ， casperjs 像 jq 。

- 安装 casperjs `npm install -g casperjs`

## 第八节：步进式脚本语言



## 小文注
乱码问题： http://blog.csdn.net/kaosini/article/details/47252457
- 方法一：
在 js 文件中添加 `phantom.outputEncoding="gbk"` 可解决乱码。
- 方法二：
`phantomjs --output-encoding=gbk a.js`