好的,我正在尝试为多个网站运行多个屏幕截图!我已经获得了多个站点的一个屏幕截图,我还可以获得一个站点的多个 Viewport 屏幕截图,但我有 34 个站点需要这样做!那么有人知道用 casperjs 做到这一点的方法吗?这是我认为可行的代码,但只执行第一个 url,然后就结束了!
var casper = require("casper").create();
var screenshotUrls = ["http://www.google.com", "http://www.yahoo.com", "http://www.espn.com"];
var screenshotPaths = ["google.com", "yahoo.com", "espn.com"];
screenshotNow = new Date(),
screenshotDateTime = screenshotNow.getFullYear() + pad(screenshotNow.getMonth() + 1) + pad(screenshotNow.getDate()),
viewports = [
{
'name': 'smartphone-portrait',
'viewport': {width: 320, height: 480}
},
{
'name': 'smartphone-landscape',
'viewport': {width: 480, height: 320}
},
{
'name': 'tablet-portrait',
'viewport': {width: 768, height: 1024}
},
{
'name': 'tablet-landscape',
'viewport': {width: 1024, height: 768}
},
{
'name': 'desktop-standard',
'viewport': {width: 1280, height: 1024}
}
];
i = 0;
//casper.start();
casper.start(screenshotUrls[i], function(self, screenshotUrl) {
this.echo('Current location is ' + this.getCurrentUrl(), 'info');
});
casper.each(viewports, function(casper, viewport) {
this.then(function() {
this.viewport(viewport.viewport.width, viewport.viewport.height);
});
this.thenOpen(screenshotUrls[i], function() {
this.wait(5000);
});
this.then(function(){
this.echo('Screenshot for ' + viewport.name + ' (' + viewport.viewport.width + 'x' + viewport.viewport.height + ')', 'info');
this.capture('screenshots/' + screenshotPaths[i] + '/' + screenshotDateTime + '/' + viewport.name + '-' + viewport.viewport.width + 'x' + viewport.viewport.height + '.png', {
top: 0,
left: 0,
width: viewport.viewport.width,
height: viewport.viewport.height
});
});
});
casper.run();
function pad(number) {
var r = String(number);
if ( r.length === 1 ) {
r = '0' + r;
}
return r;
}
最佳答案
这是工作版本:
var casper = require("casper").create();
var screenshotUrls = ["http://www.google.com", "http://www.yahoo.com", "http://www.espn.com"];
var screenshotPaths = ["google.com", "yahoo.com", "espn.com"];
screenshotNow = new Date(),
screenshotDateTime = screenshotNow.getFullYear() + pad(screenshotNow.getMonth() + 1) + pad(screenshotNow.getDate()),
viewports = [
{
'name': 'smartphone-portrait',
'viewport': {width: 320, height: 480}
},
{
'name': 'smartphone-landscape',
'viewport': {width: 480, height: 320}
},
{
'name': 'tablet-portrait',
'viewport': {width: 768, height: 1024}
},
{
'name': 'tablet-landscape',
'viewport': {width: 1024, height: 768}
},
{
'name': 'desktop-standard',
'viewport': {width: 1280, height: 1024}
}
];
i = -1;
casper.start().eachThen(screenshotUrls, function(response) {
this.each(viewports, function(casper, viewport) {
this.then(function() {
this.viewport(viewport.viewport.width, viewport.viewport.height);
});
this.thenOpen(response.data, function() {
this.wait(5000);
});
this.then(function(){
this.echo('Screenshot for '+ screenshotPaths[i] + viewport.name + ' (' + viewport.viewport.width + 'x' + viewport.viewport.height + ')', 'info');
this.capture('screenshots/' + screenshotPaths[i] + '/' + screenshotDateTime + '/' + viewport.name + '-' + viewport.viewport.width + 'x' + viewport.viewport.height + '.png', {
top: 0,
left: 0,
width: viewport.viewport.width,
height: viewport.viewport.height
});
});
});
++i;
});
casper.run();
function pad(number) {
var r = String(number);
if ( r.length === 1 ) {
r = '0' + r;
}
return r;
}
关于screenshot - 为多个网站拍摄多个视口(viewport)屏幕截图,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/22001700/