发布于 2015-08-25 19:55:55 | 780 次阅读 | 评论: 0 | 来源: PHPERZ
web page模块的功能是处理具体的页面。使用时需要引入模块，并创建实例：
var webPage = require('webpage');
var page = webPage.create();
本文中不经说明， page指代 require("webpage").create()的实例。
page.customHeaders = {
"X-Test": "foo",
"DNT": "1"
};
page.open('http://m.bing.com', function(status) {
var title = page.evaluate(function(s) {
return document.querySelector(s).innerText;
}, 'title');
console.log(title);
phantom.exit();
});
在 这个例子中， page.evaluate()接受两个参数，第一个是必需的，表示需要在page上下文运行的函数 fn；第二个是可选的，表示需要传给 fn的参数 param。 fn允许有一个返回值 return，并且此返回值最终作为 page.evaluate()的返回值。这边对于刚刚命名的 param和 return有一些额外的说明和注意事项。对于整个phantom进程而言， page.evaluate()是跑在一个沙盒中， fn无法访问一切phantom域中的变量；同样 page.evaluate()方法外部也不应该尝试访问page上下文中的内容。那么如果两个作用域需要交换一些数据，只能依靠 param和 return。不过限制很大， param和 return必须为能够转化为JSON字符串，换言之，只能是基本数据类型或者简单对象，像DOM 节点、$对象、function、闭包等就无能为力了。
这个方法是同步的，如果执行的内容对后续操作不具备前置性，可以尝试异步方法以提高性能： page.evaluateAsync()。
var page = require('webpage').create();
page.open('http://github.com/', function() {
page.render('github.png');
phantom.exit();
});
还有其他一些API会对 page.render()产生影响，如：
page.zoomFactor Number： 设置缩放比率page.clipRect Object：设置输出的矩形区域，例如：
page.clipRect = {
top: 14,
left: 3,
width: 400,
height: 300
};
page.renderBase64()，也不再详述。
page.sendEvent('keypress', page.event.key.A, null, null, 0x02000000 | 0x08000000);
page.uploadFile('input[name=image]', '/path/to/some/photo.jpg');
var webPage = require('webpage');
var page = webPage.create();
page.onAlert = function(msg) {
console.log('ALERT: ' + msg);
};
page.onPrompt = function(msg, defaultVal) {
if (msg === "What's your name?") {
return 'PhantomJS';
}
// 返回值就是prompt得到的值
return defaultVal;
};
page.onConfirm = function(msg) {
console.log('CONFIRM: ' + msg);
// 返回true相当于点击“确定”，返回false相当于点击“取消”
return true;
};
page.onConsoleMessage = function(msg, lineNum, sourceId) {
console.log('CONSOLE: ' + msg + ' (from line #' + lineNum + ' in "' + sourceId + '")');
};
page.onInitialized：在page创建后触发。
page.onUrlChanged：在url发生变化时触发。它接受新的url作为参数。首次加载页面， page.onUrlChanged是在 page.onInitialized之后触发。
page.onNavigationRequested：如果在 page.navigationLocked中允许页面跳转，此接口才会有意义（参见 page.navigationLocked）。它接受4个参数，先看示例：
page.onNavigationRequested = function(url, type, willNavigate, main) {
console.log('Trying to navigate to: ' + url);
console.log('Caused by: ' + type);
console.log('Will actually navigate: ' + willNavigate);
console.log('Sent from the page\'s main frame: ' + main);
}
url表示要跳转到的url
type表示产生跳转的原因，可能值有 'Undefined'、 'LinkClicked'、 'FormSubmitted'、 'BackOrForward'、 'Reload'、 'FormResubmitted'、 'Other'
willNavigate表示是否会跳转，由 page.navigationLocked控制
main表示发生跳转的是否是主frame，如果是主frame则为true，如果为其他frame则为false
page.onLoadStarted：在开始载入资源时触发。
page.onLoadFinished：页面所有资源载入完成后触发。其实与 page.open()的回调函数等价。它接受一个参数 status，表示加载是否成功。参见 page.open()。
page.onClosing：当在phantom域调用 page.close()或page上下文调用 window.close()时触发。
page.onError： 此接口捕获所有page上下文发生的javascript错误。参数是错误信息和调用堆栈，参见 phantom.onError。如果page不处理错误，那么这些错误会冒泡到phantom的onError处理器。
page.onCreate：当page创建子窗口时触发，例如在page上下文中使用 window.open，但是子窗口再创建子窗口不会触发此事件。
page.onResourceRequested：当页面请求一个资源时触发的事件，它接受两个参数，
第 一个参数是 requestData对象，它有如下属性：id : 资源请求编号method : http请求方法，get/post等url：请求的URLtime : 一个Date object，包含响应接收的时间headers : http头部的信息列表。第二个参数是networkRequest实例，它包含3个方法：
abort()：中断当前的请求。这样做会触发onResourceErrorchangeUrl(url)：改变当前请求的目标urlsetHeader(key, value)：修改/添加http头部信息
page.onResourceReceived： 当一个资源请求的响应接收到后触发此事件，它接受一个 response对象，这个对象有如下属性：id : 资源请求编号url：请求的URLtime : 一个Date object，包含响应接收的时间headers : http头部的信息列表bodySize : 已接收到的数据大小（全部数据或已接收的部分数据）contentType : 指定的内容类型redirectURL : 如果是一个重定向响应，那么此处是重定向到的urlstage : “start”/ “end”status : http状态码，如：200statusText : http状态描述，如：OK
page.onResourceError：当资源加载失败时，触发此事件。它接收一个 resourceError对象，这个对象有如下属性：id：资源请求的编号，url：请求的URL，errorCode：错误代码，errorString：错误信息。参考如下示例
page.onResourceError = function(resourceError) {
console.log('Unable to load resource (#' + resourceError.id + 'URL:' + resourceError.url + ')');
console.log('Error code: ' + resourceError.errorCode + '. Description: ' + resourceError.errorString);
};