PhantomJS 能不能实现将浏览器页面的某个div对应的显示区域截图
发布于 10 年前 作者 yakczh 9141 次浏览 最后一次编辑是 8 年前 来自 问答

比如将这个页面 div id=“content” 的内容保存为图片

10 回复

不清楚,不知道这个https://github.com/sindresorhus/pageres能不能搞定

用casperjs的话可以方便地用captureSelector(),phantomjs的话可能要自己调整视窗位置了吧? 自豪地采用 CNodeJS ionic

你也可以用nightmare

var Nightmare = require('nightmare');
var Screenshot = require('nightmare-screenshot');
var nightmare = new Nightmare();
nightmare
    .viewport(1024, 700)
    .goto(pageUrl)
    .use(Screenshot.screenshotSelector(tempPath, '.question-answer-detail'));

@DavidCai1993

    var casper = require("casper").create({
            verbose: true,
            logLevel: "debug",
		    pageSettings: {
         loadImages:  true,
         loadPlugins: false,
         userAgent: 'Mozilla/5.0 (Windows NT 6.1; rv:17.0) Gecko/20100101 Firefox/17.0'
    },
            onError: function(self,m){
                    this.capture("error.png");
                    console.log("FATAL:" + m);
                    self.exit();
                }
        });

截图成功了,但是对应的div里面的图片是空的,这是什么原因

@okoala 运行提示没有模块Weak
npm install weak 没成功

npm ERR! weak@0.4.0 install: node-gyp rebuild npm ERR! Exit status 1 npm ERR! npm ERR! Failed at the weak@0.4.0 install script. npm ERR! This is most likely a problem with the weak package, npm ERR! not with npm itself. npm ERR! Tell the author that this fails on your system: npm ERR! node-gyp rebuild npm ERR! You can get their info via: npm ERR! npm owner ls weak npm ERR! There is likely additional logging output above.

npm ERR! node -v v0.10.34 npm ERR! npm -v 1.4.28 npm ERR! code ELIFECYCLE npm ERR! not ok code 0

@yakczh 我以前也碰到过这个问题,那时解决的办法是在截DIV之前,先截一张整个网页,然后就行了。(感觉这是casper.js的bug?)

@yakczh 应该是你的环境问题,卸载Visual C++ redistributable 然后重新安装 Windows SDK 7 SP1,windows下安装一些模块很麻烦,这种情况下建议使用virtualbox虚拟机,共享开发目录,在linux下运行node。

@okoala 最近在用 nightmare写爬虫,大神能不能推荐点代码看看呢

@juneLLL 爬虫建议找 Python 或者 Java 的吧,Node.js 的好的、成熟的爬虫框架还是比较少的。

@okoala 是的,我也试了好多,但是处处碰壁啊,可参考的进一步学习的资料太少了

回到顶部