如何采取网页从所述壳部的快照？ [英] How to take a snapshot of a section of a web page from the shell?

问题描述

我有一个网页，我需要的的GIF快照在给定时间间隔的一个部分。快照必须整页大小的分辨率，但是正如我所说的，那就只在页面上某一个地方（在这种情况下，它是一个表后）。

什么是抓住这样的网页快照图像的图像的最佳方式？我想只是把它扔进一个cron作业，算了吧，但我不容易看到的一个工具，会使得这种快速的工作。

解决方案：

由于每@爱德华多的优秀的方向我实现了根据各地phantomjs和ImageMagick的（苹果机干净快捷的解决方案：酿造安装phantomjs ＆放大器; BREW安装ImageMagick的）

*注意：如果你想完全删除ImageMagick的只是添加以下rasterize.js： page.cli preCT = {顶：10，左：10，宽度：500，高度：500}

 ＃！在/ usr /斌/ bash的ENV
＃用于PhantomJS  -  rasterize.js来源：http://j.mp/xC7u1Zrefresh_seconds = 30而真实的;做
    date_now =`日期+％Y-％M-％D％H％M`    phantomjs rasterize.js $ 1$ {} date_now -original.png＃只是在第一个参数吸吮外壳的网址
    转换$ {} date_now -original.png-crop 500x610 + 8 + 16$ {} date_now巴纽＃作物ARGS：+为WIDTHxHEIGHT + LEFT_MARGIN TOP_MARGIN
    RM$ {} date_now -original.png    回声得到的图像：$ {} date_now巴纽 - 现在就等着$ {} refresh_seconds秒，下一个图像......
    睡眠$ {} refresh_seconds
DONE
 

和这里是上面所用的phantomjs JS：

  //按如下说明：HTTP：//$c$c.google.com/p/phantomjs/wiki/QuickStartVAR页=新网页（）
    地址，输出大小;如果（phantom.args.length 2 || phantom.args.length→3）{
    的console.log（'用法：rasterize.js URL文件名'）;
    phantom.exit（）;
}其他{
    地址= phantom.args [0];
    输出= phantom.args [1];
    page.viewportSize = {宽度：600，高度：600};
    page.open（地址，功能（状态）{
        如果（状态！=='成功'）{
            的console.log（'无法加载地址！'）;
        }其他{
            window.setTimeout（函数（）{
                page.render（输出）;
                phantom.exit（）;
            }，200）;
        }
    }）;
}
 

解决方案

此问题已经在这里找到答案：
如何获得在python 网站截图

据回答了09，但该选项仍然非常有效。我会尝试一些更多的选择延长。

这些工具将让你完整的网页快照，这可以在以后很容易夹使用ImageMagick。

，你可能有这几天的另一个选择是 Phantomjs 。幻影建要在节点运行一具无头的浏览器，它可以让你把整个页面的图片或只是页面的一个区域。

看看这个例子的：

  VAR页=新网页（）
    地址，输出大小;如果（phantom.args.length 2 || phantom.args.length→3）{
    的console.log（'用法：rasterize.js URL文件名'）;
    phantom.exit（）;
}其他{
    地址= phantom.args [0];
    输出= phantom.args [1];
    page.viewportSize = {宽度：600，高度：600};
    page.open（地址，功能（状态）{
        如果（状态！=='成功'）{
            的console.log（'无法加载地址！'）;
        }其他{
            window.setTimeout（函数（）{
                page.render（输出）;
                phantom.exit（）;
            }，200）;
        }
    }）;
}
 

I have a section of a web page that I need to take a gif snapshot of at a given time interval. The snapshot needs to be full page size resolution, however as I said, it only goes to a certain place on the page (in this case it's after a table).

What would be the best way to grab a page snapshot image image like this? I'd like to just throw it into a cron job and forget it, but I'm not readily seeing a tool that would make quick work of this.

SOLUTION:

As per the @Eduardo's excellent direction I implemented a clean and quick solution based around phantomjs and imagemagick (Mac: brew install phantomjs & brew install imagemagick):

*NOTE: If you want to remove imagemagick altogether just add the following to rasterize.js: page.clipRect = { top: 10, left: 10, width: 500, height: 500 }

#! /usr/bin/env bash
# Used with PhantomJS - rasterize.js source: http://j.mp/xC7u1Z

refresh_seconds=30

while true; do
    date_now=`date +"%Y-%m-%d %H%M"` 

    phantomjs rasterize.js $1 "${date_now}-original.png"  # just sucking in the first arg from shell for the URL
    convert "${date_now}-original.png" -crop 500x610+8+16 "${date_now}.png" # crop args: WIDTHxHEIGHT+LEFT_MARGIN+TOP_MARGIN
    rm "${date_now}-original.png"

    echo "Got image: ${date_now}.png - Now waiting ${refresh_seconds} seconds for next image..."
    sleep ${refresh_seconds}
done

And here's the js used by phantomjs in the above:

// As explained here: http://code.google.com/p/phantomjs/wiki/QuickStart

var page = new WebPage(),
    address, output, size;

if (phantom.args.length < 2 || phantom.args.length > 3) {
    console.log('Usage: rasterize.js URL filename');
    phantom.exit();
} else {
    address = phantom.args[0];
    output = phantom.args[1];
    page.viewportSize = { width: 600, height: 600 };
    page.open(address, function (status) {
        if (status !== 'success') {
            console.log('Unable to load the address!');
        } else {
            window.setTimeout(function () {
                page.render(output);
                phantom.exit();
            }, 200);
        }
    });
}

解决方案

This question has already been answered here: How to get a website screenshot in python

It was answered on '09, but that option is still very valid. I'll try to extend with some more options.

Those tools will get you full page snapshots, which you can later clip using imagemagick easily.

Another option that you might have these days is Phantomjs. Phantom is a headless browser built to be run on node, it will allow you to take a picture of a whole page or just an area of the page.

Take a look at this example:

var page = new WebPage(),
    address, output, size;

if (phantom.args.length < 2 || phantom.args.length > 3) {
    console.log('Usage: rasterize.js URL filename');
    phantom.exit();
} else {
    address = phantom.args[0];
    output = phantom.args[1];
    page.viewportSize = { width: 600, height: 600 };
    page.open(address, function (status) {
        if (status !== 'success') {
            console.log('Unable to load the address!');
        } else {
            window.setTimeout(function () {
                page.render(output);
                phantom.exit();
            }, 200);
        }
    });
}

这篇关于如何采取网页从所述壳部的快照？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！