Page 417 - AngularJS权威教程

30.7 使用 Zombie.js 获取 HTML 快照 397

下面我们会讨论两个获取快照的方法：使用Zombie.js和一个Grunt工具。这里不会涉及使用 19
①
出色的PhantomJS ，因为已经有很多介绍它的优秀资源了。
30.7 使用 Zombie.js 获取 HTML 快照 20

要使用Zombie.js ，需要安装zombie这个npm包： 21
②
$ npm install zombie

现在，我们可以通过使用zombie来使用NodeJS保存文件了。首先，在这个过程中会用到一些 22
辅助方法：

var Brower = require('zombie'), 23
url = require('url'),
fs = require('fs'),
saveDir = __dirname + '/snapshots'; 24

var scriptTagRegExp = /<script\b[^<]*(?:(?!<\/script>)<[^<]*)*<\/script>/gi;

var stripScriptTags = function(html) { 25
return html.replace(scriptTagRegexp, '');
}
26
var browserOpts = {
waitFor: 2000,
loadCSS: fase,
runScripts: true 27
}

var saveSnapshot = function(uri, body) { 28
var lastIdx - uri.lastIndexOf('#/');
if(lastIdx < 0) {
// 如果使用html5mode
path = 29
url.parse(uri).pathname;
} else {
// 如果使用hashbang模式 30
path = uri.substring(lastIdx + 1, uri.length);
}
31
if(path === '/') path = "/index.html";

if(path.indexOf('.html') == -1)
path += ".html"; 32

var filename = saveDir + path;
fs.open(filename, 'w', function(e, fd) { 33
if(e) return;
fs.write(fd, body);
});
}; 34

现在，我们需要做的就是遍历所有页面，将每个链接从相对链接转换为绝对链接（这样爬虫
才能追踪它们），然后保存生成的HTML。 35

——————————
① http://phantomjs.org/ 36
② http://zombie.labnotes.org/